VisualStateManagerで複数のUIElementsをターゲットに設定するにはどうすればよいですか？

Question

私は楕円の不透明度を変更するには、このような何か場合：

<VisualStateManager.VisualStateGroups> 
    <VisualStateGroup x:Name="VisualStateGroup"> 
    <VisualStateGroup.Transitions> 
     <VisualTransition GeneratedDuration="0:0:1"> 
     <VisualTransition.GeneratedEasingFunction> 
      <CircleEase EasingMode="EaseIn"/> 
     </VisualTransition.GeneratedEasingFunction> 
     </VisualTransition> 
    </VisualStateGroup.Transitions> 
    <VisualState x:Name="Lit"/> 
    <VisualState x:Name="Unlit"> 
     <Storyboard> 
     <DoubleAnimation Duration="0" To="0.225" 
         Storyboard.TargetProperty="(UIElement.Opacity)" 
         Storyboard.TargetName="ellipse" d:IsOptimized="True"/> 
     </Storyboard> 
    </VisualState> 
    </VisualStateGroup> 
</VisualStateManager.VisualStateGroups> 

<Ellipse x:Name="ellipse" Width="100" Height="100" Fill="Azure"/> 


VisualStateManager.GoToState(this, "Unlit", true); 

をそれだけで正常に動作します。

しかし、私は楕円形をしていて、それらに同じStoryBoardを適用したいとしましょう。どうすればいいですか？

<Storyboard> 
    <DoubleAnimation Duration="0" To="0.225" 
        Storyboard.TargetProperty="(UIElement.Opacity)" 
        Storyboard.TargetName="ellipse1" 
         d:IsOptimized="True"/> 
    <DoubleAnimation Duration="0" To="0.225" 
        Storyboard.TargetProperty="(UIElement.Opacity)" 
        Storyboard.TargetName="ellipse2" 
         d:IsOptimized="True"/> 
    </Storyboard> 

しかし、私は楕円の動的な数を持っている場合、これはやや面倒です：

<Ellipse x:Name="ellipse1" Width="100" Height="100" Fill="Azure"/> 
<Ellipse x:Name="ellipse2" Width="100" Height="100" Fill="Azure"/> 
<Ellipse x:Name="ellipse3" Width="100" Height="100" Fill="Azure"/> 

一つの方法は、同じStoryBoardに複数のDoubleAnimation Sを定義することです。
これ以上エレガントな方法はありますか？

Answer 1

私はエレガントわからないんだけど、一つの方法は、中間の性質をアニメーション化すること、およびそれに実際のターゲットのプロパティをバインドすることができます：使用している場合（

<Grid x:Name="animationTarget" Visibility="Collapsed" /> 
<Ellipse x:Name="ellipse1" Width="100" Height="100" Fill="Azure" 
    Opacity={Binding Opacity, ElementName=animationTarget}/> 
<Ellipse x:Name="ellipse2" Width="100" Height="100" Fill="Azure" 
    Opacity={Binding Opacity, ElementName=animationTarget}/> 

と

<Storyboard> 
    <DoubleAnimation Duration="0" To="0.225" 
        Storyboard.TargetProperty="(UIElement.Opacity)" 
        Storyboard.TargetName="animationTarget" /> 
</Storyboard> 

中間バインディングターゲットとしての見えない余分な要素は、代わりにあなたの楕円が入っているコンテナの何らかの付属プロパティにある可能性があるとは思えません。