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