Click here to Skip to main content
Click here to Skip to main content

Designing Resizable Windows Forms in Visual Studio .NET

, 2 Sep 2001
Rate this:
Please Sign up or sign in to vote.
Using the Splitter and Panel controls, Anchor and Dock control properties in Windows Forms.

Introduction

Designing resizable forms in managed VS7 Windows applications is very simple - we don't need a layout manager, just use Splitter and Panel controls, new Dock and Anchor properties, and a few lines of code to get resizable forms in any configuration.

Consider a Windows form which contains:

  • StatusBar with number of panels.
  • TreeView control which may be resized using Splitter.
  • ListView control which may be resized using Splitter Picture Box (shown with blue color) which should be always square.
  • RichTextBox control which should fill all place remaining from the PictureBox.

Such a form is shown below in two different states:

Sample Image 1

Sample Image 2

Here are the steps to make the form:

  1. Create new managed Windows application. In my sample, I use C#.
  2. Add StatusBar control to the form (in my sample, the control's name is statusBar).
  3. Set its Dock property to Bottom.
  4. Set StatusBar ShowPanels property to true.
  5. Add number of panels to the StatusBar.
  6. Set the BorderStyle of the first panel to Raised, BorderStyle of the last panel to None.
  7. Set the Text of the last panel to "" and the width to 20. This panel is a placeholder for the Resize Grip. The width of the first panel will be set dynamically at run time.
  8. Set the BorderStyle of all other panels to Sunken.
  9. Add the function ResizeStatusBar to the form:
        // Resize status bar (keep all panels except first in right side).
        private void ResizeStatusBar()
        {
            int n = statusBar.Panels.Count;
    
            if ( n > 1 )
            {
                int nRightWidth = 0;    // width of panels 1,2...
    
                for ( int i = 1; i < n; i++ )
                {
                    nRightWidth += statusBar.Panels[i].Width;
                }
    
                if ( statusBar.Panels[0].MinWidth < statusBar.Width - nRightWidth )
                {
                    statusBar.Panels[0].Width = statusBar.Width - nRightWidth;
                }
            }
        }
  10. Add the Load and Resize message handlers to the form and call ResizeStatusBar from them.
  11. Add a Splitter control to the form (splitStatus). Set its Dock property to Bottom and Enable property to false. Result - the Splitter is placed between the StatusBar and the other part of the form and cannot be moved at run time.
  12. Add the Panel control (panelTop) to the top part of the form and set its Dock property to Fill.
  13. Add the TreeView control (treeView) to the top part of the form and set its Dock property to Left.
  14. Add the Splitter control (splitTop) to the top part of the form. Its Dock property is automatically set to Left. Set Splitter to desired position (to do this, resize TreeView control).
  15. Add the ListView control (listView) to the right part of the form. Set its Dock property to Top. In my sample, I set its View property to Details and added the number of columns.
  16. Add the Splitter control (splitRight) to the right part of the form, under the ListView control. Set its Dock property to Top.
  17. Add the Panel control (panelRightBottom) to the right part of the form, under the Splitter, and set its Dock property to Fill.
  18. Add the PictureBox control (pictureBox) to the right-bottom part of the form and set its Anchor property to Top, Bottom, Left. Fill its image (in the sample, I just changed the control's background color).
  19. Add the RichTextBox control (richTextBox) to the form near the PictureBox and set its Anchor property to Top, Bottom.
  20. Add the function ResizeRightBottomPanel to the form:
        // Resize controls in right-bottom panel.
        // Ensure that image is always square and text box
        // fills other part of panel.
        private void ResizeRightBottomPanel()
        {
            pictureBox.Width = pictureBox.Height;
    
            richTextBox.Left = pictureBox.Right + 10;
            richTextBox.Width = richTextBox.Parent.Width - richTextBox.Left;
        }
  21. Add the Resize message handler for the panelRightBottom control. Call ResizeRightBottomPanel from it. Make the same call also from Form1_Load and Form1_Resize.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Alex Fr
Software Developer
Israel Israel
No Biography provided

Comments and Discussions

 
GeneralMy vote of 5 Pinmemberdiogenesgil18-Apr-13 7:23 
GeneralMy vote of 5 Pinmembermanoj kumar choubey20-Feb-12 23:58 
GeneralResizing without Coding Pinmembervkhaitan6-Sep-08 19:52 
GeneralThank you Pinmembernamedpipes7-Oct-07 6:45 
Not entirely sure what this Delfi thing is, something from India maybe?
 
At any rate, a clear and simple tutorial on leveraging Windows Forms was sorely needed and greatly appreciated.
 
Thank you for your efforts!
 


Generalresizing makes windows disappear Pinmemberkarin thues26-Apr-07 23:24 
Questionconfused Pinmembervincent_so26-Oct-06 16:43 
AnswerRe: confused PinmemberAlex Fr26-Oct-06 20:46 
GeneralAhh Finally PinmemberAshley Dawson10-Nov-04 13:29 
GeneralRe: Ahh Finally PinsussAnonymous12-May-05 0:14 
GeneralRe: Ahh Finally Pinmembervidhyaravichandar12-Aug-09 18:03 
GeneralAnother Delphi ripoff PinmemberAnonymous6-Sep-01 10:28 
GeneralRe: Another Delphi ripoff PinmemberAnonymous10-Sep-01 4:12 
GeneralRe: Another Delphi ripoff PinmemberAnonymous8-May-02 4:55 
GeneralRe: Another Delphi ripoff PinsussAnonymous11-Oct-02 14:46 
GeneralRe: Another Delphi ripoff PinsussAnonymous21-Oct-02 10:24 
GeneralRe: Another Delphi ripoff Pinmemberrajbow27-Feb-04 6:05 
GeneralRe: Another Delphi ripoff PinmemberCode Monkey3-Sep-02 4:57 
GeneralRe: Another Delphi ripoff Pinmemberluanzhu13-Nov-02 7:55 
GeneralRe: Another Delphi ripoff PinmemberVladimir L.16-Dec-02 12:23 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web02 | 2.8.140821.2 | Last Updated 3 Sep 2001
Article Copyright 2001 by Alex Fr
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid