Splitting up/merging windows in WPF - c#

I'm new to WPF but I need to implement following functionality:
I have a window that contains one Grid (might be changed to stack panel or something else). In that Grid I have 2 columns, each of them contains another Grid. Lets call them gridFirst and gridSecond. There is also GridSplitter in first column allowing to resize the columns.
I want to provide a button that will allow to separate gridFirst from this window and display it "as it is" in another window. How do I do that?
It would be nice if the new window had a same menu as the original window without me having to copy-paste (that not a good coding practise) all its code to the new window.
Thanks for answers

It sounds to me like you'd want to create a UserControl and put gridFirst in it. That way you can add your user control to your main grid and your window.
If the DataContext of your control is the same then it should look the same where ever you put it.

Related

"Correct" Way to Show New Controls in WPF

I'm designing a small helper utility with a simple UI. I'm working off the following mockup:
The execution flow is meant to be as follows:
User clicks "Other" radio button.
A textbox is presented and user is prompted to write in a response.
My question is: What is the "correct" way to achieve the UI change from the picture on the left to the picture on the right? My options seem to be either create a unique window for each, or have all of the controls on the same window and just play with the visibility of the controls.
There is no "correct" way really. It all depends on your requirements.
If you want the new screen to show up in a new window, then create a new window. If you want it to show up in the same window and simply replace the previous screen with the radiobuttons, then toggle the Visibility property of the individual controls or the parent Panel, preferably using a view model that has either bool or Visibility source properties that you have bound to in your view.

Best way to display groups of data in one form?

I am looking to create a windows form. This form is to display groups of data separately and I was aiming to do so in the same form window rather than have multiple windows open.
For example each group of data is defined by a Job#. A user will want to review X different Job#'s at a time (Range would usually be 1-5, but could be more). I would like to have 4 dataGridViews for each Job# plus various identifying and summed data in text boxes. Initial Example Concept
I was looking into using TabPages/Tab Controls. My initial idea was to have a user click the different tabs to view the data for those jobs that they have pre-selected. However these tabs don't seem to behave like classes from what I can see. Is there perhaps a better way to go about this or some way to have the tabs act like classes? So that each tab has a Job TextBox, 4 Different DataGridViews, etc. So that I can easily create and display any number of jobs?
For example each Tab would have 4 dataGridViews, maybe 8 Text Boxes, Standardized Labels and a Standardized layout.
So would using tabs be a good idea? Using some other WinForm control?
There are at least 2 solutions here:
Create a custom Panel holding all the controls you want (TextBox, DataGridView, ...), design it so that it looks best to you. Then add each of that Panel to each of TabPage of your TabControl.
Create a new custom TabPage and add the custom TabPage to your TabControl.TabPages instead of the standard TabPage.
I think the second approach can be done if you can initialize everything using code (not by drag-n-drop) because to get the drag-n-drop supported, you may need to write a custom TabControl. So the first approach is feasible and OK. You can replace the Panel by a Form, set the Form.TopLevel = false, you can add that form to any container control. Using Form, you can benefit the easiness of drag-n-drop to design and organize your controls.
Here is a little of code which may help you figure out:
public class TabPageClient : Form {
public TabPageClient(){
InitializeComponent();
Dock = DockStyle.Fill;
TopLevel = false;
FormBorderStyle = FormBorderStyle.None;
}
//.... other code
//I think this is important
//You should define some Properties and methods to control the data flowing into and out from your TabPageClient.
//You can also support some method to add/remove the controls dynamically.
}
Take the drag-n-drop requirement into account, I think using UserControl may be better:
public class TabPageClient : UserControl {
public TabPageClient(){
InitializeComponent();
Dock = DockStyle.Fill;
}
}
For UserControl, you should place the class in a separate *.cs file, compile your project and then you can see it in the ToolBox window (at the very top). Just drag and drop it like as other controls.
Personally, I prefer grid-detail views. Something we make heavy use of in our software. The form has a SplitContainer in vertical alignment.
In the top panel, you add a list of some kind (ListBox, ListView, DataGridView...any control into which you can load a list and then react to selection).
In the bottom panel, you have yet more options. Simplistically, you could use a TableLayoutPanel and then setup rows/columns to provide whatever arrangement of embedded controls you like, such as your array of grids to display data. I suppose in keeping with your model, you'd have a single ColumnStyle and four (4) RowStyles. Then in each row, add a grid.
This way, you keep it all in one place...one "screen", if you like (no tabs to flip through). You react to the selection in the list to decide what data to display in the grids. You then just need a bit of code (a class I would hope) that interfaces between the class(es) that provide the data, and the form controls that display it (the grids).
An additional benefit here is that with the list presentation, you can have a lot more than five (5) jobs in play at any one time. In fact, with scrolling, as many as you like (not limited to the number of tabs before the display goes to pot).
Also, you would be re-using the grids. Simply refreshing the displayed data for the list item selected. You could even pre-load and cache it all if freshness is not an issue.
Also consider binding directly to data source if that's an option.

How do I create a Tab Control with no Tab Header in Windows form?

I have created a Windows form using a Tab Control, but it has a header with it. I want to hide it. I am not able to do it using any properties of the Tab Control. Is there any property defined for hiding the tab header for the Tab Control without going through the code?
Use following code to hide the tabs or set these properties in design.
tabControl.Appearance = TabAppearance.FlatButtons;
tabControl.ItemSize = new Size(0, 1);
tabControl.SizeMode = TabSizeMode.Fixed;
You want the tab panels without the feature allowing a user to switch between them, so I suppose you want to create few separate sets of controls to be shown to the user one at a time. You can achieve this in several ways (you can choose one of them if you find it appropriate in your case):
Use several Panel controls instead of several tabs in the TabControl, however, it would be hard to work in the designer, because all the controls would be visible
Use different Forms instead of tabs to keep the layout parts separated. It can be ok, but you may not want to use multiple Forms, so it depends on a specific case.
and finally, the suggested solution:
Encapsulate each set of controls in a UserControl. This allows you to keep each layout separately, so you can easily design each of them without the other controls getting in the way ;). The the code handling each of the layouts would also be separated. Then just drag those controls in the Form and use set their visibilities appropriately to show the one you want.
If none of those suggestions work for you, let me know, so I can look for other possible solutions.
It's more easy as you think, you just drag the panel's window upper, so will be outside of the form.
Use DrawMode: OwnerDrawFixed will hide TabPage header text DrawMode : OwnerDrawFixed
Another way to achieve the same (or similar) is: You can remove tabs from TabControl.TabPages collection and then add the tab you want to show.
During the Form initialization I remove tabs (so into the designer I can easily manage them) and in some control event (as button click) I show the tab the user has to see.
Something like that:
// During form load:
ctrTab.TabPages.Clear();
// ......
// During button click or some other event:
if(rbSend.Checked)
ctrTab.TabPages.Add(pgSend);
else
ctrTab.TabPages.Add(pgReceive);
In this way the user can still see the header tab but just as title of controls group, he can't change/switch the current active tab.

c# winForms open forms inside mainform

I have programmed c# application i will post screenshot. In this main form is 3 buttons which opens different forms. Now i decided to modify this application I want to Make one main form with strip menu which will open this forms. I used this code but i don't like or i'm doing something wrong. I don't like because there is child controls(minimize, maximize, close) in parent (please see second picture ):
Please advice me something. Is MDI good for such job? Thanks!
Sell sell = new Sell();
sell.MdiParent = this;
sell.Dock = DockStyle.Fill;
sell.Show();`
So my problem is that parent form is not filling when i open child form this is creen how to make that it parent form was filled with child form
Seeing your latest edit, I assume the reason that your child form's content doesn't fill the screen even when it's maximized is because your content/layout is not flexible.
Wherever you've placed the controls during Design Mode is where they're going to end up at run time, regardless of how big or small you make the window. If the window is too small to contain all of them, they'll either be covered up or you will see scrollbars. Alternatively, if the window is made larger than necessary, you'll see a lot of empty space.
The way around this is either to set the Dock and Anchor properties of your controls, which causes them to expand and compress to fit the layout of their containing form. You could also place your controls inside a TableLayoutPanel or FlowLayoutPanel control to help manage their layout.
As far as the question you appeared to be asking originally, I still can't tell if you're opposed to the way an MDI application looks, or if you simply don't understand how to correctly implement it. The clarification comment you offered actually makes things less clear to me—you posted a code snippet, but didn't explain what it means. As I wrote in a comment, there's no (non-hackish) way to show a form that doesn't have minimize, maximize, and close buttons (setting the FormBorderStyle property to "None" does this, but I think this is a silly solution that simply allows you to use the wrong control for the job—it won't behave like a form, the user won't be able to move it around like a form, etc. so why use a form?).
If you truly want to have a single application window with changing content in the center, you should create a series of UserControls. You can lay out each user control with the necessary child controls, just like you would with a form (using the fluid layout techniques I discussed above), add each user control to your main form, set each control's Dock property to "Fill" (so that they fill the entire viewing area), and then write code to simply swap out the currently visible user control in your main form's viewing area. The advantage of using a UserControl versus something like a Panel is that you consolidate all of your code into a single control, much like you would with a Form. You could use a tab control, but if you don't want to show any indication that there are multiple forms (which is what your aim appears to be), this would also be the wrong control for the job.
If you literally want to open child forms inside your main form, as your question title indicates, you should indeed be using MDI. If you don't understand how to do this, you'll need to clarify your question further.
Set MDI Container property to true for your parent form. It will help.
Set
FormBorderStyle = None
for your child forms

How to design the UI for settings according to different options in C# WinForm?

This is a .NET winform application question.
I come to this design from time to time. A simple form. On top of the form you have a list of options to select. According to different option chosen, the body of the form displays a unique panel of setting detail.
How to design this UI in Visual Studio neatly? I have two ideas. First idea is to have many panels, each panel contains setting controls. In runtime, hide all panels but the one according to the selection of option. In this solution, it is hard to organize the controls of the form in VS designer. You need to set the form big to hold all the panels. Panels are put one next to each other. There are many runtime loading code to write. For example, when loading the form, you need to hide panels, reset the form size. When you pick an option, you need to relocate the panels and show/hide them. Tedious!
Second idea is to use TabControl. TabControl is good because the tabs are well organized for you. You don't need to relocate panels and resize the form. All you need to do in runtime is to select the right tab according to options. One thing, you need to hide parts of the TabControl from user because after all it is not a real TabControl. Hiding the tab buttons of the TabControl is not hard but I find that after that there is always a big gap between the tab area and the following part on the form.
Dose anyone have a decent way of designing the UI? Maybe not using panels or TabControls but some smarter way? If TabControl is used most of the time, how to hide and show the tab parts of the TabControl and how to set the margin and border size of the TabControl so no big gap exists? Many thanks to any answer and suggestion.
When I need to do this, I put each group of controls in its own UserControl, and then I can use something else to switch between them. See, for example, Implementing a paged Options dialog on my blog.
I suggest you create UserControls for each of your "setting details" and when the user selects an option you load the accordant UserControl. You might have to adjust the forms size, but therefore you can easily manage all the "setting details" in your IDE.
Using user control is a good way to solve your problem. But you need set them probably in panels and play with properties "Visible" and "Dock".
You don't need to Dock them at "Fill" in design mode. You can set this property à runtime or when needed.
Hope this help.
Sounds like you need some design pattern.
Why not create a UI factory that returns your UI objects as needed/required?

Categories

Resources