Question

我将以下样式用于类似滚动条的苹果：

                    <Track x:Name="PART_Track" Grid.Row="0" IsDirectionReversed="true" Focusable="false">
                        <Track.Thumb>
                            <Thumb x:Name="Thumb" Background="{TemplateBinding Foreground}" Style="{DynamicResource ScrollThumbs}" />
                        </Track.Thumb>
                        <Track.IncreaseRepeatButton>
                            <RepeatButton x:Name="PageUp" Command="ScrollBar.PageDownCommand" Opacity="0" Focusable="false" />
                        </Track.IncreaseRepeatButton>
                        <Track.DecreaseRepeatButton>
                            <RepeatButton x:Name="PageDown" Command="ScrollBar.PageUpCommand" Opacity="0" Focusable="false" />
                        </Track.DecreaseRepeatButton>
                    </Track>
                </Grid>

                <ControlTemplate.Triggers>
                    <Trigger SourceName="Thumb" Property="IsMouseOver" Value="true">
                        <Setter Value="{DynamicResource ButtonSelectBrush}" TargetName="Thumb" Property="Background" />
                    </Trigger>
                    <Trigger SourceName="Thumb" Property="IsDragging" Value="true">
                        <Setter Value="{DynamicResource DarkBrush}" TargetName="Thumb" Property="Background" />
                    </Trigger>

                    <Trigger Property="IsEnabled" Value="false">
                        <Setter TargetName="Thumb" Property="Visibility" Value="Collapsed" />
                    </Trigger>
                    <Trigger Property="Orientation" Value="Horizontal">
                        <Setter TargetName="GridRoot" Property="LayoutTransform">
                            <Setter.Value>
                                <RotateTransform Angle="-90" />
                            </Setter.Value>
                        </Setter>
                        <Setter TargetName="PART_Track" Property="LayoutTransform">
                            <Setter.Value>
                                <RotateTransform Angle="-90" />
                            </Setter.Value>
                        </Setter>
                        <Setter Property="Width" Value="Auto" />
                        <Setter Property="Height" Value="8" />
                        <Setter TargetName="Thumb" Property="Tag" Value="Horizontal" />
                        <Setter TargetName="PageDown" Property="Command" Value="ScrollBar.PageLeftCommand" />
                        <Setter TargetName="PageUp" Property="Command" Value="ScrollBar.PageRightCommand" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

它看起来很棒，唯一的问题是当两个滚动条都在运行时，有一个矩形点不能与设计的其余部分一起使用。我不确定它的来源或我需要做什么样的风格改变。如下所示：

在角落处有一个白色矩形，两个滚动条相遇......我不想要或者至少希望能够控制矩形的样子。我应该改变什么风格？

Answer 1

使用@Anonymous Coward的答案，您可以自己查看ScrollViewer的模板，看看我在评论中说了些什么。做一些像：

using(FileStream stream = new FileStream("ScrollViewerTemplate.xml"))
using(StreamWriter writer = new StreamWriter(stream))
{
    writer.WriteLine(System.Windows.Markup.XamlWriter.Save(
        new ScrollViewer() {Content = new TextBlock() {Text = "Template"}}));
}

您可能需要进行一些编辑（添加新行），但您将获得要点。这将向您显示ScrollBar模板绑定到ScrollViewer的{{1}} / ViewportHeight，正如您可以推断的那样，它是可见内容的大小不包含任何ViewportWidth s。

所以，鉴于所有这些，我建议保持该块与您的设计内联，只需将包含元素（可能是ScrollBar？）ScrollViewer更改为{{ 1}}的背景。

WPF滚动条样式

1 个答案: