Dynamically generate UI Components using Array of Structures in C#

Question

I am c++ developer and from last week i started working on C# and WPF. I have a very simple query about using structures in my code. I have a label and button in my xaml class which should be dynamically generated. I had developed in c++ as follows:

typedef struct 
{
     String ChannelName;
     bool available;
} Voltage_Channel;

Voltage_Channel *m_voltageChannels;

Voltage_Channel redhookChannels[6] = {
  {"", false},
  {"VDD_IO_AUD", true},
  {"VDD_CODEC_AUD", true},
  {"VDD_DAL_AUD", true},
  {"VDD_DPD_AUD", true},
  {"VDD_PLL_AUD", true},    
};

m_voltageChannels = redhookChannels;

int cnt = 0; 
int MAX_ADC =6;

while(cnt < MAX_ADC)
{
    m_labelChannel[cnt] = new Label(m_voltageChannels[cnt].ChannelName); //Generates labels based on count
    m_setButton[cnt] = new TextButton("Set"); //generates Buttons based on Count
    m_setButton[cnt]->addButtonListener(this); // Event for the Button

    if(m_voltageChannels[cnt].available)
    {
        addAndMakeVisible(m_labelChannel[cnt]); //Displays if channel is available
        addAndMakeVisible(m_setButton[cnt]);
    }
}

This generates the label and button 6 times and if channel is available then displays it.

I have the following in my Xaml File:

<Label Grid.Column="0" Content="{Binding VoltageLabel}" Name="VoltageLabel" />
<Button Grid.Column="1" Content="Set" Command="{Binding Path=SetButtonCommand}" Name="VoltageSetbtn" />

Label and Button Property:

string voltageLabel;
public string VoltageLabel
{
        get { return voltageLabel; }
        set
        {
            voltageLabel = value;
            OnPropertyChanged("VoltageLabel");
        }
}

    // Event for Set Button Click
    private ICommand mSetCommand;
    public ICommand SetButtonCommand
    {
        get
        {
            if (mSetCommand == null)
                mSetCommand = new DelegateCommand(new Action(SetCommandExecuted), new Func<bool>(SetCommandCanExecute));

            return mSetCommand;
        }
        set
        {
            mSetCommand = value;
        }
    }

    public bool SetCommandCanExecute()
    {
        return true;
    }

    public void SetCommandExecuted()
    {
        // Body of the method
    }

Is it possible to dynamically generate these controls using structures, looking at how I had done it in my C+ application???

Please help

Beside: When developing for Windows 8 you can use XAML from C++, too. Why do you use C#? — Beachwalker, Oct 11 '12 at 11:43
@Stegi: I am not developing for Windows 8. I have used JUCE in my c++ code and I have to do the same thing in WPF :) — StonedJesus, Oct 11 '12 at 11:48

score 1 · Answer 1 · edited May 23 '17 at 11:43

All the controls available through declarative XAML-way can be added by code at runtime, too. So you can add them in a while/for/foreach loop to your view. All you need is the parent container.

A more elegant way would be to create a template within xaml and bind that template to the list containing the data.

A hint for auto-generated UI: Maybe it is an option to use the builtin PropertyGrid Control from M$ for your data (as seen in the Properties Window of Visual Studio). You can attach standard/custom editors for your data elements. There are also several "self-made" Property-Grids available, too.

Here is a link to a simple example how to use a template: http://wblum.org/listbind/net3/index.html

This question is also related to runtime control generation: Add WPF control at runtime

Thanks for the reply. Is it possible for you to show me a sample code of how I can start? :) — StonedJesus, Oct 11 '12 at 11:31

score 1 · Answer 2 · answered Oct 11 '12 at 11:33

In C# controls are simple objects. Ultimately, every feature present in XAML can be coded. XAML is just a more convenient way to describe UI objects and the relations between them.

Each component has a children property that you can use to add sub elements. Adding a button to a form should work like this:

Button myButton= new Button();
form.Children.Add(myButton);

score 1 · Accepted Answer · answered Oct 11 '12 at 13:08

In WPF it is possible to directly map controls to be shown against objects, so for example I currently have,

<DataTemplate DataType="{x:Type ViewModel:Clock_t}">
     <View:Clock_tView/>
</DataTemplate>

and this will automatically wrap my Clock_t class with a ClockT_View in the UI.

However you tend to find that you need a some helpers for your View and you don't want to pollute your Model, so there is a pattern that says to introduce something in the middle, a ViewModel if you will. This pattern is called MVVM and is explained in Josh Smith's MVVM pattern article

To answer your question, yes you can do something like this

<ItemsControl ItemsSource="{Binding m_voltageChannels}"/>

and that will automatically try to display the VoltageChannel, but unless you have a DataTemplate you just get the result of its ToString() (usually the class name) six times. Instead either define a DataTemplate higher up in the resources somewhere, or just try

<ItemsControl ItemsSource="{Binding m_voltageChannels}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <TextBlock Text="{Binding ChannelName}"/>
                    <CheckBox Content="Is available?" 
                         IsChecked="{Binding available}"/>
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

Dynamically generate UI Components using Array of Structures in C#

3 Answers3