如何放置的ScrollViewer上应该滚动内容的顶部

Question

我想将我的ScrollViewer以这样一种方式，它重叠/坐在上面滚动的内容的顶部。使得内容是下方可见我将设置的ScrollViewer的不透明度。

据我理解默认的ScrollViewer，这似乎并不可能出由于内容嵌套在内部的ScrollViewer盒子。

这是如何使这项工作？任何想法

编辑：我明白的ScrollViewer是装饰和该内容不知道的ScrollViewer的。这种分离是好的，我不想要的内容要意识到的ScrollViewer的。我尝试做的是一个纯粹的视觉（布局）的事情。简单地显示在ScrollViewer中的content.The行为的顶部上的ScrollViewer应保持不变。

Answer 1

我想我现在明白你所说的“上面”的意思 - 要做到这一点是使用使ScrollContentPresenter跨度两行一格的列的控制模板，而滚动条在第2行和列的一种方式。滚动条被设置为半透明的。内容现在将利用滚动条下！

我尝试的风格，工程如下：

<Style x:Key="SVStyle" TargetType="{x:Type ScrollViewer}">
    <Setter Property="OverridesDefaultStyle" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollViewer}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <ScrollContentPresenter Grid.ColumnSpan="2" Grid.RowSpan="2"/>
                        <ScrollBar Name="PART_VerticalScrollBar"
                            HorizontalAlignment="Right"
                            Opacity="0.5" 
                            Grid.Column="1"
                            Value="{TemplateBinding VerticalOffset}"
                            Maximum="{TemplateBinding ScrollableHeight}"
                            ViewportSize="{TemplateBinding ViewportHeight}"
                            Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" />
                        <ScrollBar Name="PART_HorizontalScrollBar"
                            VerticalAlignment="Bottom"
                            Orientation="Horizontal"
                            Opacity="0.5"
                            Grid.Row="1"
                            Value="{TemplateBinding HorizontalOffset}"
                            Maximum="{TemplateBinding ScrollableWidth}"
                            ViewportSize="{TemplateBinding ViewportWidth}"
                            Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

用法示例：

<ScrollViewer HorizontalScrollBarVisibility="Auto" Style="{StaticResource SVStyle}" >
    <StackPanel>
        <Button Height="100" Width="800" >Hello World</Button>
        <Button Height="100" Width="800" >Hello World</Button>
        <Button Height="100" Width="800" >Hello World</Button>
        <Button Height="100" Width="800" >Hello World</Button>
        <Button Height="100" Width="800" >Hello World</Button>
        <Button Height="100" Width="800" >World World</Button>
        <Button Height="100" Width="800" >Hello World</Button>
        <Button Height="100" Width="800" >Hello World</Button>
    </StackPanel>
</ScrollViewer>

其结果是沿此线：

这将是简单修改此使得滚动条最初非常透明的（比方说，不透明度= 0.2），并且具有当鼠标进入滚动条他们变得更不透明。这将是一个很好的效果，并会保持滚动条出路在需要直到他们。

编辑：

我写这件事上我的博客对于那些谁也像一个小的更多细节。

Answer 2

的想法是，所述的ScrollViewer为它滚动和夹子的东西一个装饰。被滚动的东西是完全不知道的滚动。这是简单而优雅 - 为什么是在你的情况下，它不是足够

说了这么多，如果你想要的ScrollViewer中没有做，我建议你创建滚动条控制和处理由它生成的事件，移动您希望在事件处理程序滚动内容。你甚至可以做一些花哨的数据绑定避免编写事件处理程序。我不知道你如何去正确地夹的内容，但是这是蠕虫新能。

如果您需要在另一个之上布置一个控制，使用控制画布

Answer 3

我不知道，如果你想放置的ScrollViewer的滚动条上的内容的顶部 - 如果是这样回答1，如果你想整个的ScrollViewer ontop的内容看答案2

1）可以通过应用模板改变在WPF任何视觉表示。在这种情况下，关键是要找到什么ScrollViewer中的现有表示是，然后基本上是重新实现一切只是量变到质变的滚动条按要求的位置相同的视觉效果。有一对夫妇的找到所有的视觉效果的控制方式 - 最简单的就是从的 WPF MSDN样品 - 并很好地足够的ScrollViewer 例提供由Microsoft示出如何改变滚动条的位置。

BTW微软往往会载入他们的例子有很多额外的XAML，你并不真正需要 - 玩模板（无情地切割出码），直到它不只是你想要什么，并没有更多的

2）我的方法来将所述滚动视图ontop的内容，将使用两个scrollviewers放置在彼此的顶部上。 “顶部”是小的，半透明的（不透明度= 50）和手柄滚动，底部是较大的，并具有该文档。线从顶部的ScrollViewer的滚动事件，以便它也将滚动底部之一。