Question

我对ScrollViewer的ScrollBar极端奇怪的行为有疑问。

这是我的代码：

<ScrollViewer CanContentScroll="True">
    <StackPanel>
        <StackPanel>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40" Background="Yellow"/>
        </StackPanel>

        <StackPanel>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Green"/>
        </StackPanel>
    </StackPanel>
</ScrollViewer>

问题出在StackPanel内的StackPanels中。如果里面只有一个没有StackPanels的主StackPanel，它就可以了。

我尝试在主StackPanel中为每个孩子使用ScrollViewer。该解决方案中的另一个问题是我不希望具有固定的StackPanels高度。

@EDIT： 问题是ScrollBar不能平滑移动，它会阻止显示所有内容。抱歉缺乏信息。

Answer 1

您正在获得这种奇怪的行为，因为您在CanContentScroll上将ScrollViewer设置为True。这意味着，ScorllViewer将每个StackPanel视为单个内容元素，并按每个StackPanel的高度滚动，而不是在子Button内每个StackPanel的高度滚动。< / p>

要摆脱这种奇怪的行为，请将您的代码更改为：

<ScrollViewer>
    <StackPanel>
        <StackPanel>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40"/>
            <Button Height="40" Background="Yellow"/>
        </StackPanel>

        <StackPanel>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Red"/>
            <Button Height="40" Background="Green"/>
        </StackPanel>
    </StackPanel>
</ScrollViewer>

Answer 2

您“需要”将StackPanel添加到ItemsControl集合：

 <ScrollViewer CanContentScroll="True">
      <ItemsControl >
           <StackPanel>
                <StackPanel>
                    <Button Height="40"/>
                    <Button Height="40"/>
                    <Button Height="40"/>
                    <Button Height="40"/>
                    <Button Height="40"/>
                    <Button Height="40"/>
                    <Button Height="40"/>
                    <Button Height="40" Background="Yellow"/>
                </StackPanel>

                <StackPanel>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Red"/>
                    <Button Height="40" Background="Green"/>
                </StackPanel>
            </StackPanel>
       </ItemsControl >
   </ScrollViewer>

ScrollViewer WPF中的StackPanel

2 个答案: