我来告诉你,那些博客中的gif动态图是怎么弄的?

大家都知道,图片比单纯的文字给人的视觉冲击力更大,表达的内容也更直观易懂,经常在博客上看到动态的gif图,那这些gif动态图是怎么制作的呢,特别是Android移动开发者,写了一个demo,写博客时,想要把这个demo的实体画面展示给大家看,可是demo运行在手机上,怎么办呢,难道靠截屏显示静态图片吗?显然不是的,接下来我就教大家怎么把手机上运行的demo制作成gif图在博客中显示。

一、整体思路:

先用Android Studio进行屏幕录制,制作出视频,再用gifcam软件制作出gif动态图。

二、利用Android Studio进行屏幕录制

首先打开AS,连接上手机,打开你要录制的程序或者视频

打开ASandroid monitor面版


点击箭头所示的图标会弹出如下界面


传输速率越大,制作的视频也越大,我做了一个小测试,相同的16S的视频,如果传输速率为2,制作的视频是700kb+,如果是4的话,视频的大小一下就飙升到2Mb+了,不过这不影响我们后面制作gif的大小,所以一切默认就好。点击start Recording,此时跳出如下界面


说明正在录制,进度条会提示你已经录制了多少秒。最多录制三分钟,此时如果你要操作程序进行演示操作就可以开始了。操作完成或录制完成,点击stop Recording

选择文件夹存储,点击ok跳出如下界面说明录制完成了

三、利用gifcam软件制作出gif动态图

打开gifcam软件,可以看到,软件主体是透明的,表示录制的区域,相当于摄像头,处于这个区域中的东西,将被制作成gif;右侧是用来设置一些参数的,如图,点击Rec右侧的小箭头,fps是我们用这个软件要掌握的唯一一个知识点,fps代表每秒播放多少帧画面,值越大画面越流畅,当然,代价就是最终的gif图的大小也越大,而博客中的图片大小都有上限规定,所以我们在制作gif图的时候,要选取合适的fps值。点击图中的Customization,可以设置自己想要的fps值。

然后打开之前用Android Studio录制的视频,并把gifcam中间的透明区域通过拉伸对准想要制作的画面。

点击Rec按钮开始录制,再次点击停止录制,然后点击Save按钮保存,gif图制作完成,在保存的位置打开查看:

好了,从手机录屏到最终的gif动态图的制作,大家肯定学会了,赶紧去写个博客弄张gif动态图过过瘾吧。

猜你喜欢

转载自blog.csdn.net/u012604745/article/details/73468613
今日推荐