Resizing contents inside DevExpress Docking Panels

Question

I am attempting to add three panels to a window using a Devexpress Docking manager and dockable panels. Here are the current results:

The three panels are placed and sized how I would like them however their contents will not correctly resize as I resize the window. This first image indicates this by the Picturebox that fails to fill the window. My current attempt to regulate this is: (Panel3 refers to a panel that contains pictureBox1. which in turn is contained by dp3.)

  void dp3_SizeChanged(object sender, EventArgs e)
  {
     panel3.Size = panel3.Parent.Size;
     pictureBox1.Width = dp3.Width;
     pictureBox1.Height = dp3.Height;
  }

The Same is true for the Controls Window. I have controls that do not appear unless the window is grossly oversized.

The controls are contained in 4 seperate panels that are themselves contained in the dockable window.

How do I make things appear the correct size and location whendocking and resizing?

Answer 1

Go throught this DevX article - Designing Resizable Windows Forms in Visual Studio .NET-2, that i like most for understanding about layout in Winforms.

You should set the Anchor and Dock properties on the controls in the forms.

The Anchor property controls which edges of a control are "bound" or "tied" to the corresponding edges of its form.
For example, if you set Anchor to Bottom, the distance between the control's bottom edge and the bottom of its parent will not change, so the control will move down as you resize the form.
If you set Anchor to Top | Bottom, the control will resize vertically as you resize the form.

To make a control resize with the form, set the Anchor to all four sides, or set Dock to Fill.

You can set the control's Dock property to Fill. This will cause the control to fill it's parent container.

You may still need to write some code to handle laying out the child controls. You can either do this by handling the Resize event, or by using a container that supports resizing for you (such as FlowLayoutPanel or TableLayoutPanel).

Use your Control's Anchor property. You'll probably need to set it to all sides, Top, Bottom, Left, Right, if you want it to resize according to parent control in all four directions

---

If you want to Maintain the controls Aspect Ratio on Resize, You'll need to store off the aspect ratio somehow, whether it's something known to you at design time or if you just want to calculate it in the constructor of the form after InitializeComponent(). In your form's Resize event,