wpf GifBitmapDecoder 解析 gif 格式

在网上有很多图片都是gif,那么如何在 wpf 解析 gif? 本文告诉大家如何使用 GifBitmapDecoder 把gif分开为一张一张,获得他的信息。

如果需要把一个 gif 分开,使用的代码很简单

            var file = "E:\\林德熙\\测试文件\\2017年9月1日 10.gif";
            var stream = new FileStream(file, FileMode.Open);
            var decoder = new GifBitmapDecoder(stream, BitmapCreateOptions.PreservePixelFormat, BitmapCacheOption.Default);

从 decoder 就可以获得每个图片,例如写一个按钮,按一下就切换一个图片。

      private int n = 0;

        private void Button_OnClick(object sender, RoutedEventArgs e)
        {
            var t = decoder.Frames[n];
            
            Image.Source = t;
            n++;
            if (n >= decoder.Frames.Count)
            {
                n = 0;
            }
        }

按钮点击如上面代码,可以看到 decoder 把 gif 分开很简单,但是如何获得一帧的时间。如果在 wpf 获得 gif 图片间隔,就需要一些特殊方法。

先创建一个类 用于获得 gif 的信息,需要知道,每个gif的里面的图片都有信息。

        class FrameInfo
        {
            public TimeSpan Delay { get; set; }
            public FrameDisposalMethod DisposalMethod { get; set; }
            public double Width { get; set; }
            public double Height { get; set; }
            public double Left { get; set; }
            public double Top { get; set; }

            public Rect Rect
            {
                get { return new Rect(Left, Top, Width, Height); }
            }
        }

其中 Delay 就是两个图片播放的时间,FrameDisposalMethod表示两张图片是如何播放,完全替换前一张还是在前一张基础继续显示。

获得 gif 的信息需要使用 GetQuery ,这个方法不好用,于是使用下面代码把他转类型

        private static T? GetQueryOrNull<T>(this BitmapMetadata metadata, string query)
            where T : struct
        {
            if (metadata.ContainsQuery(query))
            {
                object value = metadata.GetQuery(query);
                if (value != null)
                    return (T) value;
            }
            return null;
        }

可以看到 decoder 的每个图片的 MetadataImageMetadata ,而且wr也没说它里面有哪些数据。

实际可以使用BitmapMetadata获得每个图片信息,因为Metadata实际是BitmapMetadata,通过/grctlext/Delay可以获得两个图片的时间,/grctlext/Disposal可以获得两个图片是如何显示,/imgdesc/Width 可以获得宽度。于是使用下面函数可以获得图片信息

        public static FrameInfo GetFrameInfo(BitmapFrame frame)
        {
            var frameInfo = new FrameInfo
            {
                Delay = TimeSpan.FromMilliseconds(100),
                DisposalMethod = FrameDisposalMethod.Replace,
                Width = frame.PixelWidth,
                Height = frame.PixelHeight,
                Left = 0,
                Top = 0
            };

            BitmapMetadata metadata;
            try
            {
                metadata = frame.Metadata as BitmapMetadata;
                if (metadata != null)
                {
                    const string delayQuery = "/grctlext/Delay";
                    const string disposalQuery = "/grctlext/Disposal";
                    const string widthQuery = "/imgdesc/Width";
                    const string heightQuery = "/imgdesc/Height";
                    const string leftQuery = "/imgdesc/Left";
                    const string topQuery = "/imgdesc/Top";

                    var delay = metadata.GetQueryOrNull<ushort>(delayQuery);
                    if (delay.HasValue)
                        frameInfo.Delay = TimeSpan.FromMilliseconds(10 * delay.Value);

                    var disposal = metadata.GetQueryOrNull<byte>(disposalQuery);
                    if (disposal.HasValue)
                        frameInfo.DisposalMethod = (FrameDisposalMethod) disposal.Value;

                    var width = metadata.GetQueryOrNull<ushort>(widthQuery);
                    if (width.HasValue)
                        frameInfo.Width = width.Value;

                    var height = metadata.GetQueryOrNull<ushort>(heightQuery);
                    if (height.HasValue)
                        frameInfo.Height = height.Value;

                    var left = metadata.GetQueryOrNull<ushort>(leftQuery);
                    if (left.HasValue)
                        frameInfo.Left = left.Value;

                    var top = metadata.GetQueryOrNull<ushort>(topQuery);
                    if (top.HasValue)
                        frameInfo.Top = top.Value;
                }
            }
            catch (NotSupportedException)
            {
            }

            return frameInfo;
        }

这个方法实际上性能不好,如果需要一个可以用的gif解析,请看我的博客WPF 播放 gif

参见: http://www.thomaslevesque.com/2011/03/27/wpf-display-an-animated-gif-image/

http://stackoverflow.com/questions/210922/how-do-i-get-an-animated-gif-to-work-in-wpf


本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端小作坊

React diff 算法

React是facebook开发的一个用于UI开发的基础库。它自底向上重新设计了,为了实现高性能。在这篇文章中将展示React的diff算法是如何来优化你的ap...

1513
来自专栏向治洪

React实现动画效果

流畅、有意义的动画对于移动应用用户体验来说是非常必要的。和React Native的其他部分一样,动画API也还在积极开发中,不过我们已经可以联合使用两个互补的...

4328
来自专栏王磊的博客

fabric.js和高级画板

3063
来自专栏游戏杂谈

cocos2d-x中CCLabelAtlas的小图片拼接

美术在设计UI时,很多界面可能使用了数字图片来展示一些效果,比如CD或者 x1/x2等,一般她们都会切成很多单张小的图片,类似这样

1432
来自专栏贺贺的前端工程师之路

Angular2 之 Animations

691
来自专栏林德熙的博客

win10 uwp 简单MasterDetail UWP 导航List点击后退按钮页面更改大小修改显示修改我代码源码左右的列表和内容的相互操作

本文主要讲实现一个简单的界面,可以在窗口比较大显示列表和内容,窗口比较小时候显示列表或内容。也就是在窗口比较小的时候,点击列表会显示内容,点击返回会显示列表。

970
来自专栏每日一篇技术文章

weex-18-loading组件

重点讲解一个background-image:linear-gradient(to top,#F0AD4E,#F8C433);

2811
来自专栏hightopo

原 基于HTML5 Canvas 点击添加

1524
来自专栏瓜大三哥

matlab GUI基础2

GUIDE编程开发 matlab可视化姐买你的设计,一般有两种方法,一是直接通过编辑M脚本文件产生GUI,二是通过MATLAB图形用户界面开发环境GUIDE来建...

2587
来自专栏葡萄城控件技术团队

Spread for Windows Forms快速入门(3)---行列操作

开发人员可以定义用户与行和列的交互,如是否可以更改行或列的大小、是否可以移动行或列、冻结指定的行或列、在行或列中查找数据等。 更改行或列的大小 你可以允许用户重...

2826

扫码关注云+社区

领取腾讯云代金券