【问题标题】:Scrollviewer within another另一个内的 Scrollviewer
【发布时间】:2015-08-20 14:08:09
【问题描述】:

不久前我开始使用 WPF,我一直在处理一个看起来很常见的 ScrollViewer 问题:我有一个内容不同的 ScrollViewer,它与其他内容一起显示,整个事情是在另一个 ScrollViewer 中。整个事情看起来像这样:

<ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
    <StackPanel Orientation="Vertical">
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        <ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto">
            <StackPanel Orientation="Vertical">
                <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
            </StackPanel>
        </ScrollViewer>
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
    </StackPanel>
</ScrollViewer>

我想要的是内部 ScrollViewer 在外部之前开始减少其内容,这意味着如果我将所有这些都放在一个窗口中并减小窗口大小,我希望带有蓝色矩形的 ScrollViewer 开始减少其内容并显示它的滚动条在外部滚动条之前,包含橙色矩形的滚动条。

在网上看了很长时间后,我发现了两个主要建议:第一个是避免使用 StackPanel - 在这个简化的示例中,我显然可以使用 Grid,在实际项目中我不确定我是否可以,因为我放入此 ScrollViewer 的内容大小不同,具体取决于我在其中绑定的内容。 第二个是我在一个非常相似的问题的答案中找到的:

Nested Scroll Areas

一开始似乎效果很好。生成的 xaml 变为:

<ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
    <StackPanel Orientation="Vertical">
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        <local:RestrictDesiredSize MinHeight="60">
            <ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto">
                <StackPanel Orientation="Vertical">
                    <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                    <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                    <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                </StackPanel>
            </ScrollViewer>
        </local:RestrictDesiredSize>
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
    </StackPanel>
</ScrollViewer>

但是现在我遇到了相反的问题:内部滚动查看器总是停留在 60 的高度,即使我扩大窗口,但我希望它尽可能多地占用空间 - 显示所有蓝色矩形并隐藏如果可能的话,滚动条

有谁知道如何做到这一点?

编辑:

我通过在某处使用 DockPanel 而不是 StackPanel 找到了一个不完美的临时解决方案,我猜想通过避免使用 stackpanel 来解决这个问题真的会更容易吗?这是我的最后一个版本

<ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" VerticalAlignment="Stretch">
    <DockPanel>
        <StackPanel DockPanel.Dock="Top">
            <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
            <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        </StackPanel>
        <StackPanel DockPanel.Dock="Bottom">
            <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
            <Rectangle Height="50" Width="50" Margin="5" Fill="Orange"/>
        </StackPanel>
        <local:RestrictDesiredSize MinHeight="60">
            <ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto" VerticalContentAlignment="Stretch" VerticalAlignment="Stretch">
                <StackPanel Orientation="Vertical" VerticalAlignment="Stretch">
                    <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                    <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                    <Rectangle Height="50" Width="50" Margin="5" Fill="Blue"/>
                </StackPanel>
            </ScrollViewer>
        </local:RestrictDesiredSize>
    </DockPanel>
</ScrollViewer>

现在它并不完美,因为部分内容停靠在底部,但我现在将尝试将此作为一种解决方法,除非我找到更好的东西。

【问题讨论】:

    标签: c# wpf layout scroll


    【解决方案1】:

    我过去通过使用RelativeSource 将适当的宽度绑定到父ActualWidth 解决了这个问题。

    How do I use WPF bindings with RelativeSource?

    Snoop 对于找出如何在 Visual Tree 中找到所需属性也非常有用,请参阅我的 Snoop 教程ReSharper WPF error: "Cannot resolve symbol "MyVariable" due to unknown DataContext"

    【讨论】:

    • 您能详细说明一下吗?我花了一些时间随机绑定高度,但找不到合适的高度。
    • 添加了更多提示。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-01-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多