为什么按钮在堆栈面板中没有水平对齐？

Question

我有一个从数据生成的按钮列表，所以按钮的数量是可变的。在我正在大修的旧版本软件中，他们使用了随机自定义控件，但结果是有一个无限增长的水平滚动条。

看来我有完全相同的 XAML 但它没有水平对齐每个项目，只有垂直对齐

<ScrollViewer Background="#33FFFFFF" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" >
    <StackPanel Orientation="Horizontal">
        <ItemsControl ItemsSource="{Binding Events}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Button Margin="10" HorizontalAlignment="Stretch" Background="#FF1B1B1B" BorderThickness="5" BorderBrush="White" Command="{Binding Source={StaticResource Locator}, Path=EventSelector.ViewEventCommand}" CommandParameter="{Binding }">
                        <Grid Name="tileGridButton" Height="600" Width="400" Margin="5">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="5*"></RowDefinition>
                                <RowDefinition Height="5*"></RowDefinition>
                            </Grid.RowDefinitions>
                            <Border Grid.Row="0" Name="tileImageBorder" Margin="5" BorderThickness="1" VerticalAlignment="Stretch" HorizontalAlignment="Center">
                                <Image Name="tileImage" Margin="0" Source="{Binding ImageURL}"/>
                            </Border>
                            <Grid Grid.Row="1" VerticalAlignment="Top">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="6*"></RowDefinition>
                                    <RowDefinition Height="4*"></RowDefinition>
                                </Grid.RowDefinitions>
                                <TextBlock Grid.Row="0" Name="tileText" Margin="5" Foreground="White" TextAlignment="Center" TextTrimming="CharacterEllipsis" TextWrapping="Wrap" FontSize="30" FontWeight="Bold" Text="{Binding Title}" />
                                <TextBlock Grid.Row="1" Name="tileDescription" Margin="5" Foreground="White" TextAlignment="Center" TextTrimming="CharacterEllipsis" TextWrapping="Wrap" FontSize="25" FontWeight="Bold" Text="{Binding EventTimeBegin}" />
                            </Grid>
                        </Grid>
                    </Button>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </StackPanel>
</ScrollViewer>

Answer 1

首先，您的 StackPanel 几乎没有用，因为它只包含一个项目，即 ItemsControl。

相反，您需要更改 ItemsControl，以便它使用 StackPanel 作为在 [=15] 中布置项目的方法=]项目控制...

<ItemsControl ...>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        <ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
    .....

为什么按钮在堆栈面板中没有水平对齐？

why aren't the buttons aligning horizontally in the stackpanel?

wpf

mvvm-light