Edit: In the original question i made some wrong assumptions about how setters work so i modified it to hopefully be more accurate and useful.
I have tried to make some menu items more interesting by having the icons appear half-transparent if the mouse is not over the item. If the mouse enters, the icon should be animated to become completely visible.
The animations work, Storyboard.TargetProperty
allows direct access to the icon's opacity property:
<Style x:Key="MenuItemMouseOverStyle" TargetType="MenuItem">
<Style.Triggers>
<EventTrigger RoutedEvent="MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Icon.Opacity">
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="MouseLeave">
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Icon.Opacity">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="0.5"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Style.Triggers>
</Style>
If i try to use a setter for the initial icon-opacity the code won't compile:
<Setter Property="Icon.Opacity" Value="0.5"/>
Edit:
Setters do not work the way i tried to use them, you cannot access the properties of properties (see answers)
The only thing you can do is specify a target class if the target type of the style has not been set, the following styles should be equivalent:
<Style x:Key="Style1" TargetType="Image">
<Setter Property="Opacity" Value="0.5"/>
</Style>
<Style x:Key="Style2">
<Setter Property="Image.Opacity" Value="0.5"/>
</Style>
So my question is if there is a way to make this somehow work with a setter.
(My current work-around is a single-keyframe storyboard that is triggered with the Loaded
event which works quite well)
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…