ScrollViewerのスクロールバーのスタイルを編集するには？

Question

ScrollViewerのテンプレートを編集する方法は、すでにテンプレートのコピーを編集して知っています。しかし、スクロールバーを編集するにはどうすればいいですか？ - その中のScrollViewerのスタイルは？

_{（私が欲しいものthisの回答で提案されているようにそのFadeOutアニメーションのBeginTimeを変更することです。私は、アプリ内のすべてのスクロールバーの挙動を変更する必要はありません。）}

にはいくつかの方法があります場合はコードでXAMLの代わりにこれを行うと、これは素晴らしいことです。その後、

Answer 1

最初の編集、スクロールバーのスタイルテンプレートとページのリソース に配置し、

Hereを編集するためのスクロールバーのスタイルテンプレートでこのリソースを識別するためのキー（「customScrollBar」）を使用。

あなたに合った開始時刻で編集します。

<Storyboard> 
    <FadeOutThemeAnimation BeginTime="1" TargetName="HorizontalPanningRoot" /> 
    <FadeOutThemeAnimation BeginTime="1" TargetName="VerticalPanningRoot" /> 
    <FadeOutThemeAnimation BeginTime="1" TargetName="HorizontalRoot" /> 
    <FadeOutThemeAnimation BeginTime="1" TargetName="VerticalRoot" /> 
</Storyboard> 

そして、私は上記のScrollViewerの中で "customScrollBar" スタイルを追加しましたどのように注意してください

<Style x:Key="customScrollViewer" TargetType="ScrollViewer"> 
     <Setter Property="HorizontalScrollMode" Value="Auto" /> 
     <Setter Property="VerticalScrollMode" Value="Auto" /> 
     <Setter Property="IsHorizontalRailEnabled" Value="True" /> 
     <Setter Property="IsVerticalRailEnabled" Value="True" /> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="ZoomMode" Value="Disabled" /> 
     <Setter Property="HorizontalContentAlignment" Value="Left" /> 
     <Setter Property="VerticalContentAlignment" Value="Top" /> 
     <Setter Property="VerticalScrollBarVisibility" Value="Visible" /> 
     <Setter Property="Padding" Value="0" /> 
     <Setter Property="BorderThickness" Value="0" /> 
     <Setter Property="BorderBrush" Value="Transparent" /> 
     <Setter Property="Background" Value="Transparent" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="ScrollViewer"> 
        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="ScrollingIndicatorStates"> 
           <VisualStateGroup.Transitions> 
            <VisualTransition From="MouseIndicator" To="NoIndicator"> 
             <Storyboard> 
              <FadeOutThemeAnimation TargetName="ScrollBarSeparator" BeginTime="0:0:3" /> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode"> 
               <DiscreteObjectKeyFrame KeyTime="0:0:3"> 
                <DiscreteObjectKeyFrame.Value> 
                 <ScrollingIndicatorMode>None</ScrollingIndicatorMode> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode"> 
               <DiscreteObjectKeyFrame KeyTime="0:0:3"> 
                <DiscreteObjectKeyFrame.Value> 
                 <ScrollingIndicatorMode>None</ScrollingIndicatorMode> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualTransition> 
            <VisualTransition From="TouchIndicator" To="NoIndicator"> 
             <Storyboard> 
              <FadeOutThemeAnimation TargetName="ScrollBarSeparator" /> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode"> 
               <DiscreteObjectKeyFrame KeyTime="0:0:0.5"> 
                <DiscreteObjectKeyFrame.Value> 
                 <ScrollingIndicatorMode>None</ScrollingIndicatorMode> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode"> 
               <DiscreteObjectKeyFrame KeyTime="0:0:0.5"> 
                <DiscreteObjectKeyFrame.Value> 
                 <ScrollingIndicatorMode>None</ScrollingIndicatorMode> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualTransition> 
           </VisualStateGroup.Transitions> 

           <VisualState x:Name="NoIndicator"> 
            <Storyboard> 
             <FadeOutThemeAnimation TargetName="ScrollBarSeparator" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="TouchIndicator"> 
            <Storyboard> 
             <FadeOutThemeAnimation TargetName="ScrollBarSeparator" /> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode" 
              Duration="0"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <ScrollingIndicatorMode>TouchIndicator</ScrollingIndicatorMode> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode" 
              Duration="0"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <ScrollingIndicatorMode>TouchIndicator</ScrollingIndicatorMode> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="MouseIndicator"> 
            <Storyboard> 
             <FadeInThemeAnimation TargetName="ScrollBarSeparator" /> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode" 
              Duration="0"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <ScrollingIndicatorMode>MouseIndicator</ScrollingIndicatorMode> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalScrollBar" 
              Storyboard.TargetProperty="IndicatorMode" 
              Duration="0"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <ScrollingIndicatorMode>MouseIndicator</ScrollingIndicatorMode> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Grid Background="{TemplateBinding Background}"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="*" /> 
           <ColumnDefinition Width="Auto" /> 
          </Grid.ColumnDefinitions> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="*" /> 
           <RowDefinition Height="Auto" /> 
          </Grid.RowDefinitions> 
          <ScrollContentPresenter x:Name="ScrollContentPresenter" 
           Grid.RowSpan="2" 
           Grid.ColumnSpan="2" 
           ContentTemplate="{TemplateBinding ContentTemplate}" 
           Margin="{TemplateBinding Padding}" /> 
          <ScrollBar x:Name="VerticalScrollBar" Style="{StaticResource customScrollBar}" 
               Grid.Column="1" 
               IsTabStop="False" 
               Maximum="{TemplateBinding ScrollableHeight}" 
               Orientation="Vertical" 
               Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" 
               Value="{TemplateBinding VerticalOffset}" 
               ViewportSize="{TemplateBinding ViewportHeight}" 
               HorizontalAlignment="Right" /> 
          <ScrollBar x:Name="HorizontalScrollBar" 
           IsTabStop="False" 
           Maximum="{TemplateBinding ScrollableWidth}" 
           Orientation="Horizontal" 
           Grid.Row="1" 
           Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" 
           Value="{TemplateBinding HorizontalOffset}" 
           ViewportSize="{TemplateBinding ViewportWidth}" /> 
          <Border x:Name="ScrollBarSeparator" 
       Grid.Row="1" 
       Grid.Column="1" 
       Background="{ThemeResource SystemControlPageBackgroundChromeLowBrush}" /> 
         </Grid> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

スタイリング以下ScrollViewerのを追加します。