Gridsplitter visibile on MouseOver

1.8k views Asked by At

I want a GridSplitter to be visible only when the user has the mouse over it. For that I'm setting a DataTrigger in its style. But I can't figure out what it's wrong because I don't get the desired behavior. It just stays the same.

                <GridSplitter
            ResizeDirection="Columns"
            ResizeBehavior="BasedOnAlignment"
            Grid.Column="1"
            Grid.Row="0"
            Grid.RowSpan="2"
            Width="8"
            Height="Auto"
            HorizontalAlignment="Left"
            VerticalAlignment="Stretch" 
                Background="AliceBlue"
            Margin="-3 0 0 0">
                <GridSplitter.Style>
                    <Style TargetType="{x:Type GridSplitter}">
                        <Setter Property="Visibility" Value="Hidden"/>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding IsMouseOver}">
                                <Setter Property="Visibility" Value="Visible"/>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </GridSplitter.Style>
            </GridSplitter>

Do you see something wrong? Does GridSplitter must be styled in a different way?

1

There are 1 answers

0
Sturm On BEST ANSWER

I figured it out, Triggers must be used instead of DataTriggers:

<GridSplitter.Style>
    <Style TargetType="{x:Type GridSplitter}">
        <Setter Property="Background" Value="Transparent"/>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="AliceBlue"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</GridSplitter.Style>

By the way, I think that if I set the Visibility to Hidden I can't target the GridSplitter, so I switch its Background instead.