UWP - FadeIn Effekt auf das Hintergrundbild

Question

Ich brauche einen Einblendeffekt auf meinem Hintergrundbild. Während der Laufzeit kann die Bildquelle geändert werden, was mit der gesetzten Bindung wie erwartet funktioniert. Auf jeden Fall hat die entsprechende Animation keine visuellen Effekte. Im Moment sieht mein XAML wie folgt aus:

xmlns:Interactivity="using:Microsoft.Xaml.Interactivity" 
xmlns:Core="using:Microsoft.Xaml.Interactions.Core" 
xmlns:Media="using:Microsoft.Xaml.Interactions.Media" 

<Page.Content> 
    <Grid> 
     <Grid.Background> 
      <ImageBrush x:Name="image" ImageSource="{Binding Path=ImageSource,UpdateSourceTrigger=PropertyChanged}" Stretch="UniformToFill" > 
       <Interactivity:Interaction.Behaviors> 
        <Core:EventTriggerBehavior EventName="ImageOpened" > 
         <Media:ControlStoryboardAction ControlStoryboardOption="Play"> 
          <Media:ControlStoryboardAction.Storyboard> 
           <Storyboard> 
            <DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:1" Storyboard.TargetName="image"/> 
           </Storyboard> 
          </Media:ControlStoryboardAction.Storyboard> 
         </Media:ControlStoryboardAction> 
        </Core:EventTriggerBehavior> 
       </Interactivity:Interaction.Behaviors> 
      </ImageBrush> 
     </Grid.Background> 

Wenn ich statt:

   [...] 
      <Media:ControlStoryboardAction.Storyboard> 
           <Storyboard> 
            <FadeInThemeAnimation Storyboard.TargetName="Image" /> 
           </Storyboard> 
          </Media:ControlStoryboardAction.Storyboard> 

ich

System.Runtime.InteropServices.COMException: keine installierten Komponenten erkannt wurden.

TargetName Image kann nicht aufgelöst werden. unter Windows.UI.Xaml.Media.Animation.Storyboard.Begin() bei Microsoft.Xaml.Interactions.Media.ControlStoryboardAction.Execute (Objekt Absender, Objekt Parameter) bei Microsoft.Xaml.Interactivity.Interaction.ExecuteActions (Object Absender, ActionCollection-Aktionen, Objektparameter) bei Microsoft.Xaml.Interactions.Core.EventTriggerBehavior.OnEvent (Object sender, Objekt eventArgs)

Irgendwelche Ideen?

[Bearbeiten] Dank der Antwort von @SWilko, stelle ich fest, dass die Animation nur auf einem Bild funktioniert. Mein Code oben funktioniert, wenn ich den ImageBrush zu einem Bild ändere und ich es in das Raster (nicht Grid.Background) platziere.

Answer 1

Wäre es nicht einfacher sein, eine Image Steuerung zu verwenden und weitere Kontrollen oben nach Bedarf zB

<Grid x:Name="LayoutGrid"> 
    <Image x:Name="image" Stretch="UniformToFill" 
      Source="{Binding Path=ImageSource,UpdateSourceTrigger=PropertyChanged}" 
      Opacity="0" Visibility="Collapsed"> 
     <interactivity:Interaction.Behaviors> 
      <core:EventTriggerBehavior EventName="ImageOpened"> 
       <media:ControlStoryboardAction x:Name="sbAction" ControlStoryboardOption="Play"> 
        <media:ControlStoryboardAction.Storyboard> 
         <Storyboard x:Name="sb"> 
          <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                  Storyboard.TargetName="image"> 
           <DiscreteObjectKeyFrame KeyTime="00:00:00"> 
            <DiscreteObjectKeyFrame.Value> 
             <Visibility>Visible</Visibility> 
            </DiscreteObjectKeyFrame.Value> 
           </DiscreteObjectKeyFrame> 
          </ObjectAnimationUsingKeyFrames> 
          <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" 
           Storyboard.TargetName="image"> 
           <EasingDoubleKeyFrame KeyTime="0" Value="0"/> 
           <EasingDoubleKeyFrame KeyTime="0:0:3" Value="0.5"/> 
           <EasingDoubleKeyFrame KeyTime="0:0:5" Value="1"/> 
          </DoubleAnimationUsingKeyFrames> 
         </Storyboard> 
        </media:ControlStoryboardAction.Storyboard> 
       </media:ControlStoryboardAction> 
      </core:EventTriggerBehavior> 
     </interactivity:Interaction.Behaviors> 
    </Image>   
</Grid> 

EDIT

fügen Sie das Bild zu aktualisieren und die Animation von vorne anfangen. Ich habe Visibility Toggle-Animation zum Storyboard hinzugefügt und nannte die Storyboardsb

in Code nun hinter mir das Storyboard Completed-Ereignis verwendet habe, um das Bild zu ändern und die Animation neu starten. Sie können dies tun, wo es für Ihre App geeignet ist, um nur ein Beispiel zu zeigen. zB

sb.Completed += (sender, e) => 
{ 
     //this is a local image for me you would probably update your ImageSource property here 
     var newimg = new BitmapImage(new Uri("ms-appx:///Assets/rock.jpg")); 
     image.Source = newimg; 
     image.Opacity = 0; 
     image.Visibility = Visibility.Collpased; 

     sb.Begin(); 
};