CODEWITHSUNDEEP
.netwpfxaml
Saman Hakimzadeh Abyaneh
Saman Hakimzadeh Abyaneh

Reputation: 882

How to write a template for Items of an ItemsControl

I have an IEnumerable which is passed to a page, I wanna show this list on my page, I can simply set ItemsSource of a listbox to it and a list of strings will be shown

But I want to put a checkbox beside each item to make strings selectable with those checkboxes (Like how you add contacts to a SMS in android). I can put two listboxes there and bind their scroll to each other and then set ItemsSource of one of them to IEnumerable and add checkboxes to second listbox foreach item. But it's awkward!

Now, first of all which control is better for this task ItemsControl or ListBox (I know ListBox is an ItemsControl)? And then how can I write such template for items of listbox/Itemscontrol?

I searched throw internet and all I found were examples with datatemplates! but I don't have any data to bind! I'll pass an IEnumerable to a Page, and then I'll set Itemssource of Listbox/ItemsControl to it. I expect the ItemsControl/Listbox to put a checkbox beside each item.

Upvotes: 0

Views: 134

Answers (2)

Daniel
Daniel

Reputation: 11054

You'll need to wrap the data into another class that has a bindable property for your DataTemplate's checkbox.

For example:

<ItemsControl ItemsSource="{Binding YourList}">
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <CheckBox Content="{Binding TextValue}"
                IsChecked="{Binding IsChecked}" />
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>

The ViewModel for each item in the IEnumerable may look like:

class Checkable : ViewModelBase {

  private bool _isChecked;
  private string _textValue;

  public bool IsChecked {
      get {
        return _isChecked;
      }
      set {
        _isChecked = value;
        OnPropertyChanged("IsChecked");
      }
    }

  public string TextValue {
      get {
        return _textValue;
      }
      set {
        _textValue = value;
      }
    }
  }

The ViewModel for your UserControl would have an IEnumerable like:

public List<Checkable> YourList;

Whether you use a ListBox or an ItemsControl is a matter of what type of functionality you're looking for (I think ItemsControl is what you're looking for here though).

Upvotes: 0

trinaldi
trinaldi

Reputation: 2950

HierarchicalDataTemplate may be your answer.

I wrote a UserControl which have only a Menu inside it. In order to template/style the MenuItens that would be inserted at runtime, I used the HierarchicalDataTemplate as stated above.

So, inside my <UserControl.Resources> tag I inserted the code below. Be aware that the code is only a mini preview of what you actually can do! (WPF is very customizable!)
The code:

<HierarchicalDataTemplate DataType="{x:Type ViewModel:CmpMenuViewModel}" ItemsSource="{Binding MenuSubItem}" >
        <HierarchicalDataTemplate.ItemContainerStyle>
            <Style TargetType="MenuItem">
                <Setter Property="Command" Value="{Binding Comando}" />
                <Setter Property="CommandParameter" Value="{Binding Texto}"/>
            </Style>
        </HierarchicalDataTemplate.ItemContainerStyle>
        <StackPanel Orientation="Horizontal">
            <Image Source="{Binding Imagem}" />
            <AccessText Text="{Binding Texto}" />
        </StackPanel>
</HierarchicalDataTemplate>

The <StackPanel... bit is my actual template.
My style resides inside <HierarchicalDataTemplate.ItemContainerStyle>. Don't forget to change the <Style TargetType=> to your actual TargetType!

Best regards,
Tiago

Upvotes: 1

Related Questions