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">