C# resize all elements in form when resizing form

Question

I have this image as the background of the form: http://img811.imageshack.us/img811/3347/31886905.jpg

---

So my form looks like this: http://img823.imageshack.us/i/cisto.jpg/

---

When i resize it it looks like this: http://img820.imageshack.us/i/cistoumanjeno.jpg/

---

Now what I need to do is to put listeners on every rextangle like on the picture: http://img810.imageshack.us/img810/238/18887457.jpg

---

I made transparent panels and put them on form to match the rectangles on the image (on image, panels are green so you can see where they are): http://img809.imageshack.us/i/paneli.jpg/

---

but when I resize the form it turns like this: http://img810.imageshack.us/i/paneliumanjeno.jpg/

---

anchor and dock properties don't work because they rely on parent container and here rectangles are on background image.

---

QUESTION: I would like to do something like "relative-resize and position". Is that posible? So when I resize form, all the panels fits the rectangles on image.

Answer 1

Use a proportion system. Knowing where everything is when the form is in its normal size, you can figure out where it will be when you resize.

So if the rectange (with regular size) needs to be drawn at X: 125 Y: 130, and the normal size is X: 500 Y: 550
then the proportion would be

x: 125 / 500 = x / NewXSize
y: 130 / 550 = y / NewYSize
or
x = NewXSize * (125 / 500)
y = NewYSize * (130 / 550)
(Not Tested)
Max

Answer 2

Building on and expanding mazzzzz's answer, I suggest something like:

class MyForm : Form
{
:
List<Panel> m_panels = new List<Panel>();
List<Point> m_points = new List<Point>();
Size m_originalSize;

IEnumerable<Panel> FindPanels()
{
    foreach(var control in Controls)
    {
        Panel panel = control as Panel;
        if (panel != null)
            yield return panel;
    }
}

void SnapshotOriginalLayout()
{
    m_originalSize = ClientSize; 
    foreach(var panel in FindPanels())
    {
        m_panels.Add(panel);
        m_points.Add(panel.Location);
        m_points.Add(new Point(panel.Size));
    }
}

Point [] GetTransformedPoints()
{
    var points = m_points.ToArray();
    Matrix m = new Matrix();
    m.Scale(ClientSize.Width / (float) m_originalSize.Width,
            ClientSize.Height / (float) m_originalSize.Height);
    m.Transform(points);
    return points;
}

void ApplyTransformedPoints(Point [] points)
{
    int index = 0;
    foreach(var panel in m_panels)
    {
        panel.Bounds = new Rectangle(points[index],
                                     new Size(points[index + 1]));
        index += 2;
    }
}

void ResizePanels()
{
    if (m_originalSize.Width == 0 ||
        m_originalSize.Height == 0)
        return;

    ApplyTranformedPoints(GetTranformedPoints());
}

protected override void OnShown(EventArgs e)
{
    SnapshotOriginalLayout();
    base.OnShown(e);
}

protected override void OnResizeEnd(EventArgs e)
{
    base.OnResizeEnd(e);
    RescalePanels();
}
:
}

Code above is currently untested. If you have any menus, toolbars, status bars, etc. you may have to tweak the m_originalSize value as well as subtract an offset from the panel.Location stored in the m_points list.

Hope this gives you a good starting point.

Answer 3

This code works, only bad thing is when I am resizing main form, it "strugles". When I move mouse cursor while resizing it is not going smooth, it "strugles". And after half a second after i stop resizing panels are where they should be.

Image while resizing: http://img13.imageshack.us/img13/3408/whileresizing.png

Image when I stop resizing, and after half a second after stop resizing: ttp://img99.imageshack.us/img99/7718/resizef.jpg

any suggestions about that or I should just leave it that way? There are lots of calculations here so thats why it strugles.