WPF - Very basic ListBox.ItemTemplate Question

Question

Ok, this is an embarassingly simple-looking problem, but is driving me crazy. I'm learning about DataTemplating and am trying to apply a very VERY simple ItemTemplate to a ListBox.

However, when I run my app, the template is completely ignored and I just get the standard-looking listbox, whereas in fact I'd expect to see a list of checkboxes with 'Test' along side.

I've tried this several times and always the same result. I've checked several resource on Google and all have the same kind of syntax for defining and ItemTemplate on a ListBox, so I really cannot see where I'm going wrong.

Code...

<Grid x:Name="LayoutRoot">
    <ListBox x:Name="TestList"
        SelectionMode="Multiple">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <CheckBox Content="Check this checkbox!"/>
                    <TextBlock>Test</TextBlock>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
        <ListBox.Items>
            <ListBoxItem>Bob</ListBoxItem>
            <ListBoxItem>Jim</ListBoxItem>
            <ListBoxItem>Dave</ListBoxItem>
            <ListBoxItem>Larry</ListBoxItem>
            <ListBoxItem>Tom</ListBoxItem>
        </ListBox.Items>            
    </ListBox>
</Grid>

Any help greatly appreciated. Sorry for such a dumb-seeming question, but I've really fallen at the first hurdle here :(

AT

Answer 1

ItemTemplate wont work when you put ListBoxItem directly as items. General concept is you databind a CRL collection to the ListBox.ItemsSource and then specify the ItemTemplate. Check the below code.

 <Grid x:Name="LayoutRoot">
        <ListBox x:Name="TestList"  SelectionMode="Multiple">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <CheckBox Content="Check this checkbox!"/>
                        <TextBlock Text="{Binding}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
            <ListBox.Items>
                <sys:String>Bob</sys:String>
                <sys:String>Jim</sys:String>
                <sys:String>Dave</sys:String>
                <sys:String>Larry</sys:String>
                <sys:String>Tom</sys:String>
            </ListBox.Items>
        </ListBox>
    </Grid>

where sys is xmlns:sys="clr-namespace:System;assembly=mscorlib"

In this way, there are 5 ListBoxItems getting generated in the background and added to the ListBox.

Answer 2

You can use ItemContainerStyle instead of ItemTemplate if you want to add ListBoxItems directly to the ListBox.

Doing so, however, is only recommended when you need unique characteristics on a per item level.

If you are planning on all the items looking the same or making a dynamic list using ItemsSource, I would recommend you add strings (or another custom object) to your list and use ItemTemplate to display your items. (see Jobi Joy's answer)

Here's an example using ItemContainerStyle:

    <ListBox
        x:Name="TestList"
        SelectionMode="Multiple">

        <ListBox.ItemContainerStyle>
            <Style
                TargetType="ListBoxItem">

                <Setter
                    Property="Template">
                    <Setter.Value>
                        <ControlTemplate
                            TargetType="ListBoxItem">
                            <StackPanel>
                                <CheckBox
                                    Content="Check this checkbox!" />
                                <TextBlock
                                    Text="{TemplateBinding Content}" />
                            </StackPanel>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>

            </Style>
        </ListBox.ItemContainerStyle>

        <ListBox.Items>
            <ListBoxItem>Bob</ListBoxItem>
            <ListBoxItem>Jim</ListBoxItem>
            <ListBoxItem>Dave</ListBoxItem>
            <ListBoxItem>Larry</ListBoxItem>
            <ListBoxItem>Tom</ListBoxItem>
        </ListBox.Items>
    </ListBox>

Answer 3

For some reason DataTemplate can still be ignored if the ListBox is populated using ItemsSource e.g:

    <ListBox Name="Test" x:FieldModifier="public" ItemsSource="{Binding UpdateSourceTrigger=PropertyChanged}">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <TextBox Text="{Binding Text, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

Note that this is bound to an ObservableCollection containing objects (TextAdapter : INotifyPropertyChanged) with one property: string Text {...}