样式GridSplitter wpf C#

Question

我想为我的GridSplitter设置样式,就像添加点一样(如http://msdn.microsoft.com/en-us/library/aa970265.aspx上所示).

我还想在mouseOver上更改gridsplitter颜色,或者应用Aero Theme.

<Style x:Key="GridSplitterStyle1" TargetType="{x:Type GridSplitter}">
  <Setter Property="Background"
          Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
  <Setter Property="PreviewStyle">
    <Setter.Value>
      <Style>
        <Setter Property="Control.Template">
          <Setter.Value>
            <ControlTemplate>
              <Rectangle Fill="#80000000"/>
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Style>
    </Setter.Value>
  </Setter>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type GridSplitter}">
        <Border Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"/>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

<!--Theme-->
<ResourceDictionary.MergedDictionaries>
  <ResourceDictionary 
   Source="/RibbonControlsLibrary;component/Themes/Office2007Blue.xaml" />
</ResourceDictionary.MergedDictionaries>

<GridSplitter x:Name="gridSplitterTreeNodes" Width="10"
              BorderThickness="1,0" Cursor="SizeWE"
              RenderTransformOrigin="-1.2,0.507" ShowsPreview="True" 
              Style="{DynamicResource GridSplitterStyle1}">
  <GridSplitter.Background>
    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
      <GradientStop Color="#FFE3EFFF" Offset="0"/>
      <GradientStop Color="#FFAFD2FF" Offset=".45"/>
    </LinearGradientBrush>
  </GridSplitter.Background>
</GridSplitter>

Answer 1

主要用于我自己将来的参考,这里是一个垂直网格分割器,它具有一个按钮的圆形形状(但不会对鼠标悬停做出正确反应):

<GridSplitter Grid.Column="1" VerticalAlignment="Stretch" HorizontalAlignment="Center" Width="8">
    <GridSplitter.Template>
        <ControlTemplate TargetType="{x:Type GridSplitter}">
            <Grid>
                <Button Content="?" />
                <Rectangle Fill="#00FFFFFF" />
            </Grid>
        </ControlTemplate>
    </GridSplitter.Template>
</GridSplitter>

水平分割器可以使用"···"作为按钮的内容.

Answer 2

<GridSplitter x:Name="gridSplitterTreeNodes" Width="5" BorderThickness="1,0" 
     Cursor="SizeWE" RenderTransformOrigin="-1.2,0.507" ShowsPreview="True"
     Style="{DynamicResource GridSplitterStyle1}">
  <GridSplitter.Background>
    <ImageBrush ImageSource="Images\gripDots.png" TileMode="FlipXY" 
                Stretch="UniformToFill"/>
  </GridSplitter.Background>
</GridSplitter>

您还可以从Msnd Microsoft保存图像以获得相同的效果,更多信息

Answer 3

在不丢失鼠标事件的情况下向 GridSplitter 添加“抓取器”按钮/图形的另一种方法是在拆分器顶部使用简单的标签。

\n\n

    <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Background="Gray"/>\n\n    <Label Grid.Column="1" Content="\xe2\x81\x9e" Foreground="White" VerticalAlignment="Center" FontSize="26" FontWeight="Bold" IsHitTestVisible="False"/>\n

\n\n

确保 GridSplitter 和 Label 位于同一列中，并且在 Label 中设置 IsHitTestVisible=False。

\n