RecyclerView 加动画的坑

2019-05-21 11:46:05


参考地址 RecyclerView 加动画的坑


有个需求是在recyclerView上的第一个item加呼吸动画,作为一个动画小白,写个呼吸动画就已经很不容易了,呼吸和心跳很像吧,上来我就咔写了个心跳,哈哈哈,才改成了呼吸。
然后加到recyclerView上,我是在adapter上加的。Adapter的holder复用相信大家也都很熟悉了,这个在绘制效率的提高上很重要,也很容易发现一个问题,就是内容混乱的复用。所以常见的处理就是对view加上tag来多次判断,对于visibility之类的设置一定是if...else的写法,光有if是不可以的。
比方说

if (course.isReview()) {
    setVideoBtn(holder, true, stateRes[1], false);
} else {
    setVideoBtn(holder, true, stateResOver, false);
}

然后对于动画,你会发现if else还是不行,因为

holder.getRootView().clearAnimation();

似乎根本不会把我的动画给去掉。
比方说:先定义一个

mBreathAnimator = makeBreathAnimator();
    if (pos == 0) {
        holder.getContainerView().setBackgroundResource(R.drawable.bg_ips_detail_item_breath_shadow);
        holder.getContentBg().setBackgroundColor(mContext.getResources().getColor(android.R.color.transparent));//        final View holderCopy = holder.getRootView();        if (ips.isShouldBreath()) {//            mBreathAnimator.setTarget(holderCopy);
            mBreathAnimator.setTarget(holder.getRootView());
            mBreathAnimator.start();
            isBreathAnimating = true;
        }
    } else {
        Drawable up = ContextCompat.getDrawable(mContext, R.drawable.bg_ips_detail_item);
        Drawable drawableUp= DrawableCompat.wrap(up);
        DrawableCompat.setTint(drawableUp, colors[pos%colors.length]);
        holder.getContentBg().setImageDrawable(drawableUp);
        holder.getRootView().clearAnimation();//        if (mBreathAnimator!=null) {//            mBreathAnimator.setTarget(holder.getRootView());//            LogUtils.d("IPS","pos:"+pos+"-----set end");//            mBreathAnimator.cancel();//            mBreathAnimator.end();//        }
    }

其中那些注释掉的都是我尝试的解决方法,各种不好使。为什么呢,因为这个问题的根本是holder的复用,只要holder pos等于0的动画没有被停止掉,那么它就不会停止。最直观的方法是打log看一眼。

@Overridepublic void onBindViewHolder(ViewHolder holder, int pos) {
    LogUtils.d("onBindViewHolder: 验证是否重用了");
    LogUtils.d( "onBindViewHolder: 重用了"+holder.getRootView().getTag());
    LogUtils.d("onBindViewHolder: 放到了"+mDataSet.get(pos));
    IPSDetailBean.QuestionsBean ips = mDataSet.get(pos);
    ...

没有重用的pos0,tag是null。

08-08 15:27:19.269 D/DeatilAdapter: onBindViewHolder: 验证是否重用了
08-08 15:27:19.270 D/DeatilAdapter: onBindViewHolder: 重用了null
08-08 15:27:19.270 D/DeatilAdapter: onBindViewHolder: 放到了QuestionsBean{id=74, gain_star=0}

重用的pos0,tag是0。

08-08 15:23:06.635 D/DeatilAdapter:  onBindViewHolder: 验证是否重用了
08-08 15:23:06.635 D/DeatilAdapter:  onBindViewHolder: 重用了0
08-08 15:23:06.639 D/DeatilAdapter:  onBindViewHolder: 放到了QuestionsBean{id=57, gain_star=0}

这就是原因,所以我能想到的就是从原因复用上解决了。解决方案如下👇:

    @Override
    public void onViewRecycled(ViewHolder holder) {        super.onViewRecycled(holder);        int pos = (int) holder.getRootView().getTag();
        LogUtils.d("onViewRecycled:"+holder.getRootView().getTag());        if(isBreathAnimating && pos == 0) {
            mBreathAnimator.end();
            LogUtils.d("clearAnimation:");
            holder.getRootView().clearAnimation();
        }
    }

至此,这个recyclerview动画算是告一段落了。
周五提测,找不到解决方案那叫一个烦躁,以为解决不了了。休息了一个周末,倒是让我找到解决方案了,哈哈。

              


  • 2020-04-21 15:13:15

    redis 简单使用

    Redis和Memcached类似,也属于k-v数据存储 Redis官网 https://redis.io支持更多value类型,除了和string外,还支持hash、lists(链表)、sets(集合)和sorted sets(有序集合) Redis是可以把数据存储在磁盘上的并且使用了两种文件格式:全量数据(RDB)和增量请求(aof)。一般叫做redis持久化 全量数据格式是把内存中的数据写入磁盘,便于下次读取文件进行加载。

  • 2020-04-21 15:14:20

    SpringBoot + Redis:基本配置及使用

    # Redis数据库索引(默认为0) spring.redis.database=0# Redis服务器地址 spring.redis.host=127.0.0.1# Redis服务器连接端口 spring.redis.port=6379# Redis服务器连接密码(默认为空) spring.redis.password=# 连接池最大连接数(使用负值表示没有限制) spring.redis.jedis.pool.max-active=20# 连接池最大阻塞等待时间(使用负值表示没有限制) spring.redis.jedis.pool.max-wait=-1# 连接池中的最大空闲连接 spring.redis.jedis.pool.max-idle=10# 连接池中的最小空闲连接 spring.redis.jedis.pool.min-idle=0# 连接超时时间(毫秒) spring.redis.timeout=1000

  • 2020-04-22 10:49:10

    css按钮特效大全

    打开这个连接,你会发现很多按钮动画脚本,基本这些动画就够大家用的了。

  • 2020-04-27 09:26:49

    transform与transition区别与详解

    对元素进行移动、缩放、转动、拉长或拉伸。 方法:translate(): 元素从其当前位置移动,根据给定的 left(x 坐标) 和 top(y 坐标) 位置参数 有两个div,它们的css样式如下,transition:过渡 元素从一种样式逐渐改变为另一种的效果 有一个div,它的css样式如下:

  • 2020-04-27 11:02:21

    CSS 气泡对话框

    点击上面地址,我们可以看到一个灵活的css气泡,拖动按钮,改变气泡效果。

  • 2020-04-27 16:59:23

    Docker部署nuxtjs

    将一下文件拷贝至服务器目录/app |名称|描述| |-|-| |.nuxt|编译后生成的目录,开发模式和发布模式通用,注意发布前使用npm run build 防止将dev目录发布| |static| 静态资源文件,通过/可直接访问| |package.json|npm 包管理配置文件| |nuxt.config.js|Nuxt.js 默认的配置涵盖了大部分使用情形,可通过 nuxt.config.js 来覆盖默认的配置。| |node_modules|依赖模块|