Generating an image of squares?

Hi,

I'm having some trouble to generate this image, with my code:

http://img81.imageshack.us/img81/6639/imagejm8.jpg

My current problem is that I can't get the outer spacing around the green squares to appear. I've defined "g" as the outer spacing of the green squares, except its not producing the results that I need. Also I have trouble trying to generate the middle rectangles, which are double the width of the squares.

Can someone please help me with these problems?


Here's my code:

Code:

---

namespace asn
{
    public partial class Question : Form
    {
        public Question()
        {
            Text = "Question ";
            BackColor = Color.Blue;
            ResizeRedraw = true;

            SetStyle(ControlStyles.UserPaint, true);
            SetStyle(ControlStyles.AllPaintingInWmPaint, true);
            SetStyle(ControlStyles.DoubleBuffer, true);
        }

        protected override void OnPaint(PaintEventArgs e)
        {
            Graphics grfx = e.Graphics;
           
            grfx.SmoothingMode = SmoothingMode.HighQuality;
            grfx.PixelOffsetMode = PixelOffsetMode.HighQuality;

            int cx = ClientSize.Width;
            int cy = ClientSize.Height;

            int half_point = cx / 2;
            int s = 10;
            int g = 20; //for the outer gap

            if (cx > half_point)
            {
                SolidBrush black_brush = new SolidBrush(Color.Black);
                Rectangle rect = new Rectangle(0, 0, half_point, cy);
                grfx.FillRectangle(black_brush, rect);
            }

            //Generate the small squares
            for (int i = 0; i < cx; i++)
            {
                i += s;
                for (int j = 0; j < cy; j++)
                {
                    SolidBrush green_brush = new SolidBrush(Color.GreenYellow);
                    grfx.FillRectangle(green_brush, i, j, s, s);

                    if (i == half_point)
                    {
                        grfx.FillRectangle(green_brush, half_point, j, s * 2, s);
                    }
                    j += g;
                }
               
                i += 10;
            }
        }
}

---

a) is the size of the control fixed? if not, you hardcoded g to 20, but the width/height changes.
b) you are generating way too many green squares (cx * cy)
c) you should call Dispose() on all those brushes you create, or just use the static class Brushes to use what you want.

The size of the image is not fixed, its designed to stretch. While its stretching its suppose to add more squares as it stretches on the x and y axis.

having looked at the img you provided may i suggest that the "rectangles " in the middle are not rectangle but 2 squares side by side ?

this may make your life easier.