WPF ListBox DataTemplate左右元素对齐问题求助

你的问题出在ListBoxItem默认的HorizontalContentAlignment是Left，导致ItemTemplate里的Grid无法拉伸至ListBox的整个宽度，所以右侧的长度文本没法真正贴靠右边缘。只需要两步就能修复：

1. 在ListBoxItem的Style中添加HorizontalContentAlignment的Setter，让Item内容占满ListBox宽度
2. 优化Grid的列布局，确保左右内容正确分布

修改后的完整XAML代码 #

<Window x:Class="Ex1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Ex1"
        mc:Ignorable="d"
        Title="Voeux de cours InteGraph" Height="450" Width="800">
    <Window.Resources>
        <local:ItalicConverter x:Key="ItalicConverter"/>
        <Style TargetType="{x:Type ListBoxItem}">
            <!-- 添加这一行，让Item内容拉伸至ListBox宽度 -->
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Style.Triggers>
                <Trigger Property="ItemsControl.AlternationIndex" Value="0">
                    <Setter Property="Background" Value="LightBlue"/>
                </Trigger>
                <Trigger Property="ItemsControl.AlternationIndex" Value="1">
                    <Setter Property="Background" Value="CornflowerBlue"/>
                </Trigger>
                <Trigger Property="ItemsControl.AlternationIndex" Value="2">
                    <Setter Property="Background" Value="DarkBlue"/>
                </Trigger>
                <Trigger Property="ItemsControl.AlternationIndex" Value="3">
                    <Setter Property="Background" Value="CornflowerBlue"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <ListBox x:Name="listBox" AlternationCount="4" HorizontalAlignment="Stretch">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <!-- Grid默认会继承父级的拉伸宽度 -->
                <Grid Margin="0">
                    <Grid.ColumnDefinitions>
                        <!-- 第一列自适应左侧文本宽度 -->
                        <ColumnDefinition Width="Auto"/>
                        <!-- 第二列占满剩余空间，让右侧文本能右对齐 -->
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="{Binding}" Foreground="White" Margin="5" HorizontalAlignment="Left">
                        <TextBlock.FontStyle>
                            <Binding Path="Length" Converter="{StaticResource ItalicConverter}"/>
                        </TextBlock.FontStyle>
                    </TextBlock>
                    <!-- 把长度文本放在第二列，设置右对齐 -->
                    <TextBlock Text="{Binding Length}" Foreground="White" Margin="5" 
                               HorizontalAlignment="Right" Grid.Column="1"/>
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</Window>

关键说明 #

• ListBoxItem的HorizontalContentAlignment="Stretch"是核心修复点，它让Item内部的Grid能填满ListBox的整个水平空间
• Grid的列布局用Auto+*的组合，既保证左侧文本只占自身宽度，又让剩余空间留给右侧的对齐区域，确保长度文本始终贴靠右边缘

内容的提问来源于stack exchange，提问作者gaetan worch