Creating a dynamic user interface?

Question

First of all, I am a backend developer, but they introduce me to the interface design. I create only one panel (form) in the application. I will have to dynamically add / remove other elements from the form based on what the user selects for the previous options. For example, a drop-down list of clients appears at the top of the panel. I need to configure which other dropdown menus will be displayed as soon as the user makes a choice. I will have a minimum of 90 different configurations. Each configuration will contain about 50 parameters. What is the best way to handle this situation in C #?

Someone from my company suggested using a new form for each configuration, on SO I saw people say that they use user controls, and in another place - dynamically put the controls in a list and create content in this way. Some of these suggestions seemed contradictory ...

Can anyone suggest a “right” way to do this? To put this in perspective, I had only ever built one form before, and it was very simple. (This is a desktop application using .net 4.0)

Edit: this is in Winforms

Answer 1

Is it WinForms or WPF?

In any case, everything that you do in the designer, you can do at runtime. Adding controls is just creating new objects and assigning properties:

Winforms:

Button btn = new Button(); btn.Name = "Dynamic Button"; btn.Id = "DynButton" btn.Width = 50; btn.Click = {...}; [...] panel.Controls.Add(btn); // panel is a parent container control. You have to have a parent for you button. 

etc .. WPF is almost the same - controls, parents, containers, etc.

In your case, you may have a set of initially hidden panels with all things inside, and showing / hiding them depends on the logic of the stream.

Good luck

Answer 2

When developing a form that requires a large number of components, there are various methods that you can use to get the desired result as you learn. Considering some possibilities ...

Method 1. Create separate forms for each configuration

This is a good idea, because after the user makes a choice, you can create a new instance of the desired form, but setting up all the individual forms will take some time, but it is not difficult.

Method 2. Create multiple panels for each configuration

This works similarly to the one method, except that you first hide all the panels, and then display the panel that the user selects. You can pre-create panels and just hide or show, or you can do this programmatically at runtime. (It is wrong to have multiple panels with components hiding, in my opinion, if you do the panels non-programmatically)

Method 3; Programmatically creating the necessary components

You can simply write code to create the desired components based on user choices.

Example:

 if(comboBox1.SelectedIndex == 0) { ComboBox selection1 = new ComoboBox(); selection1.Location = new Point(XXX,YYY); //Set location //You can add the events for the combobox, set up the properties form1.Controls.Add(selection1); //Add the component to the form or panel that you want it displayed on //Write code to dynamically create next object(s).... } else if (comboBox1.SelectedIndex == 1) { //Programmatically create components for selection2 } 

Of these, I think Method 1 would be the easiest because it just placed the components on the form, however it would take a lot of time. In my opinion, programming will be, in my opinion, the most elegant if you keep the code well organized for various possibilities and you do not have numerous forms or panels. You will only mess with the components. However, creating components that programmatically assign properties can also take a long time.

I am not 100% sure what the most formal approach is for this, but these are just some ideas.

Hope this helps.

Answer 3

Not being a big C # guy, I can't give you some sample code, but based on past experience, it looks like you're looking for a Decorator Pattern .

The Decorator template allows you to dynamically create your objects at runtime rather than compile time. You can use this to create your forms / buttons / no matter what you need, with what was previously entered.