I have this form, where the light blue is a flow layout panel and the white is a panel inside it.
.
It looks like this when running:
If you look carefully, you can see a small border around the edge of the white section.
Why doesn't the panel fill the space inside the flow layout panel? I haven't done any coding; I just saw a guy placed the panel over and it automatically filled the space.
It seems that the margin was bugging it. I fixed it by setting the margin to 0, it was 3 by default. Thanks to Jimi.
You should set Panel.Dock to Fill, then it adapts it's size automatically to the flow layout panel. Default for Dock is usaually None, in this case it always keeps the same size.
Related
Image where the blank space is visible. The red is the background color of the flowlayoutpanel where all other panels which are inside it are gray.
From the image could be seen how the flowlayoutpanel leaves blank space between the categories in my menu even though the margins of all panels are set to 0 including the flowlayoutpanel also all labels and buttons margins are set to 0
Managed to fix my problem by implementing it without flowlayoutpanel by using timers :)
Fixed
I'll leave the question open if somebody knows how to fix the flowlayoutpanel situation
I have a C# winforms application that has table layout panel. The panel is set so that there are two columns, with a 75/25 % split. In the larger section is a docked panel that holds some controls, while the smaller section has a docked panel with a single label. We push a wall of text to the label on the right and it is getting jammed up ugly.
I've adjusted the controls on the large section and recovered some space that I want to give over to the label panel. The "Completed" and "Inspected" labels and dropdowns are not in use, and set to invisible currently. I used designer to adjust the split on the table layout panel to be 65/35 %, but the docked panel and the label didn't change position on the layout.
What I want to happen is for the table layout panel to have a larger portion of the split given over to the label and the label to fill the new space when text is set to it.
The results of my efforts haven't gone very far. I adjusted the split %, but the label looks unchanged. It seems to be the exact same size it was before making changes. It looks like the label maintained the same position as well, stuck to the right hand border of the panel. The label definately isn't extending past where it originally ended/started with the 75/25 split.
The sub panel and the label are set up to fill and anchor top/left. The panel is docked to the table layout panel. I was under the impression that the docking and filling would account for the change in the split, but I'm wrong about that I guess. I feel like this whole problem has some root in these settings, but my tinkering with them hasn't changed anything that I can tell.
Following the instructions provided by LarsTech, I adjusted the settings on the layout panel to be absolute pixel value on the left hand side and 100% on the right. I then set the panel anchor to top, right. I set the label itself to dock = fill. The label is now stretching across the entire area covered by the blue arrow.
Thanks again. Would give a +1 to your comment if I could.
On my form I have a Panel control that contains a PictureBox control and a Label control.
The panel is not visible in the image above but it's basically the area around these two controls.
I have set the Anchor property of all these three controls to Top, Bottom, Left, Right so that they follow their parent container's re-sizing behavior.
The L abel control (postbagfolderempty) works properly but the PictureBox (EMPTY!) does not seem to be moving from its original position.
Is there an additional property I need to set?
Update: I changed my PictureBox's AutoSize property to None. It has started to move, but as I try to enlarge my form, it starts sinking into a white area (image below).
Make sure your PictureBox doesn't have SizeMode set to AutoSize.
Anchoring changes the size, if it's autosized it won't change anything
Also, make 100% sure your PictureBox is actually a child of the panel. It's easy to check: select it on the designer and press Esc, it should select the panel.
Update
As per the comments, seems the problem is that you are anchoring to all the sides (thus producing the scaling of the control).
If you want a panel that scales with the form, and controls within the panel that are centered but not scaled along, then anchor that panel to all sides, place the controls inside the panel centered in the designer, and set their anchors to None, that way they won't scale, and since they are not anchored, they will move along when the panel scales (but they won't scale with it, which -seems- it's what you are aiming at)
How do i dock a child control at a bottom right position when compared to the parent control?
I can see that the dockstyle enum has values for
None,Top,Bottom,Right,Left and Fill ...
How can i set for Bottom right ???
perhaps you don't want to dock it bottom-right. Docking changes the position of the control, but also the size to fit in th height or width of the form.
If you want to keep it down and on the right, anchor it.Remove left and top anchors and add bottom and right anchors. Your control will keep there!
** EDIT **
According to OP comment, it must be on the bottom and take all width and have fixed height. then you must take this steps:
To keep it tidy, you need at least 2 controls:
The one that it's on the bottom: dock it to the bottom and set its height.
Other one that use docking style of Fill. This makes it take all the space not occupied by the bottom control.
If you have problems setting it up, use the Layout Window (I hope that's the name in English. My VS is localized) to move them around until it works. Sometimes docking it's a bit nasty and the only way to make it work the way you like is changing the order nad nesting of controls using this layout window.
Use AnchorStyles:
yourComponent.Anchor = ((System.Windows.Forms.AnchorStyles)
((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Right)));
To "dock" in the bottom right, you need to
Dock ControlA on the Right side of the parent, ControlB
Set the Top Padding of ControlA to ControlA.Padding = new Padding(0, ControlB.Height - nTopPadding, 0, 0);
nTopPadding can be whatever you need it to be. For TextBoxes, Labels, and the like, ControlA.Font.Height works the best.
This also works when AutoSize = true. You'll only need to update the padding as needed.
From MSDN documentation for Control.Dock:
A control can be docked to one edge of its parent container or can be
docked to all edges and fill the parent container.
So you cannot dock to two edges - I'm actually not sure what you mean by this.
If you want to keep a control in the bottom right of the screen you might be thinking of the Anchor property, which does let you set multiple edges to anchor the control to.
try setting the Dock to Bottom, Depending on your control you may have to turn autosize off, a label for instance
I'm developing an app for Windows Mobile 5.0 and above, with C# and .NET Compact Framework 2.0 SP2.
I have a WinForm with two panels inside (upperPanel and bottomPanel). I want that upperPanel always fill 2/3 of form's height, and bottomPanel fills 1/3 of form's height. Both panels will fill completly form's width.
I've used this:
upperPanel.Dock = Fill;
bottomPanel.Dock = Bottom;
But upperPanel fills the form completly.
How can I do this? I want, more o less, the same gui on differents form factors and on landscape or protrait mode.
Thank you.
What you need to do is to put the bottom panel on first and set its Dock property to Bottom. Then set the panel's height to be 1/3 of the form's height. Finally, add a second panel and set its Dock property to Fill. The key here is that you want to add the control that will fill the remaining area to be added last. Alternatively, you can play around with the Bring to Front and Send to Back commands in Visual Studio to get the designer to cooperate.
You may also need to hook the OnSizeChanged event for the form and re-set the height of the bottom panel to account for layout changes. It's been a little while since I did compact framework programming, so I'm not sure.
Right click on the upperPanel and select Bring To Front. However, I don't think this will give you the result you want. When you resize, the bottom panel will remain the same height, while the upper panel will stretch to fill the form.
Using your docking settings, with this code might do the trick:
protected override void OnSizeChanged(EventArgs e)
{
base.OnSizeChanged(e);
this.bottomPanel.Height = Convert.ToInt32((double)this.Height / 3.0);
}
Set both panels to "not anchored". That is: Remove Dock-Value and clear the Anchor property. Then, move the controls so they are sized the way you'd like them to be sized.
After that, upon resizing the form, they should resize relatively.
EDIT
Oops, just tried it and sure it doesn't work. I mixed this up with a solution that automatically keeps controls centered within the window...
Well, I'd guess you then have to create a handler for the form's Resize event and manually align the controls after the form has been resized.
Go to Tools, Other Windows, Document Outline. Find the two panels, and swap the order of them. The control that has DockStyle.Fill has to come first for it to be docked correctly. (or last.. never sure which one it is, but it is one of them :p)
This won't solve the always 1/3 and 2/3 issue though... cause the bottom panel will have a fixed height (unless I am mistaken). I think maybe the TableLayoutPanel supports this though...
Update: As noted in the comments, that panel doesn't exist in the compact framework. So, I suppose the easiest solution to this problem would then try to use the docking, but update the height of the bottom panel whenever the size of the form changes.
If you want this to work perfectly you'll need to add some code to the Resize event of the Form which then specifically works out the relative sizes and places the controls in the correct place after a resize.
If you're not worried about losing precision and the forms aren't going to move much you can avoid this by using some relatively smart anchoring. Essentially you're going to have to select a "grower" (the part of the form that gets bigger, the bigger the form gets). In this scenario I would probably anchor the top part to Top | Left | Right and the bottom part to Top | Left | Right | Bottom. This would mean that the lower part of the form will get bigger if the form is expanded. In most cases this is acceptable. If it isn't use the Resize event and some code.
The easiest way to do this is to nest panels. Just set up panels for top bottom and fill. Then use panels within those panels to do the same. The only issues I've had therein are datagrid resizing, which is always a pain anyway. in that case, you have to use some code to resize the datagrid control on the form resize event.
I would like to add a point to #jasonh answer.
For the panel that occupies 2/3 of the form, you will have to set the AutoScroll property of the panel to true.
This will enable the panel to display scroll when the control size exceed the visibility to the user and also ensure the visibility of the smaller panel which is 1/3 of the forms height.
You can get the required design by using nested panels along with few setting with Anchoring and Docking Properties.Follow the following steps:
1) Add the Form and put a Panel1 on it. Set its Dock Property as 'Fill' and ResizeMode as 'Grow&Shrink'.
2) Add Second panel2 and set its Dock Property to 'Bottom', Set the Height and set the Anchor property to 'Top,Left'.
3)Add Third panel and set its Dock Property to 'None', Set the Height and set the Anchor property to 'Top,Bottom,Left,Right'.
Save and Compile. Now all the panels Would maintain their relative Positioning With resizing.