Show Button on Label MouseHover in WPF

Question

In my application i have a Startup Window that contains (Tips, Information, etc.). A part of the window contains 3 Labels on the left side and 3 hidden Buttons on the right side. What i want is whenever a user hovers on one of the Labels the button which is located on the other side of the Label shows up.

I know how to show the Button if i hover over it using Triggers, but how to show the button when i hover the Label.

Is it possible for such thing to be done?

Answer 1

You can do that easily using a DataTrigger and the Binding.ElementName property. This simple example shows how:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Button Grid.Row="0" Content="Click me">
        <Button.Style>
            <Style TargetType="{x:Type Button}">
                <Setter Property="Visibility" Value="Hidden" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsMouseOver, 
                        ElementName=SomeLabel}" Value="True">
                        <Setter Property="Visibility" Value="Visible" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>
    <Label Grid.Row="1" Name="SomeLabel" Content="Hover over me" 
        Background="LightGreen" />
</Grid>

When trying to affect one UI element when something happens to another UI element, try to remember this:

Add the DataTrigger to the UI element that is going to change itself in response to the change of another UI element... you will most likely run into problems doing it the other way around.