0
任何人都知道在Web上出现的WPF滚动条样式，我可以使用它代替自己滚动，基本上像Blend滚动条会很酷。如果我不必从头开始，这将节省很多时间。我知道这个http://sachabarber.net/?p=122，但它不够接近我想要的。就像我说过的，我可以推出自己的产品，但如果有预先制作的例子，它会节省时间。WPF的滚动条样式
A
回答
4
0
我知道它可能有点晚，但我发现这个http://wpf.codeplex.com/wikipage?title=WPF%20Themes。
2
我创建了滚动条样式的资源字典，突出显示颜色。有了这个，我很快适应新的风格。下面的示例模仿MS Outlook 2013滚动条。
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:system="clr-namespace:System;assembly=mscorlib">
<!-- this should better reside in a separate color resource dictionary-->
<Color x:Key="White">#FFFFFFFF</Color>
<Color x:Key="GrayUltraLight">#FFF2F2F2</Color>
<Color x:Key="GrayLight">#FFD4D4D4</Color>
<Color x:Key="GrayMedium">#FFAAAAAA</Color>
<Color x:Key="GrayMediumDark">#FF777777</Color>
<SolidColorBrush x:Key="WhiteBrush" Color="{StaticResource White}" />
<SolidColorBrush x:Key="GrayUltraLightBrush" Color="{StaticResource GrayUltraLight}" />
<SolidColorBrush x:Key="GrayLightBrush" Color="{StaticResource GrayLight}" />
<SolidColorBrush x:Key="GrayMediumBrush" Color="{StaticResource GrayMedium}" />
<SolidColorBrush x:Key="GrayMediumDarkBrush" Color="{StaticResource GrayMediumDark}" />
<!-- changing height/width of scrollbar -->
<system:Double x:Key="{x:Static SystemParameters.VerticalScrollBarWidthKey}">15</system:Double>
<system:Double x:Key="{x:Static SystemParameters.HorizontalScrollBarHeightKey}">15</system:Double>
<system:Double x:Key="{x:Static SystemParameters.VerticalScrollBarButtonHeightKey}">15</system:Double>
<system:Double x:Key="{x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}">15</system:Double>
<!-- routing to base colors, but using new names in order to make changes easy -->
<SolidColorBrush x:Key="VerticalScrollBarBackground" Color="{Binding Color, Source={StaticResource GrayUltraLightBrush}}" />
<SolidColorBrush x:Key="HorizontalScrollBarBackground" Color="{Binding Color, Source={StaticResource VerticalScrollBarBackground}}" />
<SolidColorBrush x:Key="ScrollBarDisabledBackground" Color="{Binding Color, Source={StaticResource GrayUltraLightBrush}}" />
<SolidColorBrush x:Key="ThumbBackground" Color="{Binding Color, Source={StaticResource WhiteBrush}}" />
<SolidColorBrush x:Key="ThumbMouseOverBrush" Color="{Binding Color, Source={StaticResource GrayUltraLightBrush}}" />
<SolidColorBrush x:Key="ThumbPressedBrush" Color="{Binding Color, Source={StaticResource GrayUltraLightBrush}}" />
<Thickness x:Key="ThumbBorderThickness">1</Thickness>
<SolidColorBrush x:Key="ThumbBorderBrush" Color="{Binding Color, Source={StaticResource GrayMediumBrush}}" />
<SolidColorBrush x:Key="ThumbMouseOverBorderBrush" Color="{Binding Color, Source={StaticResource GrayMediumBrush}}" />
<SolidColorBrush x:Key="ThumbPressedBorderBrush" Color="{Binding Color, Source={StaticResource GrayMediumDarkBrush}}" />
<SolidColorBrush x:Key="ButtonBackground" Color="{Binding Color, Source={StaticResource WhiteBrush}}" />
<SolidColorBrush x:Key="ButtonMouseOverBrush" Color="{Binding Color, Source={StaticResource WhiteBrush}}" />
<SolidColorBrush x:Key="ButtonPressedBrush" Color="{Binding Color, Source={StaticResource GrayUltraLightBrush}}" />
<Thickness x:Key="ButtonBorderThickness">1</Thickness>
<SolidColorBrush x:Key="ButtonBorderBrush" Color="{Binding Color, Source={StaticResource GrayMediumBrush}}" />
<SolidColorBrush x:Key="ButtonMouseOverBorderBrush" Color="{Binding Color, Source={StaticResource GrayMediumDarkBrush}}" />
<SolidColorBrush x:Key="ButtonPressedBorderBrush" Color="{Binding Color, Source={StaticResource GrayMediumDarkBrush}}" />
<SolidColorBrush x:Key="ArrowBrush" Color="{Binding Color, Source={StaticResource GrayMediumDarkBrush}}"/>
<SolidColorBrush x:Key="ArrowMouseOverBrush" Color="{Binding Color, Source={StaticResource GrayMediumDarkBrush}}"/>
<SolidColorBrush x:Key="ArrowPressedBrush" Color="{Binding Color, Source={StaticResource GrayMediumDarkBrush}}"/>
<!-- ScrollViewer (implicit style) -->
<Style x:Key="{x:Type ScrollViewer}" TargetType="{x:Type ScrollViewer}">
<Setter Property="Template" >
<Setter.Value>
<ControlTemplate TargetType="{x:Type ScrollViewer}">
<Grid x:Name="Grid" Background="{TemplateBinding Background}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Rectangle x:Name="Corner" Grid.Column="1" Fill="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" Grid.Row="1"/>
<ScrollContentPresenter x:Name="PART_ScrollContentPresenter" CanContentScroll="{TemplateBinding CanContentScroll}" CanHorizontallyScroll="False" CanVerticallyScroll="False" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="0" Margin="{TemplateBinding Padding}" Grid.Row="0"/>
<ScrollBar x:Name="PART_VerticalScrollBar" AutomationProperties.AutomationId="VerticalScrollBar" Cursor="Arrow" Grid.Column="1" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Grid.Row="0" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ViewportHeight}" Style="{DynamicResource ScrollBarStyle1}"/>
<ScrollBar x:Name="PART_HorizontalScrollBar" AutomationProperties.AutomationId="HorizontalScrollBar" Cursor="Arrow" Grid.Column="0" Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Orientation="Horizontal" Grid.Row="1" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ViewportWidth}" Style="{DynamicResource ScrollBarStyle1}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
</Style>
<!-- Buttons (with arrows) -->
<Style x:Key="ScrollBarButton" TargetType="{x:Type RepeatButton}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="Root" Margin="0">
<Border x:Name="BackgroundBorder" Background="{StaticResource ButtonBackground}" BorderBrush="{StaticResource ButtonBorderBrush}" BorderThickness="{StaticResource ButtonBorderThickness}"/>
<Path x:Name="Arrow" Stretch="None" Data="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" Fill="{StaticResource ArrowBrush}" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="True"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="BackgroundBorder" Property="Background" Value="{StaticResource ButtonMouseOverBrush}"/>
<Setter TargetName="BackgroundBorder" Property="BorderBrush" Value="{StaticResource ButtonMouseOverBorderBrush}"/>
<Setter TargetName="Arrow" Property="Fill" Value="{StaticResource ArrowMouseOverBrush}"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="BackgroundBorder" Property="Background" Value="{StaticResource ButtonPressedBrush}"/>
<Setter TargetName="BackgroundBorder" Property="BorderBrush" Value="{StaticResource ButtonPressedBorderBrush}"/>
<Setter TargetName="Arrow" Property="Fill" Value="{StaticResource ArrowPressedBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- PageButtons -->
<Style x:Key="VerticalScrollBarPageButton" TargetType="{x:Type RepeatButton}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Rectangle Fill="{TemplateBinding Background}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HorizontalScrollBarPageButton" TargetType="{x:Type RepeatButton}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Rectangle Fill="{TemplateBinding Background}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- Thumb -->
<Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="Background" Value="{StaticResource ThumbBackground}"/>
<Setter Property="BorderBrush" Value="{StaticResource ThumbBorderBrush}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Grid Background="Transparent">
<Border Background="{TemplateBinding Background}" Margin="{TemplateBinding Padding}"
BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{StaticResource ThumbBorderThickness}" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="{StaticResource ThumbMouseOverBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource ThumbMouseOverBorderBrush}"/>
</Trigger>
<Trigger Property="IsDragging" Value="True">
<Setter Property="Background" Value="{StaticResource ThumbPressedBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource ThumbPressedBorderBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- ScrollBar -->
<Style x:Key="ScrollBarStyle1" TargetType="{x:Type ScrollBar}">
<Setter Property="Background" Value="{StaticResource VerticalScrollBarBackground}"/>
<Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="false"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="Width" Value="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}"/>
<Setter Property="MinWidth" Value="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ScrollBar}">
<Grid x:Name="Bg" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
<Grid.RowDefinitions>
<RowDefinition MaxHeight="{DynamicResource {x:Static SystemParameters.VerticalScrollBarButtonHeightKey}}"/>
<RowDefinition Height="0.00001*"/>
<RowDefinition MaxHeight="{DynamicResource {x:Static SystemParameters.VerticalScrollBarButtonHeightKey}}"/>
</Grid.RowDefinitions>
<RepeatButton Command="{x:Static ScrollBar.LineUpCommand}" IsEnabled="{TemplateBinding IsMouseOver}" Style="{StaticResource ScrollBarButton}" Content="M 0 3.5 L 3.5 0 L 7 3.5 Z" />
<Track x:Name="PART_Track" IsDirectionReversed="true" IsEnabled="{TemplateBinding IsMouseOver}" Grid.Row="1">
<Track.DecreaseRepeatButton>
<RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource ScrollBarThumb}" />
</Track.Thumb>
</Track>
<RepeatButton Command="{x:Static ScrollBar.LineDownCommand}" IsEnabled="{TemplateBinding IsMouseOver}" Grid.Row="2" Style="{StaticResource ScrollBarButton}" Content="M 0 0 L 7 0 L 3.5 3.5 Z" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="Bg" Value="{StaticResource ScrollBarDisabledBackground}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="Orientation" Value="Horizontal">
<Setter Property="Width" Value="Auto"/>
<Setter Property="MinWidth" Value="0"/>
<Setter Property="Height" Value="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarHeightKey}}"/>
<Setter Property="MinHeight" Value="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarHeightKey}}"/>
<Setter Property="Background" Value="{StaticResource HorizontalScrollBarBackground}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ScrollBar}">
<Grid x:Name="Bg" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
<Grid.ColumnDefinitions>
<ColumnDefinition MaxWidth="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}}"/>
<ColumnDefinition Width="0.00001*"/>
<ColumnDefinition MaxWidth="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}}"/>
</Grid.ColumnDefinitions>
<RepeatButton Command="{x:Static ScrollBar.LineLeftCommand}" IsEnabled="{TemplateBinding IsMouseOver}" Style="{StaticResource ScrollBarButton}" Content="M 3.5 0 L 3.5 7 L 0 3.5 Z"/>
<Track x:Name="PART_Track" Grid.Column="1" IsEnabled="{TemplateBinding IsMouseOver}">
<Track.DecreaseRepeatButton>
<RepeatButton Command="{x:Static ScrollBar.PageLeftCommand}" Style="{StaticResource HorizontalScrollBarPageButton}"/>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Command="{x:Static ScrollBar.PageRightCommand}" Style="{StaticResource HorizontalScrollBarPageButton}"/>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource ScrollBarThumb}" />
</Track.Thumb>
</Track>
<RepeatButton Grid.Column="2" Command="{x:Static ScrollBar.LineRightCommand}" IsEnabled="{TemplateBinding IsMouseOver}" Style="{StaticResource ScrollBarButton}" Content="M 0 0 L 3.5 3.5 L 0 7 Z" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="Bg" Value="{StaticResource ScrollBarDisabledBackground}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
相关问题
- 1. WPF自定义滚动条 - Zune样式滚动条
- 2. Wpf滚动条样式三角形
- 3. [WPF]：样式化滚动条，但ListView的滚动不受风格
- 4. 滚动条样式
- 5. TextView的滚动条样式
- 6. 样式滚动条css colorbox
- 7. ListView滚动条样式
- 8. 更改滚动条样式
- 9. webkit css滚动条样式
- 10. 带有样式化滚动条的文本框不再自动滚动WPF
- 11. wpf中的滚动条样式根据以下图像
- 12. 为什么WPF控制不同的滚动条样式？
- 13. WPF NavigationWindow滚动条
- 14. Qt的垂直滚动条的样式
- 15. Webkit滚动条动态样式
- 16. 仅更改iframe的滚动条样式
- 17. 数据表上的滚动条样式
- 18. 滚动条的样式不起作用
- 19. div上的CSS3滚动条样式
- 20. C＃ - 带滚动条样式的ProgressBar
- 21. 如何设置水平滚动列表的滚动条样式？
- 22. 如何更改滚动条样式
- 23. 更改iframe滚动条样式
- 24. JScrollpane不会样式滚动条
- 25. 样式溢出-y滚动条
- 26. CSS滚动条样式跨浏览器
- 27. CSS，HTML或Jquery - 滚动条样式
- 28. Flex滚动条样式问题
- 29. Wpf datagrid滚动条冻结
- 30. WPF滚动条位置
你到底想达到什么目的？你在示例中包含的链接确实确定了滚动条的样式，但它不符合美学上的要求，而且您希望获得更好的内容，或者希望获得帮助理解链接中的代码，以便您可以更好地实现自己的目标？ – evasilchenko
我正在寻找一些看起来更像滚动条风格的东西，基本上我说的是我很懒，不想从头开始形式划痕。这不是理解它的问题。这是试图节省时间的问题。 – Kenn