Bảng phân cảnh được áp dụng cho nhiều thành phần

Question

Tôi có hai hình chữ nhật trong ứng dụng WPF của mình. Tôi muốn phát một hình động khi tôi nhấp vào một phần tử. Hoạt ảnh chỉ nên được áp dụng cho hình chữ nhật được nhấp. Với đoạn mã bên dưới, khi tôi nhấp vào một hình chữ nhật, tất cả các hình sẽ được làm động.

Tôi nên làm gì ??

Window.Resources> 
    <ResourceDictionary> 

      <LinearGradientBrush x:Key="ExecutionInitialization" EndPoint="0.5,1" StartPoint="0.5,0"> 
       <GradientStop Color="#FFC0FBBA"/> 
       <GradientStop Color="#FF0FA000" Offset="1"/> 
       <GradientStop Color="#FF0FA000"/> 
      </LinearGradientBrush> 

     <Storyboard x:Key="OnMouseLeftButtonDown1" RepeatBehavior="Forever"> 
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Offset)" Storyboard.TargetName="rec1"> 
       <SplineDoubleKeyFrame KeyTime="0" Value="0.17"/> 
       <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="0.32"/> 
       <SplineDoubleKeyFrame KeyTime="0:0:0.8" Value="0.5"/> 
       <SplineDoubleKeyFrame KeyTime="0:0:1" Value="0.56"/> 
       <SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="1"/> 
      </DoubleAnimationUsingKeyFrames> 
     </Storyboard> 
    </ResourceDictionary> 


</Window.Resources> 

<Grid> 
    <Rectangle MouseDown="rec1_MouseDown" Name="rec1" Fill="{StaticResource ExecutionInitialization}" HorizontalAlignment="Left" Height="85.075" Margin="24.358,27.731,0,0" Stroke="Red" VerticalAlignment="Top" Width="156.717"/> 

    <Rectangle MouseDown="rec2_MouseDown" Name="rec2" Fill="{StaticResource ExecutionInitialization}" HorizontalAlignment="Left" Height="113.433" Margin="246.746,141.164,0,0" Stroke="Black" VerticalAlignment="Center" Width="211.941"/> 

</Grid> 

và C#

public MainWindow() 
{ 
    InitializeComponent(); 
    animation = TryFindResource("OnMouseLeftButtonDown1") as Storyboard; 
} 

private void rec1_MouseDown(object sender, MouseButtonEventArgs e) 
{ 
    animation.Begin(); 
} 

private void rec2_MouseDown(object sender, MouseButtonEventArgs e) 
{ 

} 

Answer 1

Chỉ cần đặt x:Shared thuộc tính để false về tài nguyên LinearGradientBrush của bạn. Sau đó, mỗi thuộc tính Fill của Rectangle sẽ có bản sao riêng của Brush được gán.

<LinearGradientBrush x:Key="ExecutionInitialization" x:Shared="false" 
        EndPoint="0.5,1" StartPoint="0.5,0"> 
    ... 
</LinearGradientBrush> 

Để chạy các hình ảnh động độc lập trên hình chữ nhật khác nhau, bạn cũng sẽ phải loại bỏ các Storyboard.TargetName, và bắt đầu Storybord với sự kiểm soát mục tiêu như tham số:

private void Rectangle_MouseDown(object sender, MouseButtonEventArgs e) 
{ 
    var storyboard = TryFindResource("OnMouseLeftButtonDown1") as Storyboard; 
    storyboard.Begin((FrameworkElement)sender); 
} 

Bạn có thể sau đó cũng sử dụng cùng một trình xử lý sự kiện cho tất cả các hình chữ nhật như vậy:

<Rectangle x:Name="rec1" MouseDown="Rectangle_MouseDown" .../> 
<Rectangle x:Name="rec2" MouseDown="Rectangle_MouseDown" .../>