GroupboxesAndMore

Edit 2 …
Older Version Newer Version

JanetTerra JanetTerra Dec 3, 2009

This is Part 4 of a 4 Part Series


What is a Checkbox?


All radiobuttons within the same window are seen as one radio-set, or group. From the helpfile

It is possible for only one radiobutton in a radio-set to be "set" at one time. The groupbox allows the window to have multiple radio-sets of radiobuttons. Only one of all radiobuttons in a groupbox will be allowed to be in a set state. Click on one to set it, and all the others will be reset.

In the demo being used for this tutorial, we'll define three groups (sun/cloud, yellow flower/pink flower, ladybug/caterpillar). Each of these pairs will be contained in a separate groupbox. The groupbox is declared before the window is opened:

GROUPBOX #handle.ext, "label", x, y, wide, high

All radiobuttons that lie within the groupbox will be recognized as being in the same radio-set. Notice that the code doesn't change. We have already included the Reset of the Other Radiobutton in the Set This Radiobutton code. But, now, we can see 3 distinct choices offered in the 3 sets of radiobuttons. 

 ' Demo to Illustrate Groupboxes 
 Nomainwin 
 WindowWidth = 800 
 WindowHeight = 600 
 
 UpperLeftX = Int((DisplayWidth-WindowWidth)/2) 
 UpperLeftY = Int((DisplayHeight-WindowHeight)/2) 
 
 Radiobutton #main.rbtn1, "Draw Sun", [drawSun], [eraseSun], 20, 530, 100, 24 
 Radiobutton #main.rbtn2, "Draw Cloud", [drawCloud], [eraseCloud], 150, 530, 100, 24 
 Groupbox #main.gbx1, "Celestial", 10, 510, 250, 50 
 Radiobutton #main.rbtn3, "Draw Yellow Flower", [drawYellowFlower], [eraseYellowFlower], 280, 530, 112, 24 
 Radiobutton #main.rbtn4, "Draw Pink Flower", [drawPinkFlower], [erasePinkFlower], 410, 530, 108, 24 
 Groupbox #main.gbx2, "Agricultural", 270, 510, 250, 50 
 Radiobutton #main.rbtn5, "Draw Ladybug", [drawLadybug], [eraseLadybug], 540, 530, 100, 24 
 Radiobutton #main.rbtn6, "Draw Caterpillar", [drawCaterpillar], [eraseCaterpillar], 670, 530, 100, 24 
 Groupbox #main.gbx3, "Entomological", 530, 510, 250, 50 
 Graphicbox #main.gb, 1, 1, 791, 500 
 
 Open "The Radiobuttons" for Window as #main 
 #main, "Trapclose [endDemo]" 
 #main.gb, "Down" 
 
 'Draw the Blue Sky 
 #main.gb, "Color Darkblue; Backcolor Darkblue; Place 0 0" 
 #main.gb, "Boxfilled 790 250" 
 
 'Draw the Green Ground 
 #main.gb, "Color Darkgreen; Backcolor Darkgreen; Place 0 250" 
 #main.gb, "Boxfilled 790 500" 
 Wait 
 
 [endDemo] 
 Close #main 
 End 
 
 [drawSun] 
 Gosub [drawSunRoutine] 
 Gosub [eraseCloudRoutine] 
 Wait 
 
 [drawCloud] 
 Gosub [drawCloudRoutine] 
 Gosub [eraseSunRoutine] 
 Wait 
 
 [drawYellowFlower] 
 Gosub [drawYellowFlowerRoutine] 
 Gosub [erasePinkFlowerRoutine] 
 Wait 
 
 [drawPinkFlower] 
 Gosub [drawPinkFlowerRoutine] 
 Gosub [eraseYellowFlowerRoutine] 
 Wait 
 
 [drawLadybug] 
 Gosub [drawLadybugRoutine] 
 Gosub [eraseCaterpillarRoutine] 
 Wait 
 
 [drawCaterpillar] 
 Gosub [drawCaterpillarRoutine] 
 Gosub [eraseLadybugRoutine] 
 Wait 
 
 [drawSunRoutine] 
 #main.gb, "Color Yellow; Backcolor Yellow" 
 For angle = 10 to 360 Step 10 
 #main.gb, "Place 200 125; North; Turn ";angle 
 #main.gb, "Go ";Int(Rnd(1) * 20) + 60 
 Next angle 
 #main.gb, "Place 200 125; Circlefilled 50" 
 Return 
 
 [eraseSunRoutine] 
 #main.gb, "Color Darkblue; Backcolor Darkblue" 
 #main.gb, "Place 40 0; Boxfilled 300 210" 
 Return 
 
 [drawCloudRoutine] 
 #main.gb, "Color White; Backcolor White" 
 For i = 1 to 10 
 x = Int(Rnd(1)*100) + 600 
 y = Int(Rnd(1)*100) + 80 
 #main.gb, "Place ";x;" ";y 
 width = Int(Rnd(1)*10) * 5 + 50 
 height = Int(Rnd(1)*10) * 2 + 20 
 #main.gb, "Ellipsefilled ";width;" ";height 
 Next i 
 Return 
 
 [eraseCloudRoutine] 
 #main.gb, "Color Darkblue; Backcolor Darkblue" 
 #main.gb, "Place 550 50; Boxfilled 750 200" 
 Return 
 
 [drawYellowFlowerRoutine] 
 #main.gb, "Color Green; Backcolor Green" 
 For x = 295 to 305 
 #main.gb, "Line ";x;" 315 ";x;" 375" 
 Next x 
 #main.gb, "Color Yellow; Backcolor Yellow" 
 For angle = 0 to 360 Step 60 
 #main.gb, "Place 300 300; North; Up; Turn ";angle 
 #main.gb, "Go 20; Down; Circlefilled 15" 
 Next angle 
 #main.gb, "Color Pink; Backcolor Pink" 
 #main.gb, "Place 300 300; Circlefilled 10" 
 Return 
 
 [eraseYellowFlowerRoutine] 
 #main.gb, "Color Darkgreen; Backcolor Darkgreen" 
 #main.gb, "Place 265 265; Boxfilled 335 380" 
 Return 
 
 [drawPinkFlowerRoutine] 
 #main.gb, "Color Green" 
 For x = 495 to 505 
 #main.gb, "Line ";x;" 315 ";x;" 375" 
 Next x 
 #main.gb, "Color Pink; Backcolor Pink" 
 For angle = 0 to 360 Step 60 
 #main.gb, "Place 500 300; North; Up; Turn ";angle 
 #main.gb, "Go 20; Down; Circlefilled 15" 
 Next angle 
 #main.gb, "Color Yellow; Backcolor Yellow" 
 #main.gb, "Place 500 300; Circlefilled 10" 
 Return 
 
 [erasePinkFlowerRoutine] 
 #main.gb, "Color Darkgreen; Backcolor Darkgreen" 
 #main.gb, "Place 465 265; Boxfilled 535 380" 
 Return 
 
 [drawLadybugRoutine] 
 #main.gb, "Color Red; Backcolor Red" 
 #main.gb, "Place 100 400" 
 #main.gb, "Ellipsefilled 80 50" 
 #main.gb, "Color Black; Backcolor Black" 
 #main.gb, "Place 80 400; Circlefilled 5" 
 #main.gb, "Place 90 390; Circlefilled 5" 
 #main.gb, "Place 90 410; Circlefilled 5" 
 #main.gb, "Place 110 385; Circlefilled 5" 
 #main.gb, "Place 105 400; Circlefilled 5" 
 #main.gb, "Place 110 415; Circlefilled 5" 
 #main.gb, "Place 125 392; Circlefilled 5" 
 #main.gb, "Place 125 408; Circlefilled 5" 
 #main.gb, "Line 136 396 150 380; Circlefilled 3" 
 #main.gb, "Line 136 404 150 420; Circlefilled 3" 
 Return 
 
 [eraseLadybugRoutine] 
 #main.gb, "Color Darkgreen; Backcolor Darkgreen" 
 #main.gb, "Place 50 375; Boxfilled 155 425" 
 Return 
 
 [drawCaterpillarRoutine] 
 #main.gb, "Color Darkcyan; Backcolor Darkcyan" 
 x = 620 
 For i = 1 to 4 
 y = 400 - 10 * (i/2 = Int(i/2)) 
 #main.gb, "Place ";x;" ";y 
 #main.gb, "Ellipsefilled 50 20" 
 x = x + 30 
 Next i 
 #main.gb, "Color Black; Backcolor Black" 
 #main.gb, "Place 616 400; Circlefilled 4" 
 #main.gb, "Place 624 400; Circlefilled 4" 
 Return 
 
 [eraseCaterpillarRoutine] 
 #main.gb, "Color Darkgreen; Backcolor Darkgreen" 
 #main.gb, "Place 590 375; Boxfilled 750 425" 
 Return

Now the visual display matches the code.