Split the width evenly between of two controls that make up a listbox item?

Question

Hi,

I'm trying to setup a ListBox so that every item has a textblock and a combobox, split evenly across the width of the listbox but I can't seem to find the magic combination of ColumnDefinition properties to do it. Here's my DataTemplate for the listbox item. I've cleaned it up since it was wrong, anyhow.

        <DataTemplate x:Key="MyDataTemplate">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Text="{Binding XPath=text()}"/>
                <ComboBox Grid.Column="1" SelectedIndex="0" ItemsSource="{Binding Source={StaticResource Names}, XPath=Name}"></ComboBox>
            </Grid>
        </DataTemplate>

I've tested a simple application with a grid on a window. Simply specifying two ColumnDefinitions make them automatically take up half of the width, which is nice, but when doing the same in a listboxitem datatemplate, the behavior is different.

How would I change the datatemplate to make it work?

Thanks!

Answer 1

The default HorizontalContentAlignment for a ListBox is Left. You need to set it to Stretch for the ListBoxItems to take up the entire width.

Here's some more info on ListBox/ListBoxItem styles and templates: http://msdn.microsoft.com/en-us/library/cc278062(VS.95).aspx