CODEWITHSUNDEEP
c#wpf
lebhero
lebhero

Reputation: 1441

change style of stackpanel childs on mouseover

How do i set the style for 2 different controls in a stackpanel on mouseover? i have the following:

<StackPanel Orientation="Horizontal">
      <Image x:Name="InfoImg" Source="off.png"/>
      <Label x:Name="InfoLabel" Content="OFF"/>
</StackPanel>

onMouseOver the stackpanel, i would like to change the image source to

<Image x:Name="InfoImg" Source="on.png"/>

and the Label text to

<Label x:Name="InfoLabel" Content="ON"/>

thanks in advance

Upvotes: 1

Views: 1118

Answers (1)

nkoniishvt
nkoniishvt

Reputation: 2521

<StackPanel>
    <StackPanel.Style>
        <Style TargetType="{x:Type StackPanel}">
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter TargetName="YOUR_IMAGE_NAME" Property="Source" Value="on.png"/>
                    <Setter TargetName="YOUR_TEXTBLOCK_NAME" Property="Text" Value="ON"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </StackPanel.Style>
    <StackPanel.Resources>
        <Style TargetType="{x:Type Image}">
            <Setter Property="Source" Value="off.png"/>
        </Style>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Text" Value="OFF"/>
        </Style>
    </StackPanel.Resources>
</StackPanel>

You can add a key to those styles if you want to apply them only to specific Images & TextBlocks among other.

Upvotes: 1

Related Questions