2010-11-10 35 views
3

如何使我的滚动条样式使用我的文本框样式的滚动查看器?设置文本框的滚动条样式

<Style x:Key="MyTextBoxStyle" BasedOn="{x:Null}" TargetType="{x:Type TextBox}">      
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type TextBoxBase}"> 
       <Grid> 
        <Rectangle x:Name="_rct" Stroke="#FFA8AFBE" RadiusX="8" RadiusY="8" Fill="White" /> 
        <Border Name="Border" BorderThickness="2" CornerRadius="8" BorderBrush="#FFA8AFBE" Background="White">     
         <ScrollViewer Margin="6" x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
        </Border> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    </Style> 

我的滚动条风格:

<Style x:Key="MyScrollBarStyle" TargetType="{x:Type ScrollBar}"> 
    <Setter Property="Background" Value="#ff007eb1"/> 
    <Setter Property="BorderBrush" Value="Transparent"/> 
    <Style.Triggers> 
     <Trigger Property="Orientation" Value="Vertical"> 
      <Setter Property="Width" Value="5"/> 
      <Setter Property="Height" Value="Auto" /> 
      <Setter Property="Template" Value="{StaticResource VerticalScrollBar}" /> 
     </Trigger> 
     <Trigger Property="Orientation" Value="Horizontal"> 
      <Setter Property="Width" Value="Auto"/> 
      <Setter Property="Height" Value="5" /> 
      <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}" /> 
     </Trigger> 
    </Style.Triggers>  
</Style> 
+0

你是什么意思的“滚动条样式?”是否显示滚动条?或者是其他东西? – cdhowie 2010-11-10 02:44:01

+0

我已更新我的问题 – Robert 2010-11-10 02:57:32

+0

啊,我明白了。不幸的是,我也不知道。 :) – cdhowie 2010-11-10 03:00:26

回答

0

你必须修改的ScrollViewer模板。

<ControlTemplate TargetType="{x:Type ScrollViewer}"> 
<Grid Background="{TemplateBinding Background}"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="Auto"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="Auto"/> 
    </Grid.RowDefinitions> 
    <ScrollBar 
     x:Name="PART_VerticalScrollBar" 
     Grid.Column="1" 
     Minimum="0.0" 
     Maximum="{TemplateBinding ScrollableHeight}" 
     ViewportSize="{TemplateBinding ViewportHeight}" 
     Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=VerticalOffset, Mode=OneWay}" 
     Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"   
     Cursor="Arrow" 
     AutomationProperties.AutomationId="VerticalScrollBar" 
     Style="{StaticResource MyScrollBarStyle}"/> 
    <ScrollBar 
     x:Name="PART_HorizontalScrollBar" 
     Orientation="Horizontal" 
     Grid.Row="1" 
     Minimum="0.0" 
     Maximum="{TemplateBinding ScrollableWidth}" 
     ViewportSize="{TemplateBinding ViewportWidth}" 
     Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=HorizontalOffset, Mode=OneWay}" 
     Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" 
     Cursor="Arrow" 
     AutomationProperties.AutomationId="HorizontalScrollBar" 
     Style="{StaticResource MyScrollBarStyle}"/> 
    <ScrollContentPresenter 
     x:Name="PART_ScrollContentPresenter" 
     Margin="{TemplateBinding Padding}" 
     Content="{TemplateBinding Content}" 
     ContentTemplate="{TemplateBinding ContentTemplate}" 
     CanContentScroll="{TemplateBinding CanContentScroll}"/> 
    <Rectangle 
     x:Name="Corner" 
     Grid.Column="1" 
     Grid.Row="1" 
     Fill="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> 
</Grid> 

,或者使得它被应用到所有的滚动条控件,你可以删除风格的关键。希望这可以帮助。

2

你可以做如下:

<TextBox> 
    <TextBox.Resources> 
     <Style TargetType="{x:Type ScrollBar}" 
       BasedOn="{StaticResource MyScrollBarStyle}"></Style> 
    </TextBox.Resources> 
</TextBox> 
0

在Silverlight 5,

<TextBox TextWrapping="Wrap" VerticalScrollBarVisibility="Auto"> 
<TextBox.Resources> 
    <Style TargetType="ScrollBar" BasedOn="{StaticResource ScrollBarStyle1}"> 
          </Style> 
    </TextBox.Resources> 

要定义自己的滚动条风格visit here