c# - 具有自定义样式的 ScrollViewer 在拖动时不滚动

Question

我不是 WPF 方面的专家，但我在网上找到了一种类似 OS X 的滚动条的样式。它看起来不错，并且确实用鼠标滚轮以预期的方式滚动，但奇怪的是，如果你用鼠标拖动滚动条，它实际上并没有滚动内容，它只是在屏幕上移动滚动条。这种风格有什么问题？

我不会假装我完全理解这种风格中发生的一切，但我一直在研究它的各个部分的文档，到目前为止，我无法找出问题所在。

XAML:

<Style x:Key="ScrollBarTrackThumb"
        TargetType="{x:Type Thumb}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Thumb}">
                            <Grid x:Name="Grid">
                                <Rectangle HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                Width="Auto"
                                Height="Auto"
                                Fill="Transparent" />
                                <Border x:Name="CornerScrollBarRectangle"
                            CornerRadius="5"
                            HorizontalAlignment="Stretch"
                            VerticalAlignment="Stretch"
                            Width="Auto"
                            Height="Auto"
                            Margin="0,1,0,1"
                            Background="{TemplateBinding Background}" />
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Tag"
                                Value="Horizontal">
                                    <Setter TargetName="CornerScrollBarRectangle"
                                Property="Width"
                                Value="Auto" />
                                    <Setter TargetName="CornerScrollBarRectangle"
                                Property="Height"
                                Value="6" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style TargetType="{x:Type ScrollBar}" x:Key="BlackBGScrollBar">
                <Setter Property="Stylus.IsFlicksEnabled"
            Value="false" />
                <Setter Property="Foreground"
            Value="#ADABAB" />
                <Setter Property="Background"
            Value="Transparent" />
                <Setter Property="Width"
            Value="7" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ScrollBar}">
                            <Grid x:Name="GridRoot"
                        Width="7"
                        Background="{TemplateBinding Background}">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="0.00001*" />
                                </Grid.RowDefinitions>
                                <Track x:Name="PART_Track"
                            Grid.Row="0"
                            IsDirectionReversed="true"
                            Focusable="false">
                                    <Track.Thumb>
                                        <Thumb x:Name="Thumb"
                                    Background="{TemplateBinding Foreground}"
                                    Style="{DynamicResource ScrollBarTrackThumb}" />
                                    </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>

            <Style TargetType="ScrollViewer" x:Key="BlackBGScrollViewer">
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Top" />
                <Setter Property="VerticalScrollBarVisibility" Value="Visible" />
                <Setter Property="Padding" Value="4"/>
                <Setter Property="BorderThickness" Value="0"/>
                <Setter Property="BorderBrush">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FFA3AEB9" Offset="0"/>
                            <GradientStop Color="#FF8399A9" Offset="0.375"/>
                            <GradientStop Color="#FF718597" Offset="0.375"/>
                            <GradientStop Color="#FF617584" Offset="1"/>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ScrollViewer">
                            <Border CornerRadius="2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                                <Grid Background="{TemplateBinding Background}">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*"/>
                                        <RowDefinition Height="Auto"/>
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*"/>
                                        <ColumnDefinition Width="Auto"/>
                                    </Grid.ColumnDefinitions>

                                    <ScrollContentPresenter x:Name="ScrollContentPresenter"
                                                  Cursor="{TemplateBinding Cursor}"
                                                  Margin="{TemplateBinding Padding}"
                                                  ContentTemplate="{TemplateBinding ContentTemplate}"/>

                                    <Rectangle Grid.Column="1" Grid.Row="1" Fill="#FFE9EEF4"/>

                                    <ScrollBar x:Name="VerticalScrollBar" Width="18"
                                     IsTabStop="False"
                                     Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                                     Grid.Column="1" Grid.Row="0" Orientation="Vertical"
                                     ViewportSize="{TemplateBinding ViewportHeight}"
                                     Maximum="{TemplateBinding ScrollableHeight}"
                                     Minimum="0"
                                     Value="{TemplateBinding VerticalOffset}"
                                     Margin="0,-1,-1,-1"
                                     Style="{StaticResource BlackBGScrollBar}"/>

                                    <ScrollBar x:Name="HorizontalScrollBar" Height="18"
                                     IsTabStop="False"
                                     Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                                     Grid.Column="0" Grid.Row="1" Orientation="Horizontal"
                                     ViewportSize="{TemplateBinding ViewportWidth}"
                                     Maximum="{TemplateBinding ScrollableWidth}"
                                     Minimum="0"
                                     Value="{TemplateBinding HorizontalOffset}"
                                     Margin="-1,0,-1,-1"
                                     Style="{StaticResource BlackBGScrollBar}"/>

                                </Grid>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

Answer 1

想通了。

在 ScrollViewer 样式中，底部的标签需要名称为“PART_VerticalScrollBar”和“PART_Horizo​​ntalScrollBar”，而不仅仅是“VerticalScrollBar”和“Horizo​​ntalScrollBar”。