淡入新影像同時淡出舊影像WPF

我試圖弄清楚如何讓新影像淡入并同時讓舊影像淡出。我最初考慮使用兩個雙重影片，一個用于淡入，另一個用于淡出，在完成時相互觸發，但這對我不起作用，因為我需要一個影像淡入而另一個影像淡出而我不不知道該怎么做。

我試圖做的事情：

XAML：

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Animation"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">

    <Grid x:Name="gridTest">
        <StackPanel x:Name="stkHeaderBar" Grid.Row="0"
         Orientation="Horizontal" FlowDirection="RightToLeft">
            <Button x:Name="btnChangeImg" Content="Change Image"
             Click="btnChangeImage_Click"/>
            <Image x:Name="img"></Image>
        </StackPanel>
    </Grid>

后面的代碼：

using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Windows.Threading;

namespace Animation
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
  
        }
        private void btnChangeImage_Click(object sender, RoutedEventArgs e)
        {

            DoubleAnimation fadeIn = new DoubleAnimation
            {
                From = 0,
                To = 1,
                Duration = TimeSpan.FromSeconds(2)
            };

            DoubleAnimation fadeOut = new DoubleAnimation
            {
                From = 1,
                Duration = TimeSpan.FromSeconds(2),
            };

            fadeOut.Completed  = (o, e) =>
            {

                img.Source = new BitmapImage(new Uri(@"C:\images.jpg"));
                img.BeginAnimation(OpacityProperty, fadeIn);
            };


            fadeIn.Completed  = (o, e) =>
            {

                img.Source = new BitmapImage(new Uri(@"C:\images.jpg"));
                img.BeginAnimation(OpacityProperty, fadeOut);
            };



            img.Source = new BitmapImage(new Uri(@"C:\images1.jpg"));
            img.BeginAnimation(OpacityProperty, fadeIn);
        }
    }
}

uj5u.com熱心網友回復：

你過于復雜了，只需將兩個影像放在一個網格中，以便它們重疊：

<Grid>
    <Image x:Name="img1" Stretch="UniformToFill"></Image>
    <Image x:Name="img2" Stretch="UniformToFill"></Image>
</Grid>

第一個影像的不透明度可以一直保持在 1.0，然后您只需為第二個影像設定影片以使其淡入：

    private void btnChangeImage_Click(object sender, RoutedEventArgs e)
    {
        DoubleAnimation fadeIn = new DoubleAnimation
        {
            From = 0,
            To = 1,
            Duration = TimeSpan.FromSeconds(2)
        };

        img1.Source = new BitmapImage(new Uri(@"C:\image1.jpg"));
        img2.Source = new BitmapImage(new Uri(@"C:\image2.jpg"));
        img2.BeginAnimation(OpacityProperty, fadeIn);
    }

如果您想要徹底，那么您可以在影片完成時使用您的 fadeIn.Completed 處理程式來洗掉 img1，但我通常不會擔心這一點，除非它是一個資源關鍵型應用程式。

標籤：C＃ wpf

上一篇：為什么PropertyChangedCallback方法不從DependencyPropertyOverrideMetadata執行？

下一篇：如何使用windows訪問應用程式并在uwp中關閉它們