Question

我有一个带有ListBox的Windows应用商店应用，其中包含可变高度的网格。我不能让这些在顶部对齐。我已经尝试了VerticalAlignment和VerticalContentAlignment我能想到的所有组合，并且它们总是垂直居中。

这是我的XAML

<Page 
    x:Class="MyApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MyApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">

        <Grid Margin="50,50,50,50" HorizontalAlignment="Stretch" Width="Auto">
            <Grid.RowDefinitions>
                <RowDefinition Height="50"></RowDefinition>
                <RowDefinition Height="80"></RowDefinition>
                <RowDefinition Height="*"></RowDefinition>
            </Grid.RowDefinitions>

            <TextBlock Grid.Row="0" Text="" Margin="12,0,0,0" Style="{StaticResource HeaderTextStyle}" />
            <Grid Grid.Row="1" Margin="30,0,0,0"> 
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="300"></ColumnDefinition>
                    <ColumnDefinition Width="15"></ColumnDefinition>
                    <ColumnDefinition Width="100"></ColumnDefinition>
                    <ColumnDefinition Width="15"></ColumnDefinition>
                    <ColumnDefinition Width="1*"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <TextBox Grid.Column="0" x:Name="bxAddItem" Width="300" Height="28" Margin="0,0,0,0" Text="Item text" KeyUp="bxAddItem_KeyUp" GotFocus="bxAddItem_GotFocus" LostFocus="bxAddItem_LostFocus"></TextBox>
                <ComboBox Grid.Column="2" x:Name="comboList" SelectionChanged="comboList_SelectionChanged" Width="100" Height="32">
                    <ComboBoxItem Tag="0">No List</ComboBoxItem>
                </ComboBox>
                <Button Grid.Column="4" x:Name="btnAddItem" Click="AddItem_Click" HorizontalAlignment="Left" Background="#45000000" Height="34">Add an Item</Button>
            </Grid>


            <ScrollViewer HorizontalScrollBarVisibility="Visible" Grid.Row="2">
                <ListBox Width="Auto" VerticalContentAlignment="Top" ItemsSource="{Binding ToDoLists}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Grid Background="Beige">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="50"></RowDefinition>
                                    <RowDefinition Height="*"></RowDefinition>
                                </Grid.RowDefinitions>
                                <TextBlock Text="{Binding Title}"></TextBlock>
                                <ListBox Grid.Row="1" Grid.Column="0" Name="ToDoList" ItemsSource="{Binding Path=Items}"
                                            Margin="24,0,0,0" Height="Auto" MinWidth="200" VerticalAlignment="Stretch" 
                                            BorderBrush="BlueViolet" SelectionChanged="ToDoList_SelectionChanged">
                                    <ListBox.ItemTemplate>
                                        <DataTemplate>
                                            <Grid>
                                                <TextBlock Text="{Binding ItemName}"></TextBlock>
                                            </Grid>
                                        </DataTemplate>
                                    </ListBox.ItemTemplate>
                                    <ItemsControl.ItemsPanel>
                                        <ItemsPanelTemplate>
                                            <VirtualizingStackPanel Orientation="Vertical"/>
                                        </ItemsPanelTemplate>
                                    </ItemsControl.ItemsPanel>
                                </ListBox>
                            </Grid>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel VerticalAlignment="Top" Orientation="Horizontal"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                </ListBox>
            </ScrollViewer>

        </Grid>
    </Grid>
</Page>

修改

谢丽丹的回答对我不起作用。页面上可能还有其他内容导致问题。

我已更新问题以包含整个页面代码。

编辑2：

此帖子被错误地标记为WPF，而事实上该问题出现在Windows应用商店应用中。此代码在WPF中完美运行，因此存在混淆。但它不适用于Windows应用商店应用

Answer 1

您是否尝试将ItemContainerStyle设置为VerticalAlignment =“Top”

<ListBox.ItemContainerStyle>
    <Style TargetType="ListBoxItem">
            <Setter Property="VerticalAlignment" Value="Top"></Setter>
        </Style>
</ListBox.ItemContainerStyle>

垂直对齐Windows应用商店应用中ListBox的内容

1 个答案: