WPF Listboxitem not aligning items properly

Question

Ok I got the following DataTemplate:

 Style="{StaticResource LBStyle}" HorizontalContentAlignment="Stretch">
                <ListBox.ItemTemplate>

                    <DataTemplate>
                        <Grid >
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="1*"/> 
                                <ColumnDefinition Width="100" />
                            </Grid.ColumnDefinitions>
                            <Label Content="{Binding Name}" x:Name="txt" Grid.Column="0"></Label>
                            <StackPanel Orientation="Vertical" Grid.Column="1">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="{z:txt text=time}" Width="50">:</TextBlock>
                                    <TextBlock Text="{Binding Path=Value, Converter={StaticResource DecFix}}" />
                                </StackPanel>

                                <StackPanel Orientation="Horizontal" Width="50">
                                    <TextBlock Text="Norm.">:</TextBlock>
                                    <TextBlock Text="{Binding Path=NormaalWaarde, Converter={StaticResource DecFix}}" />
                                </StackPanel>
                            </StackPanel>
                        </Grid>

                        <DataTemplate.Triggers>
                            <DataTrigger Binding="{Binding IsCurrentStep}" Value="True">
                                <Setter TargetName="txt" Property="FontWeight" Value="Bold"/>
                            </DataTrigger> 
                        </DataTemplate.Triggers>
                    </DataTemplate>
                </ListBox.ItemTemplate>

Basically what I want is for each item to have some text on the left side, which stretches with the width of the listbox and 2 values on the right side, which stays on the right side. I've tried this with many different kind of panels, grids etc. And they all seem to just put the values on the right side wrapped together to the text on the left side like this:

link text (please use the link to see what I mean, I cannot post pictures yet)

If i put the same datatemplate standalone somewhere else it just does what it should do. Does anyone have a suggestion?

Edit: I put a gridsplitter between the listbox and the rest of the window and it looks like the listbox is stretching indefinately. This is how the listbox is positioned amongst other elements in my window: (the listbox is in the tagger usercontrol)

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*"/>
        <ColumnDefinition Width="2.5*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>           
        <RowDefinition/>
    </Grid.RowDefinitions>

    <vid:TagControl x:Name="Tagger" Grid.Column="0"></vid:TagControl>

    <GridSplitter ResizeDirection="Columns" Width="20" />

    <vid:DShowPlayer x:Name="DShowPlayer1" Grid.Column="1"></vid:DShowPlayer>
</Grid>

Answer 1

None of the DataTemplate examples I can find state this explicitly, but it appears to be the case that DataTemplates only apply when your list items come from an ItemsSource binding. If you directly populate the Items collection, the DataTemplate isn't used.

Adding an ItemTemplate in Expression Blend, the command text reads "Generated Item Template" - which seems to mean the template is only used when the item is generated indirectly.

And every example I can find uses a data binding for the item source.

Answer 2

You should use Grid instead of DockPanel with 3 columns, 1st column as 1 * , 2nd and 3rd as fixed length...

Answer 3

The problem here is certainly not related to your DataTemplate at all, or whether or not you are using data binding. Something in the ListBox or ListBoxItem style or ControlTemplate is causing a control to have HorizontalAlignment not set to "Stretch" at some level. (Or you could be using custom Measure or Arrange code that ignores HorizontalAlignment at some level)

I would suspect your Style="{StaticResource LBStyle} is the culprit, or some other ListBox property that isn't shown.

• The default ListBox style contains a template with a Border and a ScrollViewer, none of which contains a HorizontalAlignment setting
• The default ListBox ItemsPanel template consists of a StackPanel, which also doesn't contain a HorizontalAlignment setting
• The default ListBoxItem template contains a template with a Border and ContentPresenter. Only the Border contains a HorizontalAlignment setting, and it is set (via a style setter) to the containing ListBox's HorizontalContentAlignment, which you have set to "Stretch".

If run in isolation the code you posted works fine. Search your style (and other properties, code-behind settings, etc) for any template replacement or setting that overrides the default HorizontalAlignment handling.

If the problem isn't apparent at first, remove settings one at a time until it stops working, then look closer at what you removed.