A Windows Form application displays a main form. This main form contains few different Panel controls. Depending on some condition in that form one of these Panel controls is to be made active while the others are made invisible.
First panel contains a DataGridview, Second panel contains controls to display the details of the DataGridView. On Add button click (or) On selecting a record in DataGridView the second panel should be visible. I am using Visible property to show and hide panel, but the gap is showing there as shown in screenshot.
Please suggest best way to handle this.
You just need the panels to share the same location. You probably don't want to do that at design-time, as it makes future maintenance of the form difficult.
In the Form.Load event, set the location of the bottom panel to match the location of the top panel.
PanelDetails.Location = PanelDataGrid.Location;
Now when you hide one and show the other, they'll appear in the same place.
The smartest way is to keep the panels separate at the designer. This way any editings made on them can be done more easily, and all actual objects can be seen immediately.
In the designer, set the other panels' Visible properties to False, excep the first one on the top.
Form.Load:
Set all the other panels' locations to match the location of the first panel (on the top)
Set the form's height to match a desired height, which fits to your heightest panel
Use the buttons to toggle panels visibility (and possibly the form height too)
Related
So I have three panels all stacked on top of each other in the same location in a windows form application.
Each time I add another panel on top it becomes a child of the previous panel. This means each panel cannot be shown independently, ie, to show panel 2 I must first show panel1 (the parent). I'm fairly sure this is what is happening. However I need to be able to call panel2.show(), whilst panel 1 is hidden.
Is there a way to work around this?
This is a WinForms designer issue. You can either try moving the panels around and set the position in the properties or enter code behind and set the parent-child relationships manually.
basically don't just drag and drop panels on top of each other. Try to programmatically code their locations. Look for this kind of code in your Form.Designer.cs this.panel2.Controls.Add(this.panel3); and delete them.
Add all your panels in the form part which is supposed to be at the bottom.
this.Controls.Add(this.panel1);
this.Controls.Add(this.panel2);
this.Controls.Add(this.panel3);
This should be able to put all panels as form children.
How would I go about creating a program that contains a button. This button does the following function:
When clicked, it extends the Form size and adds what I want added onto the form.
The extended form can also resize itself back to normal.
Example here would be a gif of how Steam does so.
https://gyazo.com/7330b65d05573208db0eb71a7587d21f
See how it does that addition here.
Extension in Picture --
First design the form in its expanded view. Put everything that belongs to the red box (in your example) into a panel. Set all control's 'Anchor' properties below this box to "Bottom". Then you simply have to set the .Visible property of the panel to true or false, and at the same time, adjust the form's size. When you hide the panel and reduce the form's size, the controls below then panel will move up and close the gap.
OK, this is driving me a bit nuts at this point. Time to ask the crowd:
I have a form that consists of: two vertical "halves" created by a SplitContainer. Inside the bottom "half" / SplitContainer panel... I have:
A set of fields/controls for the user to fill out, contained within a panel.
Below that, a panel containing buttons for "submit", "cancel"...and one that's "show/hide". This "show/hide" is intended to show/hide the panel I just described in point 1 above.
What I want to happen is: when the user clicks to "hide" the panel of controls, not only do those controls vanish, but also:
The panel containing the submit, cancel and show/hide buttons moves up (so that we don't have this big blank space where the now-hidden panel once was).
The form resizes itself vertically so as to make up for the now-hidden panel and the fact that we've moved the bottom controls upwards.
I have no problem getting the panel of controls/fields to show/hide. But I can't seem to figure out how to accomplish the other two tasks. I've tried various combinations of AutoSize, AutoSizeMode, and Dock options.
Any suggestions?
If you put all your controls into a FlowLayoutPanel where the children are arranged vertically, then hiding some controls should cause the "lower" controls to move up the page.
You might still need to write some code to resize the form itself once the optional content has been hidden or before it's shown.
I am trying to overlap panels so that whenever I click a button A certain panel will be visible.
However doing this job is very tricky as because the panels doesn't overlap.
for ex. I have panel 1 and panel 2:
I make panel 2 the same as panel 1,
Whenever I position them on the same position...
Sometimes, the panel 2 becomes a member of panel 1 and whenever I set the visibility of panel 1 to true panel 2 also shows up.
What I want is that the two panels to overlap each other.
"Btw, I'm making a vertical tab that's why I thought that hiding, unhiding the panels might be my best approach.
Is it possible to make the panels overlap each other?
The designer is fighting you do get them overlapped. You need to use a little trick to stop the bottom panel from sucking up the overlapping panel. Put it overlapping panel somewhat off towards the upper-left so they are truly overlapped. Then put it in the right spot by adding code to the form constructor:
public Form1() {
InitializeComponent();
panel2.Location = panel1.Location;
panel2.Size = panel1.Size; // optional
}
Another way to do it is with View + Other Windows + Document Layout. You can drag and drop the inner panel to the outer container (form). You will however have to edit the Location property by hand.
It is absolutely possible to have overlapping panels.
The problem you're facing is that the GUI editor treats your panel as containers (that is true) and as long as you place something (including other panel) within a panel it is "nested" in this container.
To avoid this behavior first place one panel and position/size it appropriately. Then right-click on it and choose "Lock controls". That will lock all current form controls and you will be able to put new controls -- including panels -- directly over them, without any fear that something will be nested or somehow placed inside an existing container.
And of course your controls can overlap -- consider only the order or control creation, that will also define the z-order of them in the form -- controls added later and drawn later and thus are positioned on top of those added earlier.
EDIT: Unfortunately I wasn't completely right with my answer. Locking panels does not prevent them from sucking up the controls places entirely within them. But in case of a partial overlap both containers are created on the same level of deepness, so the problem does not exist in case of overlapping panels, as it was asked in the question.
The Panel has a property called Location, which you can modify to fit your needs. As long as you manage to place your Panel so that it is given the correct parent, you can change the position by altering the Location property later. There's really no need to put design code into the constructor or anything such.
And to place the panel in the correct parent, just have the parent selected and double click the Panel control in the toolbar, rather than dragging it into the form manually. There's really no need to try to fight the designer on this one.
I have a user control that has:
a) a buttons panel at the top (it always has to be visible)
b) a panel with controls that are dynamically added and re-sized at run-time. The controls can be many, so the panel has to be scrollable.
This user control will be hosted in a form, with the following requirements:
a) The initial size of the form will try to fit in maximum part of the dynamic content.
b) On changing the form size, the control has to be re-sized accordingly.
I had played with various anchoring, docking, and auto-sizing and I don't quite get it working in the way I want to. Sometimes, it is the scrolling that messes up, sometimes it is something else.
What combination of anchoring, docking, and auto-sizing of the panels, usercontrol, form should work best to achieve the desired outcome?
I succeeded to meet the requirements. Here is my solution:
The dynamic panel is anchored to the top and the bottom of the control. It does not AutoSize, it manually changes its MaximumSize and PreferredSize after change in the contents.
The form hosts the form using:
cntrl.AutoSize = true;
cntrl.AutoSizeMode = System.Windows.Forms.AutoSizeMode.GrowAndShrink;
cntrl.Dock = System.Windows.Forms.DockStyle.Fill;
The form subscribes to a custom control's event that notifies for the preferredHeight and it changes its own Height accordingly.
I'd go with a table layout panel. You can specify two rows by one column with the exact size for the buttons at the top and fill the rest with the bottom. Then put put either a normal panel or a flowlayoutpanel for the dynamic content in that area.
Without knowing the specifics of your problem I find multiple fill docked split containers with one fixed panel and/or a fixed slider usually creates a really handy resizing experience. You can also collapse panels very effectively too.