none
如何正确给FlowDocumentScrollViewer定义模版? RRS feed

  • 问题

  • 我需要用FlowDocument来显示一些表格,看图:

    图中可以看到,表格(红色边框)是自动填满整个窗口的。这看起来很正常

    可是当我给FlowDocumentScrollViewer设置一个Style之后,却变成了:

    表格不能自动填满整个窗口的宽度了。而Style定义如下:

            <Style x:Key="MyFlowDocumentViewer" TargetType="{x:Type FlowDocumentScrollViewer}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Grid>
                                <Border>
                                    <ScrollViewer Name="PART_ContentHost"></ScrollViewer>
                                </Border>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

    这个模版我是直接参考默认的FlowDocumentScrollViewer来做的,理论上它应该和不设置Style的时候效果一样,可是设置了之后却导致表格不能填满窗口宽度,是我哪里做错了吗?



    da jia hao!

    2017年9月4日 9:38

答案

  • 你好,

    >>FlowDocumentScrollViewer默认的那个滚动条太难看,必须要改。而如果要改,就必须修改它里面的那个ScrollViewer的模版。

    修改滚动条,你直接给ScrollBar设置样式就可以了。没有必要修改ScrollViewer的模板,除非你想修改ScrollViewer的布局。

    >>首先就是有没有官方的FlowDocumentScrollViewer模版定义?

    可能是官方觉得不建议重写也没有必要重写这个模板,因为他是针对FlowDocument特殊的ScrollViewer,和普通的ScrollViewer不同。

    >>其次是,下面是我今天新修改的模版,我反复对比不使用Style的时候“实时可视化树”,确认和默认的模版是一样的。可是为什么偏偏就让表格不能自动填充宽度了呢?

    正如我第一个回复,你至少需要布局三个部分PART_ContentHost,PART_FindToolBarHost和PART_ToolBarHost.

    我不知道你在哪看默认的模板的,FlowDocumentScrollViewer的默认模板放在PresentationUI.dll中。

    参考下面的代码来设置滚动条样式:

    <sys:Double x:Key="ScrollBarSize">20</sys:Double> <SolidColorBrush x:Key="RepeatButtonBackGround" Color="#666"/> <SolidColorBrush x:Key="ThumbBackground" Color="Pink"/> <SolidColorBrush x:Key="MouseOverForeground" Color="Red"/> <SolidColorBrush x:Key="PressedForeground" Color="Brown"/> <SolidColorBrush x:Key="ScrollBarBackground" Color="#666"/>

    <!-- 4.1 Up Fixed RepeatButton style --> <Style x:Key="VerticalScrollBarUpLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,6 L4,4 L 8,6 L 4,0Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.1 Down Fixed RepeatButton style --> <Style x:Key="VerticalScrollBarDownLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,0 L 4,6 L 8,0 L4,2Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.1 Left Fixed RepeatButton style --> <Style x:Key="HorizontalScrollBarLeftLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,4 L 6,8 L4,4 L6,0Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.1 Right Fixed RepeatButton style --> <Style x:Key="HorizontalScrollBarRightLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,0 L2,4 L 0,8 L 6,4Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.2 Track hidden RepeatButton --> <Style x:Key="ScrollBarPageRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Border Background="Transparent"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.Thumb --> <ControlTemplate x:Key="ThumbTemplate" TargetType="Thumb"> <Grid> <Border x:Name="Bg" Margin="4" Background="{StaticResource ThumbBackground}" CornerRadius="4" SnapsToDevicePixels="True"> <!--<Border.Background> <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> <GradientStop Color="#C7C0C0" Offset="0.15"/> <GradientStop Color="#AFA9A9" Offset=".5"/> <GradientStop Color="#989494" Offset=".5"/> <GradientStop Color="#858585" Offset="1"/> </LinearGradientBrush> </Border.Background>--> </Border> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="Bg" Property="Background" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="False"> <Setter TargetName="Bg" Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!-- 2.Vertical ScrollBar ControlTemplate --> <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}"> <Grid x:Name="VerticalRoot" Height="{TemplateBinding Height}"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <!-- LineRepeatButton --> <Border x:Name="VerticalSmallDecrease" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton Margin="0,0,0,0" Command="ScrollBar.LineUpCommand" Interval="50" IsTabStop="False" Style="{StaticResource VerticalScrollBarUpLineRepeatButton}"/> </Border> <!-- Track --> <Border x:Name="BgInner" Grid.Row="1" Margin="0" Background="{StaticResource ScrollBarBackground}" CornerRadius="6" Opacity="1" SnapsToDevicePixels="True"> <Track x:Name="PART_Track" IsDirectionReversed="true"> <!-- PageRepeatButton --> <Track.DecreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeDecrease" Command="ScrollBar.PageUpCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.DecreaseRepeatButton> <!-- Thumb --> <Track.Thumb> <Thumb MinHeight="10" Template="{StaticResource ThumbTemplate}"/> </Track.Thumb> <!-- PageRepeatButton --> <Track.IncreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeIncrease" Command="ScrollBar.PageDownCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.IncreaseRepeatButton> </Track> </Border> <!-- LineRepeatButton --> <Border x:Name="VerticalSmallIncrease" Grid.Row="2" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton Margin="0,0,0,0" Command="ScrollBar.LineDownCommand" Interval="50" IsTabStop="False" Style="{StaticResource VerticalScrollBarDownLineRepeatButton}"/> </Border> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="true"> <Setter TargetName="BgInner" Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!-- 3.Horizontal ScrollBar ControlTemplate --> <ControlTemplate x:Key="HorizontalScrollBar" TargetType="{x:Type ScrollBar}"> <Grid x:Name="HorizontalRoot" Height="{TemplateBinding Height}"> <Grid.ColumnDefinitions> <!-- RepeatButton+ Track+RepeatButton --> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <!-- Left RepeatButton --> <Border Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton x:Name="HorizontalSmallDecrease" Margin="0,0,0,0" Command="ScrollBar.LineLeftCommand" Interval="50" IsTabStop="False" Style="{StaticResource HorizontalScrollBarLeftLineRepeatButton}"/> </Border> <!-- Track --> <Border x:Name="BgInner" Grid.Column="1" Margin="0" Background="{StaticResource ScrollBarBackground}" CornerRadius="6" Opacity="1" SnapsToDevicePixels="True"> <Track x:Name="PART_Track" Grid.Column="1" IsDirectionReversed="False"> <!-- Left Hidden RepeatButton --> <Track.DecreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeDecrease" Command="ScrollBar.PageLeftCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.DecreaseRepeatButton> <!-- Thumb --> <Track.Thumb> <Thumb Template="{StaticResource ThumbTemplate}"/> </Track.Thumb> <!-- right Hidden RepeatButton --> <Track.IncreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeIncrease" Command="ScrollBar.PageRightCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.IncreaseRepeatButton> </Track> </Border> <!-- right repeatButton --> <Border Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton Margin="0,0,0,0" Command="ScrollBar.LineRightCommand" Interval="50" IsTabStop="False" Style="{StaticResource HorizontalScrollBarRightLineRepeatButton}"/> </Border> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="true"> <Setter TargetName="BgInner" Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!-- 1.ScrollBar Style --> <Style TargetType="{x:Type ScrollBar}"> <Setter Property="SnapsToDevicePixels" Value="True"/> <Setter Property="OverridesDefaultStyle" Value="true"/> <Style.Triggers> <Trigger Property="Orientation" Value="Horizontal"> <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}"/> <Setter Property="Height" Value="{StaticResource ScrollBarSize}"/> </Trigger> <Trigger Property="Orientation" Value="Vertical"> <Setter Property="Template" Value="{StaticResource VerticalScrollBar}"/> <Setter Property="Width" Value="{StaticResource ScrollBarSize}"/> </Trigger> </Style.Triggers> </Style>


    Best Regards,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.



    2017年9月6日 4:16
    版主

全部回复

  • 你好,

    FlowDocumentScrollViewer有三个部分组成,PART_ContentHost是一个ScrollViewer,PART_FindToolBarHost和PART_ToolBarHost都是一个Decorator。你想重写 FlowDocumentScrollViewer的这个三个部分,前提是你了解FlowDocumentScrollViewer是如何布局的。

    https://msdn.microsoft.com/en-us/library/system.windows.controls.flowdocumentscrollviewer(v=vs.110).aspx

    据我所知, FlowDocumentScrollViewer和许多其他“文档”类型的控件(如FlowDocumentReader)在theme中没有控件模板,而是存储在另一个辅助的WPF DLL中,在主题/generic.baml资源中称为PresentationUI.dll。

    FlowDocumentScrollViewer是一个复杂的布局,建议不要重写模板了。

    Best Regard

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.




    2017年9月5日 7:57
    版主
  • FlowDocumentScrollViewer默认的那个滚动条太难看,必须要改。而如果要改,就必须修改它里面的那个ScrollViewer的模版。

    我现在有几个疑问,首先就是有没有官方的FlowDocumentScrollViewer模版定义?

    其次是,下面是我今天新修改的模版,我反复对比不使用Style的时候“实时可视化树”,确认和默认的模版是一样的。可是为什么偏偏就让表格不能自动填充宽度了呢?

    最后,实际运行的时候,FlowDocumentScrollViewer里面并没有什么ToolBar,为何模版里面要有?

            <Style x:Key="MyFlowDocumentViewer" TargetType="{x:Type FlowDocumentScrollViewer}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Grid>
                                <Border>
                                    <ScrollViewer Name="PART_ContentHost"></ScrollViewer>
                                </Border>
                                <Border Name="PART_ToolBarHost">
                                    <Grid>
                                        <Border Name="PART_FindToolBarHost"></Border>
                                        <Grid>
                                            <RepeatButton/>
                                            <Slider/>
                                            <RepeatButton/>
                                        </Grid>
                                    </Grid>
                                </Border>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>



    da jia hao!


    • 已编辑 liubin 2017年9月6日 4:04
    2017年9月6日 4:01
  • 你好,

    >>FlowDocumentScrollViewer默认的那个滚动条太难看,必须要改。而如果要改,就必须修改它里面的那个ScrollViewer的模版。

    修改滚动条,你直接给ScrollBar设置样式就可以了。没有必要修改ScrollViewer的模板,除非你想修改ScrollViewer的布局。

    >>首先就是有没有官方的FlowDocumentScrollViewer模版定义?

    可能是官方觉得不建议重写也没有必要重写这个模板,因为他是针对FlowDocument特殊的ScrollViewer,和普通的ScrollViewer不同。

    >>其次是,下面是我今天新修改的模版,我反复对比不使用Style的时候“实时可视化树”,确认和默认的模版是一样的。可是为什么偏偏就让表格不能自动填充宽度了呢?

    正如我第一个回复,你至少需要布局三个部分PART_ContentHost,PART_FindToolBarHost和PART_ToolBarHost.

    我不知道你在哪看默认的模板的,FlowDocumentScrollViewer的默认模板放在PresentationUI.dll中。

    参考下面的代码来设置滚动条样式:

    <sys:Double x:Key="ScrollBarSize">20</sys:Double> <SolidColorBrush x:Key="RepeatButtonBackGround" Color="#666"/> <SolidColorBrush x:Key="ThumbBackground" Color="Pink"/> <SolidColorBrush x:Key="MouseOverForeground" Color="Red"/> <SolidColorBrush x:Key="PressedForeground" Color="Brown"/> <SolidColorBrush x:Key="ScrollBarBackground" Color="#666"/>

    <!-- 4.1 Up Fixed RepeatButton style --> <Style x:Key="VerticalScrollBarUpLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,6 L4,4 L 8,6 L 4,0Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.1 Down Fixed RepeatButton style --> <Style x:Key="VerticalScrollBarDownLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,0 L 4,6 L 8,0 L4,2Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.1 Left Fixed RepeatButton style --> <Style x:Key="HorizontalScrollBarLeftLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,4 L 6,8 L4,4 L6,0Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.1 Right Fixed RepeatButton style --> <Style x:Key="HorizontalScrollBarRightLineRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="VerticalAlignment" Value="Center"/> <Setter Property="HorizontalAlignment" Value="Center"/> <Setter Property="Width" Value="auto"/> <Setter Property="Height" Value="auto"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Grid> <Viewbox> <Path x:Name="path" Data="M 0,0 L2,4 L 0,8 L 6,4Z" Fill="{StaticResource RepeatButtonBackGround}"/> </Viewbox> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource PressedForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.2 Track hidden RepeatButton --> <Style x:Key="ScrollBarPageRepeatButton" TargetType="{x:Type RepeatButton}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RepeatButton}"> <Border Background="Transparent"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <!-- 4.Thumb --> <ControlTemplate x:Key="ThumbTemplate" TargetType="Thumb"> <Grid> <Border x:Name="Bg" Margin="4" Background="{StaticResource ThumbBackground}" CornerRadius="4" SnapsToDevicePixels="True"> <!--<Border.Background> <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> <GradientStop Color="#C7C0C0" Offset="0.15"/> <GradientStop Color="#AFA9A9" Offset=".5"/> <GradientStop Color="#989494" Offset=".5"/> <GradientStop Color="#858585" Offset="1"/> </LinearGradientBrush> </Border.Background>--> </Border> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="Bg" Property="Background" Value="{StaticResource MouseOverForeground}"/> </Trigger> <Trigger Property="IsEnabled" Value="False"> <Setter TargetName="Bg" Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!-- 2.Vertical ScrollBar ControlTemplate --> <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}"> <Grid x:Name="VerticalRoot" Height="{TemplateBinding Height}"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <!-- LineRepeatButton --> <Border x:Name="VerticalSmallDecrease" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton Margin="0,0,0,0" Command="ScrollBar.LineUpCommand" Interval="50" IsTabStop="False" Style="{StaticResource VerticalScrollBarUpLineRepeatButton}"/> </Border> <!-- Track --> <Border x:Name="BgInner" Grid.Row="1" Margin="0" Background="{StaticResource ScrollBarBackground}" CornerRadius="6" Opacity="1" SnapsToDevicePixels="True"> <Track x:Name="PART_Track" IsDirectionReversed="true"> <!-- PageRepeatButton --> <Track.DecreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeDecrease" Command="ScrollBar.PageUpCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.DecreaseRepeatButton> <!-- Thumb --> <Track.Thumb> <Thumb MinHeight="10" Template="{StaticResource ThumbTemplate}"/> </Track.Thumb> <!-- PageRepeatButton --> <Track.IncreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeIncrease" Command="ScrollBar.PageDownCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.IncreaseRepeatButton> </Track> </Border> <!-- LineRepeatButton --> <Border x:Name="VerticalSmallIncrease" Grid.Row="2" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton Margin="0,0,0,0" Command="ScrollBar.LineDownCommand" Interval="50" IsTabStop="False" Style="{StaticResource VerticalScrollBarDownLineRepeatButton}"/> </Border> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="true"> <Setter TargetName="BgInner" Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!-- 3.Horizontal ScrollBar ControlTemplate --> <ControlTemplate x:Key="HorizontalScrollBar" TargetType="{x:Type ScrollBar}"> <Grid x:Name="HorizontalRoot" Height="{TemplateBinding Height}"> <Grid.ColumnDefinitions> <!-- RepeatButton+ Track+RepeatButton --> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <!-- Left RepeatButton --> <Border Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton x:Name="HorizontalSmallDecrease" Margin="0,0,0,0" Command="ScrollBar.LineLeftCommand" Interval="50" IsTabStop="False" Style="{StaticResource HorizontalScrollBarLeftLineRepeatButton}"/> </Border> <!-- Track --> <Border x:Name="BgInner" Grid.Column="1" Margin="0" Background="{StaticResource ScrollBarBackground}" CornerRadius="6" Opacity="1" SnapsToDevicePixels="True"> <Track x:Name="PART_Track" Grid.Column="1" IsDirectionReversed="False"> <!-- Left Hidden RepeatButton --> <Track.DecreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeDecrease" Command="ScrollBar.PageLeftCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.DecreaseRepeatButton> <!-- Thumb --> <Track.Thumb> <Thumb Template="{StaticResource ThumbTemplate}"/> </Track.Thumb> <!-- right Hidden RepeatButton --> <Track.IncreaseRepeatButton> <RepeatButton x:Name="HorizontalLargeIncrease" Command="ScrollBar.PageRightCommand" Interval="50" IsTabStop="False" Style="{DynamicResource ScrollBarPageRepeatButton}"/> </Track.IncreaseRepeatButton> </Track> </Border> <!-- right repeatButton --> <Border Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center"> <RepeatButton Margin="0,0,0,0" Command="ScrollBar.LineRightCommand" Interval="50" IsTabStop="False" Style="{StaticResource HorizontalScrollBarRightLineRepeatButton}"/> </Border> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="true"> <Setter TargetName="BgInner" Property="Opacity" Value="0.5"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!-- 1.ScrollBar Style --> <Style TargetType="{x:Type ScrollBar}"> <Setter Property="SnapsToDevicePixels" Value="True"/> <Setter Property="OverridesDefaultStyle" Value="true"/> <Style.Triggers> <Trigger Property="Orientation" Value="Horizontal"> <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}"/> <Setter Property="Height" Value="{StaticResource ScrollBarSize}"/> </Trigger> <Trigger Property="Orientation" Value="Vertical"> <Setter Property="Template" Value="{StaticResource VerticalScrollBar}"/> <Setter Property="Width" Value="{StaticResource ScrollBarSize}"/> </Trigger> </Style.Triggers> </Style>


    Best Regards,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.



    2017年9月6日 4:16
    版主