WPF播放gif和序列帧动画

#本来是想用WPF程序播放带透明通道的视频比如，webm、mov文件，但是没有实现成功，（如果谁做过这样类型的程序，欢迎一起讨论学习），所以只能退而求其次使用GIF动画和序列帧动画实现我想要的效果#

#实现播放gif动画 代码如下：#

前端代码：

<Window x:Class="WPFPlayerGifAndSequenceFrameAnimation.PlayerGifWindow"
        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:WPFPlayerGifAndSequenceFrameAnimation"
        mc:Ignorable="d"
        Title="PlayerGifWindow" WindowStyle="None" Height="1080" Width="1920">
    <Grid>
        <Grid.Background>
            <ImageBrush ImageSource="/Images/bg.png"/>
        </Grid.Background>
        <Image x:Name="imgGifShow" Stretch="Fill" VerticalAlignment="Center" HorizontalAlignment="Center"/>
    </Grid>
</Window>
 

后端代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Security.Policy;
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.Shapes;

namespace WPFPlayerGifAndSequenceFrameAnimation
{
    /// <summary>
    /// PlayerGifWindow.xaml 的交互逻辑
    /// </summary>
    public partial class PlayerGifWindow : Window
    {
        private Storyboard board = null;

        public PlayerGifWindow()
        {
            InitializeComponent();
            this.AllowsTransparency = true;
       
            // 最大化窗口
            this.WindowState = WindowState.Maximized;
            this.KeyDown += new KeyEventHandler(Image_KeyDown);

            ShowGifByAnimate(@"pack://application:,,,/gif/1.gif");
        }
        /// <summary>
        /// 显示GIF动图
        /// </summary>
        private void ShowGifByAnimate(string filePath)
        {
            this.Dispatcher.Invoke(() =>
            {
                List<BitmapFrame> frameList = new List<BitmapFrame>();
                GifBitmapDecoder decoder = new GifBitmapDecoder(
                new Uri(filePath, UriKind.RelativeOrAbsolute),
                BitmapCreateOptions.PreservePixelFormat, BitmapCacheOption.Default);
                if (decoder != null && decoder.Frames != null)
                {
                    frameList.AddRange(decoder.Frames);
                    ObjectAnimationUsingKeyFrames objKeyAnimate = new ObjectAnimationUsingKeyFrames();
                    objKeyAnimate.Duration = new Duration(TimeSpan.FromSeconds(10));
                    foreach (var item in frameList)
                    {
                        DiscreteObjectKeyFrame k1_img1 = new DiscreteObjectKeyFrame(item);
                        objKeyAnimate.KeyFrames.Add(k1_img1);
                    }
                    imgGifShow.Source = frameList[0];

                    board = new Storyboard();
                    board.RepeatBehavior = RepeatBehavior.Forever;
                    board.FillBehavior = FillBehavior.HoldEnd;
                    board.Children.Add(objKeyAnimate);
                    Storyboard.SetTarget(objKeyAnimate, imgGifShow);
                    Storyboard.SetTargetProperty(objKeyAnimate, new PropertyPath("(Image.Source)"));
                    board.Begin();
                }
            });
        }
        /// <summary>
        /// ESC退出
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void Image_KeyDown(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Escape)
            {
                this.Close(); // 关闭当前窗口
                              //   System.Windows.Application.Current.Shutdown(); // 关闭整个应用程序
            }
        }

    }
}
 

#播放序列帧动画 代码如下：#

前端代码：

<Window x:Class="WPFPlayerGifAndSequenceFrameAnimation.MainWindow"
        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:WPFPlayerGifAndSequenceFrameAnimation"
        mc:Ignorable="d"
        Title="MainWindow" WindowStyle="None" Height="1080" Width="1920">
    <Grid>
        <Grid.Background>
            <ImageBrush ImageSource="/images/bg.png"/>
        </Grid.Background>
        <Rectangle Name="RectDis" Width="1920" Height="1080" Stretch="Fill"/>
    </Grid>
</Window>
 

后端代码：

using System;
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;

namespace WPFPlayerGifAndSequenceFrameAnimation
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.AllowsTransparency = true;
            // 最大化窗口
            this.WindowState = WindowState.Maximized;
            this.KeyDown += new KeyEventHandler(Image_KeyDown);
            LoadPics();
        }
        private void LoadPics()
        {
            try
            {
                Storyboard _storyboard = new Storyboard();
                for (int i = 0; i < 249; i++)
                {
                    ObjectAnimationUsingKeyFrames oauf = new ObjectAnimationUsingKeyFrames();
                    //ObjectAnimationUsingKeyFrames 可以对指定 Duration 内的一组 KeyFrames 中的 Object 属性值进行动画处理
                    BitmapImage bitmap = new BitmapImage();
                    bitmap.BeginInit();
                    bitmap.UriSource = new Uri("G:\\TestDemo\\img4\\图层 " + (i + 1) + ".png");
                    bitmap.CacheOption = BitmapCacheOption.Default;
                    bitmap.EndInit();

                    ImageBrush imgBrush = new ImageBrush(bitmap);
                    //读取图片文件
                    DiscreteObjectKeyFrame dokf = new DiscreteObjectKeyFrame();
                    //DiscreteObjectKeyFrame 通过使用离散内插，可以在前一个关键帧的 Object 值及其自己的 Value 之间进行动画处理。
                    dokf.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromMilliseconds(i * 30));
                    //KeyTime 获取或设置应到达关键帧的目标 Value 的时间
                    //这里每隔40毫秒设置一张图片，也就是每秒1000/40=25帧
                    dokf.Value = imgBrush;
                    oauf.KeyFrames.Add(dokf);
                    Storyboard.SetTargetProperty(oauf, new PropertyPath("(Rectangle.Fill)"));
                    //把动画应用到窗体的Rectangle中
                    Storyboard.SetTarget(oauf, RectDis);
                    //RectDis是Rectangle的名称
                    _storyboard.Children.Add(oauf);
                    //把ObjectAnimationUsingKeyFrames动画添加到Storyboard中
                }
                _storyboard.RepeatBehavior = RepeatBehavior.Forever;

                _storyboard.Begin();
            }
            catch (Exception ex)
            {
                Console.WriteLine(ex.ToString());
            }
        }

        /// <summary>
        /// ESC退出
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void Image_KeyDown(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Escape)
            {
                this.Close(); // 关闭当前窗口
                              //   System.Windows.Application.Current.Shutdown(); // 关闭整个应用程序
            }
        }
    }
}
 

参考文献：WPF加载GIF的五种方式（Storyboard / WpfAnimatedGif / ImageAnimator / PictureBox / MediaElement） - WebEnh - 博客园 (cnblogs.com)

 

WPF中播放帧序列图_wpf 实现png序列帧-CSDN博客