== Introduction ==

When you use Grid''''''Bag''''''Sizers, controls may get spaced more than you want for a couple of non-obvious reasons.

The first thing you might wish to check is the empty cell size. Grid''''''Bag''''''Sizers have a default empty cell size value of (10, 20). It means that:

  1. If you add a small control to a Grid''''''Bag''''''Sizer, say, a 5x5 button,   the sizer cell will always occupy at least 10x20.

  1. If you add controls to non-adjacent rows, say, to rows 5 and 7, and don't add anything to row #6, the row #6 will be a 20px-height empty space. In an analogous way, empty cols will always have a width of 10px.

  1. You can change the default empty cell size value using the Set''''''Empty''''''Cell''''''Size(width, height) method of the Grid''''''Bag''''''Sizer. Passing a width, height of 0, 0, for example, would make the rows 5 and 7 I mentioned above look like they are adjacent (and the 5x5 button would be placed in a 5x5 cell).

The second thing is related to spanning. Consider the following Grid''''''Bag''''''Sizer (the cell/empty cell sizes now won't make difference):

{{{
+--------+--------+--------+--------+--------+
|        |        |        |        |        |
+--------+--------+--------+--------+--------+
|        |        |        |        |        |
+--------+--------+--------+--------+--------+
|        |        |        |        |        |
+--------+--------+--------+--------+--------+
}}}

Now if you add something with a width of 100px to pos (0, 0) with a span of (1, 2), the Grid''''''Bag''''''Sizer will use 100px/2 = 50px as the minimum width of all cells below the spanned cell:

{{{
+--------+--------+--------+--------+--------+
|   <-100 px->    |        |        |        |
+--------+--------+--------+--------+--------+
| <50px> | <50px> |        |        |        |
+--------+--------+--------+--------+--------+
| <50px> | <50px> |        |        |        |
+--------+--------+--------+--------+--------+
}}}

Now for the tricky thing. If you add something with a width of 75px to pos (1, 0), the Grid''''''Bag''''''Sizer will still use at least 50px for the other cells, no matter if you add something to them or not:

{{{
+---------------------+--------+--------+--------+
|      <-125 px->     |        |        |        |
+-------------------- +--------+--------+--------+
| <-75 px -> | <50px> |        |        |        |
+------------+--------+--------+--------+--------+
|   <50px>   | <50px> |        |        |        |
+------------+--------+--------+--------+--------+
}}}

A way to work around this would be to "split" cells; Since the standard Grid''''''Bag''''''Sizer hasn't a Split() method, in this example you'll need to increase the span of (0, 0):

{{{
+--------+--------+--------+--------+--------+
|           <-100 px->              |        |
+--------+--------+--------+--------+--------+
| <25px> | <25px> | <25px> | <25px> |        |
+--------+--------+--------+--------+--------+
| <25px> | <25px> | <25px> | <25px> |        |
+--------+--------+--------+--------+--------+
}}}

And now if you add something with a width of 75px to pos (1, 0) (notice that now we need a span of (1, 3), the Grid''''''Bag''''''Sizer will use at least 25px for the other cells (and things will look closer):

{{{
+--------+--------+--------+--------+--------+
|           <-100 px->              |        |
+--------+--------+--------+--------+--------+
|        <- 75px ->        | <25px> |        |
+--------+--------+--------+--------+--------+
| <25px> | <25px> | <25px> | <25px> |        |
+--------+--------+--------+--------+--------+
}}}

And yes, the pictures above refer only to horizontal spanning, but vertical spanning behaves the same way.

-- [[Tacao]]  <<DateTime(2005-11-30T21:17:04)>>