WPF: How to Style Horizontal GridSplitter




<Window x:Class="HorizontalGridSplitterExample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="HorizontalGridSplitter Example" Height="300" Width="300">
    <Window.Resources>
        
        <Style x:Key="GridSplitterHorizontalGripStyle" TargetType="{x:Type GridSplitter}">
            <Setter Property="HorizontalAlignment" Value="Stretch" />
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
            <Setter Property="Cursor" Value="SizeNS" />
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
            <Setter Property="Background"
                    Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type GridSplitter}">
                        <Border BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Background="{TemplateBinding Background}"
                                Height="{TemplateBinding Height}">
                            <Border Width="50" Height="4" HorizontalAlignment="Center"
                                    BorderThickness="0 1" Background="White" BorderBrush="#A0A0A0">
                            </Border>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
 
        <Style x:Key="HorizontalGridSplitter" TargetType="{x:Type GridSplitter}"
                BasedOn="{StaticResource GridSplitterHorizontalGripStyle}">
            <Setter Property="Height" Value="6" />
            <Setter Property="Margin" Value="0 15" />
            <Setter Property="HorizontalAlignment" Value="Stretch" />
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid>
            <Border Background="LightBlue" />
        </Grid>
        
        <GridSplitter Grid.Row="1" Style="{StaticResource HorizontalGridSplitter}"/>
        <Grid Grid.Row="2">
            <Border Background="LightBlue" />
        </Grid>
    </Grid>
</Window>

Comments

Popular posts from this blog

WPF How to Dispose ViewModel when the associated UserControl (Not Window) closes?

C# How to unit test Dispatcher

WPF: How to Deep Copy WPF object (e.g. UIElement) ?