Winforms - how to show/hide elements in designer?

30
votes

I am trying to make a multiple page application using winforms. I decied to use multiple Panels - each panel represents different page, so I can switch between them when I need to display different content.

My problem is about stacking panels in designer view. When I have 2+ full screen panels, they all stack on each other and I can't see the one that I created earlier. Is there any solution to this ? Changing visibility does not affect designers view. Think of it as a photoshop-like option to show/hide layers. I'm using Visual C# 2010 Express.

7
winformsvisual-studiovisual-studio-2010
If you want to select the other Panel, you can just select it from the drop down. Another solution would be to make them smaller or move them somewhere and programatically adjust their size and location as needed or consider using TabControl control. - Lukasz M

7 Answers

36
votes

Several options here:

  1. Use the Document Outline view (View --> Other Windows --> Document Outline) to select the panel you care about. You can right-click on it and choose Bring to Front to put it in front of everything else.
  2. Though it's probably not relevant to what you're doing, you might consider using a TabControl, which you can mess with visually at design time. This is only a reasonable solution if you want your users to be able to manually change which panel they're viewing.
  3. Consider moving your panels into custom UserControl classes and work on them separately. If the content and logic of these panels is reasonably self-contained then you may want to do this anyway just to better restructure your code.

Addendum: You can also use a hack that makes a TabControl's tabs invisible to the user. Put a TabControl on your form, and at run-time set the ItemSize height to 1. This makes it (almost) impossible for the user to change the tabs on their own, but still allows you to change the visible tab in the designer.

myTabControl.ItemSize = new Size(myTabControl.ItemSize.Width, 1);

Note that I called this a hack for a reason: TabControls were not meant to be used this way. It's something that appears to work, but like all hacks it may break at any time so you should only do it as a last resort (and don't blame me if it causes headaches later on...). In short, I do not recommend this hack, I only offer it as a possibility.

6
votes

I use "Bring to front" or "Send to back" under Format > Order to manage this kind of scenario, but you're right, it kind of sucks that visibility is only runtime (AFAIK).

Cheers

1
votes

I am not sure about the right way to do this, but what I do myself in these cases is to make the controls very small and later, on program run, I change their sizes and locations on start.

0
votes

One approach that I've used in this situation is to use the Document Explorer window to bring the panel I'm working on to the front.

0
votes

So you want to be able to show/hide your panel in the VS Designer View (not just when the actual executable is running) correct?

Would something like this help?

If not, then perhaps you could try creating custom user controls instead of panels which would allow you to set the visibility properties as you like or you could resort to using WPF which provides this type of functionality. Click here for more information.

0
votes

If it's acceptable for you, consider using a TabControl control and put each of the Panel controls in a different tab. You can then hide and show correct page by switching between tabs or programatically removing and adding appropriate tab to the control.

You can also consider using two different windows with different layouts and showing switching between them.

If you use more than only a few panels, you can consider putting each of them in a separate control and then just use the controls within the application's form (i.e. add them programatically when needed). This way, you can design each of the controls (so each of the Panel's contents) separately, whitout other Panels visible.

Each of those suggestions would make some UI pieces more separated, which can be desired if each of the layouts you've got is associated with a separate piece of the application. Using those suggestions can also make it much easier to use the deisgner to manage.

-1
votes

Try this.richTextBox1.Visible = false; in your Form1.cs (assuming you are trying to hide a rich text box with the default name "richTextBox1")