XAML水平Stackpanel滚动

Question

我在滚动浏览器中滚动水平堆栈面板时遇到问题。 我正在尝试做的比我的例子更复杂，但在删除变量之后，我想如果我能解决这个问题，我可以解决所有问题。

基本上，当包含水平堆栈面板时，我无法让滚动查看器水平滚动。

以下是XAML示例：

   <ScrollViewer>
        <StackPanel Orientation="Horizontal">
            <Image Source="test.png" Width="400" Height="400"/>
            <Image Source="test.png" Width="400" Height="400"/>
            <Image Source="test.png" Width="400" Height="400"/>
            <Image Source="test.png" Width="400" Height="400"/>
            <Image Source="test.png" Width="400" Height="400"/>
            <Image Source="test.png" Width="400" Height="400"/>
            <Image Source="test.png" Width="400" Height="400"/>
        </StackPanel>
    </ScrollViewer>

奇怪的是，如果我只是将方向从水平交换到垂直，它滚动就好了。 我已经阅读过多个帖子，堆栈面板有问题可能使它们不适合滚动查看器，所以我也尝试使用网格，但得到相同的结果。

  <ScrollViewer>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="400"/>
                <ColumnDefinition Width="400"/>
                <ColumnDefinition Width="400"/>
                <ColumnDefinition Width="400"/>
                <ColumnDefinition Width="400"/>
                <ColumnDefinition Width="400"/>
            </Grid.ColumnDefinitions>                
            <Image Source="test.png" Width="400" Height="400"  Grid.Column="0"/>
            <Image Source="test.png" Width="400" Height="400"  Grid.Column="1"/>
            <Image Source="test.png" Width="400" Height="400"  Grid.Column="2"/>
            <Image Source="test.png" Width="400" Height="400"  Grid.Column="3"/>
            <Image Source="test.png" Width="400" Height="400"  Grid.Column="4"/>
            <Image Source="test.png" Width="400" Height="400"  Grid.Column="5"/>
        </Grid>
    </ScrollViewer>

看起来很简单，我觉得我误解了一些基本的东西。 如果有人可以提供帮助，我将非常感激。

Answer 1

你只需要打开水平滚动。 它默认是隐藏的 （但垂直的不是，因此混乱）。

<ScrollViewer HorizontalScrollBarVisibility="Auto">