Question Why oh why won't my checkboxes show up properly?

[Deevee]

Afternoon all!

Now everybody knows that creating GUIs that have lots of repeated elements that are evenly spaced by hand is for chumps; all the cool kids use loops and add them at runtime.

Given that being one of the cool kids is one of my top priorities I decided to give this a go - as my current project involves creating a grid of check boxes and then chunking them together under one event handler.

In my experience - an nice effective way of dealing with grid like structures (2D arrays if you will) is to use nested loops such as:

	For intY = 0 To 9
			For intX = 0 To 9
				Dim chk As New CheckBox
				chk.FlatStyle = FlatStyle.Flat
				chk.Name = intX.ToString + intY.ToString
				Dim currpoint As New Point((intX * 20), (intY * 20))
				chk.Location = currpoint
				chk.Text = chk.Name
				gbxDisplay.Controls.Add(chk)
			Next intX
		Next intY

Now if you are anything like me you would probably expect that to give you a nice layup of check boxes in a square. Instead - i get this:

Now there were no errors flagged up by VB (I'm using visual studio 2005 by the way) so i spent about a day trying to find what the problem could be. Eventually i decided i did not understand For loops properly and tried again using a different structure (which i generally do not prefer)

		j = 10
		Do While (j > 0)
			j = j - 1
			i = 10
			Do While (i > 0)
				i = i - 1
				Dim chk As New CheckBox
				chk.FlatStyle = FlatStyle.Flat
				chk.Name = i.ToString + j.ToString
				chk.Text = chk.Name
				Dim currPoint As New Point((i * 45), (j * 45))
				chk.Location = currPoint
				gbxDisplay.Controls.Add(chk)
			Loop
		Loop

And blow me it worked just fine!

Now why the hell should that work but the first one not? Maybe because the loop is "running backwards" (i'll come back to this in a second) So i ran a little experiment

		For intY = 0 To 9
			For intX = 0 To 9
				Dim btn As New Button
				btn.Height = 30
				btn.Width = 30
				btn.Name = intX.ToString + intY.ToString
				btn.Text = btn.Name
				Dim pntPoint As New Point((intX * 45), (intY * 45))
				btn.Location = pntPoint
				gbxDisplay.Controls.Add(btn)
			Next intX
		Next intY

which renders this:

As you would expect.

Now if we come back to the Do loop - but run it forwards

		j = 0
		Do While (j < 9)
			j = j + 1
			i = 0
			Do While (i < 9)
				i = i + 1
				Dim chk As New CheckBox
				chk.FlatStyle = FlatStyle.Flat
				chk.Name = i.ToString + j.ToString
				chk.Text = chk.Name
				Dim currPoint As New Point((i * 20), (j * 20))
				chk.Location = currPoint
				gbxDisplay.Controls.Add(chk)
			Loop
		Loop

you get this

Which can only lead me to conclude that there is something up with check boxes and going backwards. Is there some property that I need to change to make it work? Have i missed out on the big checkbox joke that everyone else is in on? Is it something to do with "layers" or "z-order" (if you follow my meaning)?

Also what do you think is going on with random bits of my screen disappearing; if you look carefully at the images with the check boxes in them you may be able to spot that the group box and its title are being obscured by something; even when there are only 10 of them showing up - its like there is a label there with text set to " " or something.

Now then - before you ask - yes i have checked to see that in the first instance it goes around the loops properly and not just drop out after one round of the outer loop. Secondly - I can hear some people saying "If the Do loop works - why not just use that" well - personal preference for one, i think its "more correct" to use a For structure here then a Do structure (please do correct me if i am wrong) and finally if it is breaking when the other stuff works ok i fear it may allude to a larger more subtle problem with my program so i would like to get to the bottom of it.

Any tips or pointers on this would be much appreciated as it has been driving me crazy all weekend! I have probably missed something *really* obvious...
Have a happy Monday folks

Thanks

D

 

[cjard]

Your checkboxes Z-order is such that each column covers the column to the right

I added some colour to show my point:

    For intY As Integer = 0 To 9
      For intX As Integer = 0 To 9
        Dim chk As New CheckBox
        chk.FlatStyle = FlatStyle.Flat
        chk.BackColor = Color.FromArgb(255, 255 / (intX + 1), 255 / (intY + 1), 255 / (intX + intY + 1))
        chk.Name = intX.ToString() & intY.ToString()
        Dim currpoint As New Point((intX * 20), (intY * 20))
        chk.Location = currpoint
        chk.Text = chk.Name
        Me.Controls.Add(chk)
      Next intX
    Next intY

See how much blank space after the text each box has? its covering the one to the right

Now make Autosize = true:

    For intY As Integer = 0 To 9
      For intX As Integer = 0 To 9
        Dim chk As New CheckBox
        chk.FlatStyle = FlatStyle.Flat
        chk.BackColor = Color.FromArgb(255, 255 / (intX + 1), 255 / (intY + 1), 255 / (intX + intY + 1))
        chk.Name = intX.ToString() & intY.ToString()
        Dim currpoint As New Point((intX * 20), (intY * 20))
        chk.Location = currpoint
        chk.Text = chk.Name
        Me.Controls.Add(chk)
      Next intX
    Next intY

As you can see, spacing 20 pixels away from the last one doesnt give you enough space to represent the box anyway: box width, 20px, text width, another 20px