.NET - Correct UI Structure - winforms

I'm working on a C# application's UI that has the following structure:
Main Form (MDI Parent)
Tree View
Multiple MDI Childdren, each containing:
Custom User Control
I'd like to separate the form's canvas space allocated for the Tree View from that where the MDI Children are allowed to move in. To that extent, I tried a SplitContainer and setting the MDI Child's TopLevel field to 'false', but, besides the fact that newly created MDI Children were created behind the old ones, I also had issues with them not being cleared properly from the screen and other weird issues.
As I don't have lots of experience with UIs in C#, is the path I am taking correct? Would it be easier to change the above structure so that it doesn't use MDI anymore, or is there a simpler way of dividing the canvas between the tree view and the MDIs, other than the SplitContainer?
Cheers,
Alex
UPDATE: Actually, the solution seems to work quite nicely, thanks! I'll probably be able to stop the widgets from moving in the wrong place by placing a simple check.
Besides that, is there any way in which I could make the TreeView resizable without involving a SplitContainer (because of the reasons mentioned in the post)?

Add a Panel to your Main Form and Dock it to the Left. Now add your TreeView to the Panel. Resize the Panel as necessary. Now your MdiChildren will take up the empty space to the right of the Panel...
*You can actually simply Dock the TreeView itself to the Left side of the Form, but the Panel approach would allow you to place other controls in that left side area as well. Just depends on your UI layout.

Related

Wpf panel layout - one child, several positions

I am working on a WPF panel derivative with custom layout logic and sometimes it might be that component should be visible in two places, when following that layouting logic. Both instances of the same component will be partially cropped. Is it possible to do this - lay out a child component in two different places during the arrange pass?
I think that the panels behaviors are for arrange items in a view, and not for copy the items. I think this is not possible. If you copy a visual element then it will not be the same. If you want get this effect you may use a VisualBrush and paint some region with that, and set to the brush the control that you may want to copy. Using VisualBursh you will see a control copy, but you will not be able to modify it. The other way is using a custom control for making this effect. Other way could be using two different custom panels, both with the same items source (in the case that be the ItemsPanel for some collection).
Hope this answer helps to you...

Is it possible for WinForm controls (Panel,etc.) to grow like a webform control?

I'm converting an app from ASP.NET WebForms to WinForms. There is one asp.net page which contains a ListView/Repeater that contains several custom controls, which in turn contain a ListView with other custom controls. Basically the layout looks like a TreeView, but on each node/leaf there are few controls like comboboxes, etc.
When this is in ASP.NET, the page automatically lays itself out, so it is several screens tall - if I add 20 buttons into a Panel, it will grow and the browser will get scrollbars.
I'd like to do the same thing in a WinForms application - so I'll have a user control that will contain a lot of controls in a some variation of Panel (Flow, Table layout), and the controls might have another controls inside them, etc.
The problem is, that when I make winforms app, each control has specific height in the design time. I'd like some user controls to be able to grow with their contents - so they'll add up. In the main Form, there should be a vertical scrollbar, just like in the web browser when the generated page is taller than the screen.
I'd just like to get some general pointers in the right direction. Thanks.
Use Anchor and Dock container properties.
Yes, to expound on Anchor and Dock...try this
-Place a Panel on an empty form, and set its dock property to Top
-place a textbox in the panel, and Dock it to Full...it should fill the whole top panel
-Place a splitter on the form, and if not already docked correctly, set its dock to top
-place another panel below the splitter, and set its Dock to Fill
-place another textbox inside the lower panel and fill it as as well
Now you have a form with two resiable textboxes and will resize when the form does.
*you may have to set the textbox MultiLine property to true but not sure.
Hope this helps.
Anchor the controls to the parent. Anchoring all four sides will cause it to stretch.
If the Anchoring and Docking answers don't work for you, there is another option. It's not pretty, but you can access a control's properties and change them dynamically during runtime. You'd do something like: if(listBox.Items.Count > [yourVal]) listBox.height = [yourFormula] or something.
It's been a while since I've done a Win Form (and I don't have my IDE fired up at the moment) but I'm pretty sure there's even a ScrollPanel or other scrolling control that you can set on your form.
That said, when you're working with WinForms, the less scrolling you can make your users do, the better.

Automatic proportionate resizing of Windows Form Components?

I have a Windows Forms form in C#.
It is just like a regular Windows GUI application. However I am facing problems making the different components on the form resize themselves according to the window size. I mean I do not exactly know which property of the component is to be changed.
I have a tabPage in the form. The tabPage contains a splitcontainer which has 2 panels in it.
The left panel contains a treeView and the right panel has components like radio buttons, textboxes, comboBox and buttons,etc
When I run my application and resize the window (either by dragging a corner of the window or by hitting the maximize button on top right corner) the Windows Forms form and the tabPage expand but the split container doesn't. It stays where it was. Also I want to anchor the split container so that if I shrink my window, the split cointainer still remain on top left. I am sorry I cannot put screenshots here.
Just set the Anchor property of the SplitContainer to Top, Left, Right, Bottom. Or experiment setting the Dock property to Fill.
Have you tried using a TableLayoutPanel? Windows Forms doesn't have great layout support (compared with, say, Java and WPF) but TLP works reasonably well - until you find a situation where it doesn't do what you want, and then it's a pain :)

Can I make WPF grid controls opaque at design time?

So I'm just starting out with WPF, and I'm really annoyed by the fact that if I lay two Grids on top of one another, the top Grid isn't opaque. It makes designing extremely annoying. Can this be turned off somehow?
I'm just building your standard Winforms STYLE application, but in WPF. I'm just trying to start bridging the gap here. In Winforms(and VB) you'd always have group boxes or something on your form, and then depending on some user context, one of those group boxes would be on top. Its how I've designed forms since time immemorial. One of two things must be true here:
A) This is not the recommended way to design Windows going forward with WPF, but I don't understand what you're supposed to do
B) There is some property to make the Grids opaque so I can build the Window in the style that I'm used to.
I'm fine with answers that solve either A or B. If I'm not doing things the right way because they've changed, then please enlighten me.
Update: So it turns out, I can make the grid opque by setting the background color, but now it seems like I'm locked into a White background as opposed to sticking with the system colors.
You could use SystemColors to make the control background colour match (rather than being white).
I don't understand why you want to put one grid on top of another though. In WPF you generally use a single grid to stack multiple visual elements within one region. Can you explain why you want to hide things in the background with foreground elements?
It sounds a little like you're implementing a tab control -- switching between pages of controls depending on focus. Have you experimented with the new TabControl?
I'm moving from WinForms to WPF development wherever possible and have found that in doing so it's taken some readjustment. WPF has a completely different way of laying things out and now that I'm more comfortable with it, I think it's superior. I'm guessing you just need to ride the learning curve a little longer.
Hope that helps.
EDIT: In response to your comment, I imagine you can have a tab control without tabs, though I haven't tried it myself (might be worthy of another question on SO). Tab controls are headered controls, meaning that they have a header item and a content item. In this case, the header is the tab button, the content is the page item. You can specify a ControlTemplate that details how these items should be displayed relative to one another.
Interestingly, many other types of common GUI element are also headered controls:
Menu items - The menu item text/icon is the header, and the optional submenu is the content
Tree view - Each node is the header, and optional children are within the content
Group box - The header is, well, the header and the content is, well, the content :)
Note that in the case of menu items and tree views, the type may recursively nest within itself. This is quite elegant and can give some wildly different presentation options over the same logical model with only changes to the control template.
For more information read about HeaderedContentControl and HeaderedItemsControl
You could use the following:
<Grid Background="{DynamicResource {x:Static SystemColors.WindowBrush}}">
<!-- content -->
</Grid>
This will respond to changes in the system colors on the fly (the DynamicResource does this).

Winforms user control getting clipped when in another user control (sometimes)

The problem is fairly simple, but is best illustrated visually. Note that all screen shots are from the Visual Studio 2005 design surface. I've noticed no difference when I actually run the application.
Here is my user control (let's call this UC-1):
The buttons on the control are set to anchor to Bottom + Right.
Here is what it looks like when placed onto a particular parent user control (UC-A):
Please disregard the difference in colors and such. Some styling is done in the user control's constructor.
Notice the bottom of the control is getting clipped. The instance of the consumed control on the parent is set with a "FixedSingle" border. Notice also that the consumed control is taller than the original, indicating that the buttons bottom anchor settings are being respected, but are essentially overshooting where it should be.
To confirm this is definitely a problem on the parent control, notice another user control (UC-2) containing a data grid view when placed on the same parent:
Again, the instance of the consumed control is set with a "FixedSingle" border which helps illustrate the clipping. The datagrid is properly anchored to the Bottom Right. To reinforce the perplexity of this problem, here's the first user control (UC-1) when placed on a different parent user control (UC-B):
alt text http://i38.tinypic.com/2rnyjd0.png
Here's the second "consumed" control (UC-2) when consumed by a form:
Notice, no clipping this time.
I have spent many hours searching and experimenting to resolve this. I have exhausted the various settings of margins, padding, sizes (min/max), locations, anchors... etc. I can not for the life of me figure out why this one user control is causing child user controls to clip like this.
Another strange thing I noticed was that when I do an UNDO on the parent user control design surface (where the controls are misbehaving), the clipped user control instances actually shift location even though the undo action is unrelated to those controls. For example, if I make the main containing control larger, then undo, a couple of the child user controls jump up. They appear to move about as far as they are being clipped. Very suspicious.
Does anyone have any idea what is going on??
A very interesting problem!
Does your problem parent (UC-A) override any of the methods around sizing or client areas?
Or has UC-A got a negative value for the bottom value of Padding or Margin ?
Is there anything else docked at the bottom edge of UC-A? Perhaps, something that has a negative size?
Or, does UC-A set the constraints of its child controls? If the minimum height of the panel is forced too large, you would get this result.
Hope this is helpful! If not, is there any chance you post the source to UC-A ?
I was having the exact same problem and found your post while searching for a possible solution. Although I'm pretty sure that this is a bug in winforms, I found a bit of a workaround. Just put everything in your user control inside a panel, dock the panel to full, and do your anchoring inside the panel. This seems to alleviate the problem, although my button does tend up to show up at a slightly different size than it should in the parent control. Very weird. I compensated by making the button smaller in the designer, and it stretches wider by a few pixels in the parent control for some unknown reason. Hope this helps.
Assuming the parent control in question is not a standard .NET framework type, but a custom one, I'd guess that it is mixing up client and screen co-ordinates somewhere in it's logic. But that's just a guess.

Resources