列表框项目的对齐

Question

我正在尝试设置下面列表框中内容的对齐方式。我已将 ListBox 包裹在 ScrollViewer 中以使其水平滚动。

Listbox 的每个元素都是一个 Stackpanel，我试图将每个元素与顶部对齐并将每个元素的宽度设置为自动。

现在，堆栈面板垂直居中，每个面板的宽度相同，由最大面板的宽度表示。

我已将 HorizontalContentAlignment="Left" 和 VerticalContentAlignment="Top" 放入，正如我在类似帖子中读到的那样，但它并没有改变任何东西。

<ScrollViewer Grid.Row="1"   VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto"  >
                <ListBox ItemsSource="{Binding Termene}" SelectedItem="{Binding SelectedTermenCondica}"  HorizontalContentAlignment="Left" VerticalContentAlignment="Top">
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <UniformGrid Rows="1"   />
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>
                    <ListBox.ItemTemplate >
                        <DataTemplate >
                            <StackPanel Margin="2"  >
                                <StackPanel.Resources>
                                    <CollectionViewSource Source="{Binding Dosare}" x:Key="dosareView"  IsLiveSortingRequested="True" >
                                        <CollectionViewSource.SortDescriptions>
                                            <scm:SortDescription PropertyName="Ora" />
                                        </CollectionViewSource.SortDescriptions>
                                    </CollectionViewSource>
                                    <Style x:Key="NoFocusColumStyle" TargetType="{x:Type DataGridCell}">
                                        <Setter Property="IsHitTestVisible" Value="False"/>
                                    </Style>
                                </StackPanel.Resources>
                                <TextBlock Text="{Binding NumeComplet, StringFormat='Complet {0}'}" HorizontalAlignment="Center" FontWeight="Bold" VerticalAlignment="Top"></TextBlock>
                                <TextBlock Text="{Binding TermenCB, StringFormat='Termen: {0}'}" HorizontalAlignment="Center" FontWeight="Bold" VerticalAlignment="Top"></TextBlock>
                                <DataGrid IsSynchronizedWithCurrentItem="True" CellStyle="{StaticResource NoFocusColumStyle}" IsReadOnly="True" ItemsSource="{Binding Source={StaticResource dosareView}}" Style="{StaticResource DGRapaorte}" AutoGenerateColumns="False" >

                                    <DataGrid.Columns>
                                        <DataGridTextColumn  Header="Nr. dosar" Binding="{Binding NumarDosar}"/>
                                        <DataGridTextColumn CanUserSort="True" SortDirection="Ascending" SortMemberPath="Ora"  Header="Ora" Binding="{Binding Ora, StringFormat={}{0:HH:mm}}" />
                                        <DataGridTextColumn Header="Obiect" Binding="{Binding Obiect}"/>
                                    </DataGrid.Columns>
                                </DataGrid>
                               </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </ScrollViewer>

稍后编辑：我已经添加了一些数据（Termene 中的三个项目来向您展示它的外观。我已经模糊了它们，但您可以看到问题所在。这是它现在的样子：

进一步滚动：

现在，我希望它看起来像这样：

如您所见，每个项目的高度和宽度都设置为最大项目的宽度和高度。

Answer 1

将 Uniform 网格部分替换为：

<ItemsPanelTemplate>
    <StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>

来源：

这个例子对我有用：

<Window x:Class="WpfMVVM.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:WpfMVVM"
        mc:Ignorable="d"
        Title="MainWindow" Height="500" Width="500">
    <ListBox ItemsSource="{Binding Items}" VerticalContentAlignment="Top">
        <ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <StackPanel Orientation="Horizontal" />
    </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Margin="2">
                    <TextBlock Text="test" HorizontalAlignment="Center" FontWeight="Bold" />
                    <TextBlock Text="blub" HorizontalAlignment="Center" FontWeight="Bold" />
                    <DataGrid IsSynchronizedWithCurrentItem="True" IsReadOnly="True"
                              ItemsSource="{Binding DataGridItems}" AutoGenerateColumns="False">
                        <DataGrid.Columns>
                            <DataGridTextColumn Header="Nr. dosar" Binding="{Binding Text}" />
                        </DataGrid.Columns>
                    </DataGrid>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</Window>

使用此视图模型

public class DataViewModel
{
    public DataViewModel()
    {

    }

    public List<Item> Items { get; set; } = new List<Item>()
    {
        new Item(){DataGridItems = new List<DataGridItem>(){new DataGridItem() { Text = "a"} }},
        new Item(){DataGridItems = new List<DataGridItem>(){new DataGridItem() { Text = "aaaaaaaaaaa"} }},
        new Item(){DataGridItems = new List<DataGridItem>(){new DataGridItem() { Text = "aaaaaaaaaaaaaaaaaa"} }},
        new Item(){DataGridItems = new List<DataGridItem>()
        {
            new DataGridItem() { Text = "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"},
            new DataGridItem() { Text = "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"},
            new DataGridItem() { Text = "aaa"},
            new DataGridItem() { Text = "aaaaaaaaaa"}
        }}
    };
}

public class Item
{
    public List<DataGridItem> DataGridItems { get; set; }
}

public class DataGridItem
{
    public string Text { get; set; }
}

列表框项目的对齐

Alignment of ListBox items

wpf

wpf-controls