How to add custom controls in WPF using MVVM and DataTemplate?

Question

I am basically using this code and I am successfully adding CheckBoxes (instead of ComboBox that is in the example) to my View. The problem however is that I want to be able to customize (different Content, binding, etc) those CheckBoxes. Right now when I add a CheckBox it adds the default one that is defined in my DataTemplate.

DataTemplate:

<DataTemplate DataType="{x:Type local:CurrencyViewModel}">
    <StackPanel Orientation="Vertical">
        <CheckBox Content="Default"/>
    </StackPanel>
</DataTemplate>

CurrencyViewModel - the code here is NOT used by the program and I am not sure why, but I am pretty sure that this is the problem

class CurrencyViewModel : INotifyPropertyChanged
{
    public CurrencyViewModel(ICurrency currency)
    {   
        CheckBox currencyCheckBox = new CheckBox()
        {
            Content = currency.Name,
        };
     OnPropertyChanged("CurrenciesList");
}

MainViewModel:

public MainViewModel()
{
    foreach (ICurrency currencyin GetAllCurrencies())
    {
        CurrenciesList.Add(new CurrencyViewModel(currency));
    }
}

private ObservableCollection<CurrencyViewModel> _CurrenciesList = new ObservableCollection<CurrencyViewModel>();
public ObservableCollection<CurrencyViewModel> CurrenciesList
{
    get
    { return _CurrenciesList; }
    set
    {
        _CurrenciesList = value;
        OnPropertyChanged("CurrenciesList");
    }
}

Having a CheckBox in a ViewModel is ringing some alarm bells... — goobering, May 13 '15 at 14:59
@goobering hard coding them is out of the question. Is there any better approach than this one? — A Petrov, May 13 '15 at 15:01
For starters get rid of the CheckBox in your VM. You should only be storing the Name as a string in your CurrencyViewModel. Then set the Content property of the CheckBox in your DataTemplate to {Binding Name}. — goobering, May 13 '15 at 15:04
@goobering I did what you told me and it seems that you are correct. Thank you! — A Petrov, May 13 '15 at 15:18

score 1 · Accepted Answer · answered May 13 '15 at 15:02

1

You shouldn't be putting View objects in your ViewModel - it breaks the pattern's intent (separation of business logic from presentation). Checkbox/Combobox choice should be made in the View based on the state, type or data contained by your ViewModel via Binding, DataTemplates, Triggers, etc.

I would re-evaluate your design as it's not compatible with MVVM as a pattern.

answered May 13 '15 at 15:02

toadflakz

7,764
1
27
40

But I need to create controllers dynamically and then link in my first line says that the approach I have taken is the best one. Is it not correct? Should I be creating everything in code behind, because I need some business logic to get the information for each `CheckBox`? – A Petrov May 13 '15 at 15:05
2

The difference between your design and the linked solution is that the linked solution contains only properties to bind to, *not* interface elements. – goobering May 13 '15 at 15:13
Is the layout of every item the same? i.e. `Checkbox` with a currency name? If so, you just need to set the binding on the `Checkbox` in the `View` XAML and expose the currency name via a property in the `ViewModel` which you then bind to. – toadflakz May 13 '15 at 15:15

How to add custom controls in WPF using MVVM and DataTemplate?

1 Answers1