Android挂逼修练之行--微信设置朋友圈封面视频插件开发详解

一、背景介绍

最近在刷抖音的时候看见别人发了一个可以把微信朋友圈封面图设置成视频的功能,比较好奇就自己研究了一下,最开始的时候第一灵感就是是不是微信设置封面图的接口有后门,就是微信为了后续功能扩展,服务端是支持上传视频的,但是客户端是没有做这个功能开发的,通过这么想之后就立马去实践查看之后发现并没有这个开发后门,那到底是怎么实现的呢?

二、开发思路

后续苦想之后可能觉得是本地生成一个假的视频,因为之前开发过一个应用就是可以生成假的朋友圈截图,转账截图啥的,为了好炫耀,所以其他这个功能并不会去真的改变微信接口数据,只是本地生成一个假的数据,那么这里我们也是可以做到一个假的朋友圈封面是个视频的截图了,不过这里还有一些细节和思路需要整理一下:首先我们这一次需要设置的或者是改变的肯定是朋友圈封面那一块:

3d9008217c1a5cfac6fbbb9f6ae6e6ec.jpeg

也就是上面图片的黄色背景图,而其他区域我们需要自己布局出来,然后把View生成一张图片加在封面视频中,当然这里的视频也是需要处理,因为可能用户选择的视频是一个横屏或者其他大小的视频,为了不让视频拉伸和压缩效果,所以这里需要对视频进行缩放裁剪操作,因为后面需要输出全屏视频,所以这里的视频最后还要做一次全屏大小的拉伸操作:

第一步:用户选择一个视频,展示在区域中,这时候我们可以不着急进行裁剪,可能展示的是个压缩的样式:

d84292520ff05e32d251a1d2fa471a83.gif

这个就是选择视频之后的样式,我们直接把当前播放视频的区域设置成指定高度,这样选择视频时候会被压缩展示的,但是这个不是最终的样式。

第二步:需要把微信朋友圈的布局弄出来,这个非常简单,早期做应用的时候一些公司资源匮乏,所以就去抄别人家功能,不仅抄功能还可能抄UI,这时候就比较简单了,有的人会觉得UI布局为啥不直接反编译查看对应的xml文件呢?其实这个方法是可以的,但是对于微信朋友圈这个复杂的页面这样去操作就非常耗时,而自己去操作其实很简单,这里需要借助一个很好用的工具:MarkMan,这个工具是跨平台的,因为他是运行在Adobe Air的,所以需要先去安装这个东西,然后直接打开MarkMan即可,打开之后把你想实现xml的图片拖进来:

9c84f072e8c07414600bb0320d9598a4.jpeg

就是这个样子了:看到这里把高度宽度控件都标注出来了,以及色值都可以弄出来,不过这里的字体大小可能有点难搞,但是这个可以大致猜想一下,只要不差别那么大就好了。这样我们就开始写布局xml了,这里可以看到之前有一些工具可以直接把一张图片生成对应的xml布局,这样就省去了研发在开发过程中进行布局操作的成本,但是这个工具最后也是不了了之了,我们期望的人工智能是输入一张设计师约定好格式的图片,产生出是一个我们期望的布局xml文件。

第三步:有了第二步的布局文件就好办了,因为这里布局没什么好说的,都是非常集基础的功能,后续感兴趣的同学可以去编码美丽小密圈查看源码即可,布局xml最终要生成一张图片,就是这样的样式:

d0f31a0f67a47de3f5f0eb0564e2bcba.jpeg

看到这里布局完成之后生成的一张png图片,关于如何把View生成一张图片网上都有对应的代码非常简单操作,具体查看我项目的源码即可,这里不多说了。

第四步:有了朋友圈的图片之后接下来我们就要开始做视频的工作了,不管选择的视频是什么样式的大小,我们都这么做,这里主要是有三部分:

1》把视频先按照等比例缩放到屏幕宽度(全屏宽度)的视频

2》按照封面视频的控件高度从左上角开始裁剪,当然可以从其他位置开始裁剪,代码决定即可

3》按照屏幕高度把视频底部填充黑色,最终的视频必须是全屏样式(高度和宽度是屏幕的高度和宽度)

dfe4fa433addc38a5f637a8c7bd4267d.jpeg

 看到这张图其实还是比较好理解的,这样输出的视频其实是被裁剪过的,但是不会有拉伸效果,这里对视频操作肯定还是用到了ffmpeg命令:

第一、高度不动,等比率缩放到宽度是new_width的视频,然后从x,y点裁剪视频尺寸为width,height

ffmpeg -i input.mp4 -vf "scale=new_width:-1,crop=width:height:x:y" output.mp4

第二、输出最终width,height尺寸的视频,空白处用黑色填充

ffmpeg -i input.mp4 -vf "pad=width:height:x:y:black" output.mp4

当然这两条命令可以合并成一条:

ffmpeg -i input.mp4 -vf "scale=new_width:-1,crop=width:height:x:y,pad=width:height:x:y:black" output.mp4

所以这里最终只要一条命令就可以搞定,把输入的视频输出成我们最终想要的样式:

60034af4bb9cba8c0b148325e18d53db.gif     b8d37509ec4a3ed8d303095e1561fe40.gif

看到原始视频和最终裁剪之后的视频的样式。

第五步:最后我们只要把第四步的视频结合第三步的图片合并到一起即可,这个也是依赖于ffmpeg的一个命令,其实就是相当于加个图片水印视频而已:

ffmpeg -i input.mp4 -i logo.png -filter_complex 'overlay=0:0' output.mp4

因为第三步生成的图片是全屏的,第四步的视频也是全屏的,所以这里的水印添加坐标直接是左上角也就是(0:0)即可,所以最终生成的视频样式:

34bacefc1721fbd0c517473cafe6d7b7.gif

这样我们就把整个操作都弄完了,其实这时候我们可以把这个视频放到社交平台上告知朋友圈可以设置视频封面了,看着很黑科技,无形中会给你自己涨粉。

三、代码结构

虽然这个工具非常简单,但是为了代码复用性好,还是需要整理代码结构:

153a4709d08da97e63204dcb801571b0.jpeg

这里我们截图功能,视频操作功能,图片加载功能,弹框提示功能最好分开比较明显,核心功能就是视频合成操作:

4a40a4aa580138920fd597d08c052f2e.jpeg

73081efe7d1c6af98d2389fdf958d065.jpeg

这里需要把中间产物生成到一个目录下:

84be5f19216facaf45fe5e267910b214.jpeg

四、拓展功能

让我们这里还有很多额外的操作,比如封面中为了增加真实性,用户昵称头像,提醒消息,第一条朋友圈状态的消息,头像内容等都是可以支持动态设置的。具体逻辑可以去编码美丽小密圈寻求源码即可,这里就不在详细解读了,因为这些操作后续同学可以参考代码进行自己diy操作即可。

演示视频

严重说明

本文的目的只有一个就是学习逆向分析技巧,如果有人利用本文技术进行非法操作带来的后果都是操作者自己承担,和本文以及本文作者没有任何关系,本文涉及到的代码项目可以去编码美丽小密圈自取,长按下方二维码加入小密圈一起学习探讨技术

fa7f4ad8be11437914c85b3fb0a6db09.png

五、总结

有时候我们在看到一些好玩的黑科技我们不是一眼带过,而是多考虑一下,因为这些多考虑可以给我们带来不一样的学习道路,比如这里我们通过本文学习到了视频的操作更多技巧,对于我们后续操作视频更加方便快捷,当然弄完了我们还可以

手机查看文章不方便,可以网页看

http://www.520monkey.com


《Android应用安全防护和逆向分析》 

 点击查看图书详情

长按下面👇👇二维码,关注编码美丽

246354d778a19f844973aa8f0c98033f.png

长按下面👇👇二维码,加我好友吧!

5d5d542b96f455dc5e9ab57c7445e07e.jpeg

猛戳下方"阅读原文",开启安全逆向大门!

fb8d2709f9cc0dba2c7c0dccf89cc3a7.gif

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值