我有 2 种垂直滚动条和水平滚动条的样式，很长一段时间以来，我无法将它们组合成一种样式用于我的 ScrollViewer 我有 VerticalScrollBar 的样式
<Style x:Name="VerticalScrollBar" TargetType="{x:Type ScrollBar}">
<Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="false"/>
<Setter Property="Background" Value="{DynamicResource ScrollBarBackgroundBrush}"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Width" Value="4"/>
<Setter Property="MinWidth" Value="4"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ScrollBar}">
<Grid x:Name="Bg" SnapsToDevicePixels="true">
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
Width="4"
MaxWidth="4"
Grid.Row="1"/>
<Track x:Name="Vertical_Track"
IsDirectionReversed="true"
IsEnabled="{TemplateBinding IsMouseOver}"
Grid.Row="1">
<Track.Thumb>
<Thumb Style="{StaticResource ScrollBarThumbVertical}"
Width="{TemplateBinding Width}"/>
</Track.Thumb>
</Track>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ScrollBarThumbVertical" TargetType="{x:Type Thumb}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Rectangle x:Name="rectangleVertical"
Fill="{DynamicResource ScrollBarThumbBrush}"
Height="{TemplateBinding Height}"
SnapsToDevicePixels="True"
Width="{TemplateBinding Width}"/>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Fill"
TargetName="rectangleVertical"
Value="{DynamicResource ScrollBarThumbPressedBrush}"/>
</Trigger>
<Trigger Property="IsDragging" Value="true">
<Setter Property="Fill"
TargetName="rectangleVertical"
Value="{DynamicResource ScrollBarThumbPressedBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
对于 HorizontalScrollBar
<Style x:Key="HorizontalScrollBar" TargetType="{x:Type ScrollBar}">
<Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="false"/>
<Setter Property="Background" Value="{DynamicResource ScrollBarBackgroundBrush}"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Height" Value="4"/>
<Setter Property="MinHeight" Value="4"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ScrollBar}">
<Grid x:Name="Bg" SnapsToDevicePixels="true">
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
Grid.Column="1"/>
<Track x:Name="Horizontal_Track"
IsDirectionReversed="False"
IsEnabled="{TemplateBinding IsMouseOver}"
Grid.Column="1">
<Track.Thumb>
<Thumb Style="{StaticResource ScrollBarThumbHorizontal}"
Height="{TemplateBinding Height}"/>
</Track.Thumb>
</Track>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ScrollBarThumbHorizontal" TargetType="{x:Type Thumb}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Rectangle x:Name="rectangleHorizontal"
Fill="{DynamicResource ScrollBarThumbBrush}"
Height="{TemplateBinding Height}"
SnapsToDevicePixels="True"
Width="{TemplateBinding Width}"/>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Fill"
TargetName="rectangleHorizontal"
Value="{DynamicResource ScrollBarThumbPressedBrush}"/>
</Trigger>
<Trigger Property="IsDragging" Value="true">
<Setter Property="Fill"
TargetName="rectangleHorizontal"
Value="{DynamicResource ScrollBarThumbPressedBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
如何在保持 HorizontalScrollBar 和 VerticalScrollBar 的样式的同时将它们组合成一个 ScrollBar？
我的问题是类似的WPF ScrollBar 样式，但我需要 uwp
您可以执行以下步骤来实现您想要的。
key为您创建的这些样式添加一个。VerticalScrollBar和HorizontalScrollBarStyle="{StaticResource StyleKey}"ScrollBars Xaml 代码以应用您制作的样式它应该是这样的：
<Style x:Key="ScrollViewerStyle1" TargetType="ScrollViewer">
....
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ScrollViewer">
....
<Border x:Name="Root" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}">
....
<Grid Background="{TemplateBinding Background}">
....
<ScrollBar x:Name="VerticalScrollBar"
Grid.Column="1"
HorizontalAlignment="Right"
IsTabStop="False"
Maximum="{TemplateBinding ScrollableHeight}"
Orientation="Vertical"
ViewportSize="{TemplateBinding ViewportHeight}"
Value="{TemplateBinding VerticalOffset}"
Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
Style="{StaticResource YourVerticalScrollBarKey}"
/>
<ScrollBar x:Name="HorizontalScrollBar"
IsTabStop="False"
Maximum="{TemplateBinding ScrollableWidth}"
Orientation="Horizontal"
Grid.Row="1"
ViewportSize="{TemplateBinding ViewportWidth}"
Value="{TemplateBinding HorizontalOffset}"
Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
Style="{StaticResource YourHorizontalScrollBarKey}"
/>
<Border x:Name="ScrollBarSeparator" Background="{ThemeResource ScrollViewerScrollBarSeparatorBackground}" Grid.Column="1" Opacity="0" Grid.Row="1"/>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句