Correctly setting Width on a Virtualized ListBox in WPF

Question

I have a WPF listbox which is virtualized with a large number of rows. The listbox changes in size as I scroll through the entities. I've tried:

<Setter Property="MinWidth" Value="{Binding Path=ExtentWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ScrollViewer}}}" />

Sadly, I don't have enough reputation to post my pictures of the problem, but basically when I scroll through a virtualized list box, the width of the box changes as longer items are encountered. I figure I could try to measure the longest string in the codebehind and set the width to that value, but I hope there's a cleaner solution.

Here's my current control template (no dice):

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                    <Border x:Name="ListItemContainer"
                             MinWidth="{Binding Path=ExtentWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ScrollViewer}}}"
                            BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                        <ContentPresenter></ContentPresenter>                                               
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="true">                            
                            <Setter Property="Background" TargetName="ListItemContainer" Value="{DynamicResource AxisValueSelectedBackground}"/>
                            <Setter Property="Foreground" Value="{DynamicResource AxisValueSelectedForeground}"/>
                        </Trigger>

                        <Trigger Property="IsSelected" Value="false">
                            <Setter Property="Background" TargetName="ListItemContainer" Value="{DynamicResource AxisValueBackground}"/>
                            <Setter Property="Foreground" Value="{Binding IsEnabled, Converter={StaticResource AxisValueForegroundConverter}}" />
                            <Setter Property="FontStyle" Value="{Binding IsEnabled, Converter={StaticResource AxisValueFontStyleConverter}}" />
                        </Trigger>

                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsAxisSelected}" Value="True"/>
                                <Condition Binding="{Binding IsAxisValueSelected}" Value="False"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="ListItemContainer" Value="White" />
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

Answer 1

Try the same relative binding trick, but within your DataTemplate's outermost item (probably a Grid). This way the items are all the same size.