I'm reading a Windows Forms book and I came to one example which is pretty confusing to me.
Here are two pictures, the first is the initial state, and the second is when the user click the Hide button.
This form contains two split containers, one horizontal, and one vertical, which is in the right panel of horizontal one.
The book says:
One of the best characteristics of docked designs is that they easily accommodate hidden
or modified controls. To implement
this design, two panels are placed in the left region of the
SplitContainer, one named pnlFileList and the other named pnlShow.
However, only one of these panels is shown at a time. The contents of
the rest of the window automatically resize themselves to accommodate
the additional view when it is displayed
private void cmdHide_Click(object sender, System.EventArgs e)
{
splitContainer1.Panel1Collapsed = true;
pnlShow.Visible = true;
}
private void cmdShow_Click(object sender, System.EventArgs e)
{
pnlShow.Visible = false;
splitContainer1.Panel1Collapsed = false;
}
And I made it, but the problem is with the button which appears when the left panel of the SplitContainer is collapsed.
I don't know where to put the panel "pnlShow"
If I put it on the right side of the horizontal SplitContainer control, it will disappear also.
Any suggestions?
The quote from the book doesn't seem accurate to me. You can't place pnlShow inside the "left region" of the SplitContainer because it will not be visible once you set the Panel1Collapsed property to true.
Instead, you can place the pnlShow on the left to the SplitContainer and set its Dock property to Left. Also, you don't seem to actually need a Panel in this case since it only contains one Button. You can simply use a Button only. Anyhow, your form would look something like this in design-time:
Then, your code should work fine.
Some remarks:
Of course, if you decided to use a button without a panel, you'd need to use YourButtonName.Visible instead of pnlShow.Visible.
If you found that the button (panel) on the left covers the SplitContainer, you just need to right-click on the SplitContainer and select "Bring to front".
It's preferred to use "btn" as a prefix for the Button name instead of "cmd". The latter was kind of widely used in the classic visual basic language, because it used to be called CommandButton. In the .NET world, the standard is to use "btn" instead.
Finally, based on what I mentioned in the last point above and the look of the screenshots in your question, this book seems to be quite outdated and was written based on the early versions of the .NET framework, so unless you have to study this book specifically, I would recommend you find a more recent book or tutorials.
Related
It was pretty tough to think a title for this question so I'll try to make a better job explaining myself here.
I needed to create a dynamic Windows Form so that when checkbox gets checked/unchecked, few input fields appear/disappear. As far as I know FlowLayoutPanel seemed to be the best tool to achieve this. So I created a Custom User Control that included a Label and a Textbox. I designed this new Control in VS2013 desginer view:
Since the text on the label can vary in length it is important that textbox begins only when label has already ended. However the result I get at the moment looks like this:
The label should read out "ConnField" instead of "ConnFie". I tried adding these items in FlowLayoutPanel but that resulted in label and textbox not lining up correctly. Are there any attributes/properties that should be set in order to get the expected result? Should I use a container that does it all for me?
On a side note, if there are any other methods to dynamically show/hide elements in the fashion I described above I'd be very happy to use those instead.
For perfect fits you can script the TextChanged event(s) to make sure the TextBox always sits in place and keeps a nice size as well..
I have placed a Label and a TextBox into a Panel for testing. You will probaly not need or want the textBox1_TextChanged event but it was nice for testing..:
private void textBox1_TextChanged(object sender, EventArgs e)
{
label1.Text = textBox1.Text; // this is for testing
}
private void label1_TextChanged(object sender, EventArgs e)
{
textBox1.Left = label1.Right + 6; // <= this is what you need
textBox1.Width = panel2.Width - label1.Width - 8; // <= this is nice to have
}
Of course your offsets may vary..and obviously the Label has AutoSize = true
Edit
Since you commented on the problem of getting the TextBoxes aligned with each other across rows here are a few thoughts about this problem. As Hans noted, you can't have it all:
Complete freedom for the Labels' content
Perfect fits
And aligned Textboxes
The three goals conflict. So you need to make compromises:
If you can restrict the content to a fixed maximum, the result will look best
Sometimes it helps to have a collegue or even a user look at the content to find a shorter way to express the meaning
Ellipsis or abbreviations may help. I both cases you should set a ToolTip to show the full content
Another option is to switch to a narrower Font for some Labels
Instead of one fixed Label size maybe 2 or 3 will help: The look will be a bit jagged but will look a lot better than with completely free sizes.
My goal
I am working on a project in C# using Visual Studio 2013. The project is one that I intend to contain a lot of pages. These pages are all linked together using buttons. My problem is that I cannot come up with an efficient and elegant solution for this.
My attempts
So far I have came up with two potenial solutions to my problem. First I added extra forms and then on button press I hid the current form and displayed the new form, like so:
Form2 frm = new Form2();
frm.Show();`
Form1.Hide();
While this does work, I have two problems with it.
My project will end up with hundreds of forms
The transition between forms looks sloppy. I am aiming for a browser like transition by where all navigation occurs on one window, without opening and closing others.
The second potential solution I tried incorporated the use of Panels. So I essentially created each page on a different Panel. Then the appropriate panel was shown upon a button press and the rest were hidden. Like this:
private void button1_Click(object sender, EventArgs e)
{
mainMenuPanel.Hide();
submenuPanel1.Show();
submenuPanel2.Hide();
submenuPanel3.Hide();
submenuPanel4.Hide();
}
This is exactly what I was looking for however my issue with it is that managing the vast amount of panels quickly became a nightmare. Editing the controls on a Panel that was hidden behind 9 other Panels and as the number of panels in my project was only going to grow - this does not seem like the ideal solution in its current form.
In my head I thought there maybe an option in Visual Studio 2013 that allows me to 'hide' the Panels I am not using on the form, or drag them off the form temporarily. Is that an option in Visual Studio.
If not do any of you know a more efficient and manageable way of achieving this?
Thanks in advance.
If you are stuck using WinForms, your best bet is probably using UserControls. you can actually extend the UserControl class out to be a "page" ie: UserControlPage. This makes the form much simpler in function, but you will need to do some finicky work with handling events /passing data if the controls need to talk to each other.
if you aren't nailed into using Winforms, WPF supports all of this natively, and has wonderful tools for building all the pages you would need, and storing/populating your data, and propagating events.
If you want to have single form with changing content, and you don't want to mess up with panels in one form, then solution is user controls. You will be able to create them dynamically and add to form controls. Also there is no mess, because your form will be very simple - you can have single 'placeholder' control which will be used to dock user control which is currently displayed (e.g. panel control):
private void ShowContent(Control content)
{
placeHolderPanel.Controls.Clear(); // clear current content
placeHolderPanel.Controls.Add(content); // add new
content.Dock = DockStyle.Fill; // fill placeholder area
}
Usage:
private void button1_Click(object sender, EventArgs e)
{
ShowContent(new FooUserControl());
}
You could subclass the Panel class and create as many of those custom panels as needed, then they would be inserted on your Main Form, and managed as you described.
The advantage is that you would be able to individually edit them as a separate user control.
The drawback is that you lose direct event handling of controls on those panels from the main form. You can still define your own events on those panels and delegate the individual control events.
There's always a trade-off somewhere.
Cheers
I want to create simple wizard with 3 pages
Page 1 have just next button
Page 2 have next and previous
Page 3 have previous and finish
I have created the pages and add to them needed buttons and in the events I have call to the next pages, for instance in page one in the button click I added the following code
private void Button_Click(object sender, RoutedEventArgs e)
{
p2 = new Page2();
NavigationService.Navigate(p2);
}
In the main window cs I have changed the inheritance to NavigationWindow instead of Window and in the xaml also. Currently its working but I have 3 questions.
The pages which displayed is part of the main window, how can i avoid it, since when I run it the buttons place is not like I put in the designer? It was changed.
The button currently in the Grid, should I put them in different control (the button place should be like any wizard in the left buttom of the page) ?
How can I avoid the navigation arrows in the page right upper screen?
Thanks!
To answer your questsions in reverse,
3. How can I avoid the navigation arrows in the page upper right screen?
I have an opensource library http://winchrome.codeplex.com/ that re-styles navigation windows in several ways. For example these are all NavigationWindow s
In short you just style the NavigationWindow to only show the parts you want.
2.The button currently in the Grid, should I put them in different control (the button place should be like any wizard in the left buttom of the page) ?
If you look at the styles from WinChrome then you will see that it is just a case of rebuiliding the UI as you want and providing a ContentPresenter to hold your pages. e.g. the VS2012 style applies lots of styles on the window but avoids adding back and forward buttons., whereas the Win7 style rebuilds the back and forwards in a Win7 Style.
If you do this however you will need a means of passing your enabled or visible states to the buttons outside the pages. Take a look at http://www.codeproject.com/Articles/8197/Designer-centric-Wizard-control for how to do this in Winforms. In WPF you could either derive from your Pages to create WizardPage classes with CanBack, CanNext or IsFinish properties, or alteratively define attached properties to do the same (There are examples of how to do this in VS2012.cs where we define the glow color)
And finally
1. The pages which displayed is part of the main window, how can i avoid it, since when I run it the buttons place is not like I put in the designer? It was changed.
I'd need to see some code to comment on how you've done it, but if you look at any of the demo programs in WinChrome then you can see how I've done it without problems.
Good luck!
I have the following Code:
marathonPanel.Visible = false;
resultPanel.Visible = true;
but only the marathonPanel gets invisible and the resultPanel stays invisible.
When I check the value of resultPanel.Visible it is set to false.
I also tried
resultPanel.BringToFront();<br>
resultPanel.Visible = true;
Can anyone help me?
This happens when you design two overlapping panels in Visual Studio Form Designer. It is too easy to drag one panel inside the other and the dragged one becomes the child of the first.
I usually draw the panels in different locations. The first one in the expected place, the second one in a different place, then at Runtime move the second one on the same spot of the first one.
in Form_Load
resultPanel.Left = marathonPanel.Left;
resultPanel.Top = marathonPanel.Top;
This is a common designer accident, caused by Panel being a container control. Overlapping two panels is a problem. Your resultPanel will end up as a child of marathonPanel. So when you make marathonPanel invisible, the child will always be invisible as well.
Use View + (Other Windows) + Document Outline to fix the problem. Drag resultPanel and drop it on the form. Edit the Location property by hand, don't move the control with the mouse or the panel will suck it right back in.
Another way to do it is to intentionally mis-place it so it won't be sucked-up and fix the Location property in the form constructor. A more friendly hack that works better in the designer is to use a TabControl instead. Check the sample StackPanel in this answer.
There is another way to find out such issues .
if you look at *.resx file , it will tell which control is taking place as parent and which is child
Also you can view this thing in Document outline which is available in Visual Studio.
Let's just say that I have many controls on my Form, and when a User clicks on one of them, its height will expand. This means that, currently, when this clicked-control expands, other controls below it will become overlapped by the expanded control.
But what I want to happen, is for each Control below the expanded control to slide down, so that they are below the expanded control again.
I know how to handle sliding, but I just don't know how to make every control except for one move everytime a given control is moved.
Any help at all is greatly appreciated, thank you!
This is what I was thinking:
void newOrderReceived(object sender, EventArgs e)
{
foreach(Control OrderNotificationBox in OrdersPanel.Controls)
{
if(OrderNotificationBox is NotificationBox) // Checks to see if the control is a NotificationBox
{
// Add my code to slide controls down.
}
}
}
But... How do I know if the control is below the expanded control?
Is this how I should go about changing the location of all controls below the expanded control?
Edit: Just had a thought, to check to see if a NotificationBox is below the Expanded NotificationBox, see revised code below:
void newOrderReceived(object sender, EventArgs e)
{
foreach(Control OrderNotificationBox in OrdersPanel.Controls)
{
if(OrderNotificationBox is NotificationBox) // Checks to see if the control is a NotificationBox
{
if(OrderNotificationBox.Location.Y <= ExpandedNotificationBox.Location.Y + ExpandedNotificationBox.Size.Width)
{
// Add my code to slide controls down.
}
}
}
}
But would this be sufficient? Currently, this is working, so I guess I just answered my own question. But, isn't there a better way to do this? A more elegant/efficient way?
Here's a sample of how it should look:
FlowLayoutPanel provides you with dynamic layout where you can resize any control in it and all below controls will slide automatically. There are many strategies to using groups/columns of flow layout panels to be able to achieve the desired look for the whole form. Some googling will reveal some of these.
For instance in the form above, resizing the button1 control simply flows all the below controls to further down on the form. You can try that at the design time also. Drop the form a flow layout panel, drop 3-4 control in the container and start experimenting..
For each expandable content use Panel.
Dock your panels one under another (Use panel1.Dock = DockStyle.Top. For the very bottom panel use panel1.Dock = DockStyle.Fill).
Place your child controls inside of each expandable panel, set inner controls' Anchor properties accordingly.
When you expand one panel, the rest of the panels will adjust automatically. You don't need to code for this. You will only change Height of a panel that you currently expand.
What you need is some kind of 'ExplorerBar' functionality. There are several control libraries that offer that, and I found the article here on the CodeProject that has it for free.