Android动效实现——底部向上弹出滑动式弹幕

本文探讨了如何在Android应用中实现热评列表的动画效果,即评论从屏幕底部向上弹出并替换旧评论的过程。作者尝试使用弹幕库但最终选择通过ViewGroup和LayoutTransition来实现添加和删除View时的动画,解决了同步执行动画的问题。

 最近新需求有一个热评列表需要做成轮流从屏幕底部向上弹出的动画效果,看了效果图第一时间就想到了弹幕实现,但是思考一番后又否定了这个想法,首先这个热评列表不像弹幕需要实时获取播放,第二屏幕上展示的评论条数有限,固定最多就几条,再有新的弹出就把最上面一条消失掉,不想弹幕似的满屏都是,第三就是我看了B站的开源弹幕库,并不支持竖向的弹幕播放,如果要通过弹幕的方式实现这个需求的话,还需要自己对这个库进行扩展,有点舍近求远的意思。

思前想后,我想起了ViewGroup可以设置添加和删除内部View时的动画,那么它是不是可以满足我对功能的所有需求呢?于是网上百度了一下,果然有用这种方式做类似效果的,比如这篇Android UI:上下滚动的评论弹幕

他人实现效果​

通过对ViewGroup设置LayoutTransition来实现控制View添加和删除时的动画效果,界面固定显示四条评论,整个评论的轮播都是复用四个TextView,当显示超过四条评论时删除第一条显示的评论。但是我发现它这个Demo只有在添加View的时候执行了提前设置的动画,删除的时候并没有执行。总之先Copy下来跑一下看看吧(复制粘贴Levi能力满级),不跑不知道,一跑吓一跳,连添加View时的动画都不能正常执行,当添加第五个View时(也就是第五条评论,复用的第一条评论内容),新增的VIew是直接显示出来,并没有执行动画,在这之前的四条都是可以正常执行的。

我开始怀疑是不是因为在新增之前执行了删除操作所以出了问题,然后我就把删除的代码注掉又跑了一遍,果然没问题了,于是我就大胆猜测ViewGroup不能同时执行添加和删除的动画,为了验证我的猜想,我又去百度了(百度能力满分),找了一圈发现有一篇博客也是这个问题,并且和我推断出了相同的结论,因为当时也没有收藏书签,也懒得找了,就不放链接了。

除了我遇到的问题,在百度的过程中发现LayoutTransition挺多坑的,具体可以看看启舰大神的这篇博客自定义控件三部曲之动画篇(十二)——animateLayoutChanges与LayoutTransition

解决办法

既然不能同时执行添加和删除的动画,那么我可以监听添加的动画,等它执行完成后再进行删除操作,但是这样一来,添加和删除的动画就不能同步执行了,这样效果就会大打折扣,怎么办呢,曲线救国,再添加动画开始的时候对对要删除的VIew执行一个透明度变化的动画,等添加动画结束后被删除的VIew也就变透明了,这时再进行一个删除的操作,就可以神不知鬼不觉的实现我们要的效果了。注意,这里删除时也会有删除的动画执行,所以我们需要对删除的动画进行一个处理,以防出现错误的效果。

上代码

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值