超轻量!安卓巧妙实现多 item 和抽屉效果动画

   2016-11-10 0
核心提示:先看效果: 本文Github https://github.com/AndroidMsky/ElasticLayout先解释一下标题不然被说成标题党可不好,为什么是超轻量,因为我知道用Listview和RecyclerView可以实现这样的效果,但是大家都知这二者都是需要adapter去适配数据,用起来比较麻烦,而且

先看效果:

先解释一下标题不然被说成标题党可不好,为什么是超轻量,因为我知道用Listview和RecyclerView可以实现这样的效果,但是大家都知这二者都是需要adapter去适配数据,用起来比较麻烦,而且二者默认都是可以滑动的。

那么,当你遇到如下需求,关键人信息中,关键人数量是动态的,但是不会太多。整个页面是可以上下滑动的,关键人信息,基本资料,财务信息,都是可以展开和关闭的,里面都有5项左右的信息,如图:

 超轻量!安卓巧妙实现多 item 和抽屉效果动画

面对这个需求你怎么办?小李说,可以用listview加载不同样式的布局,然后写在一个list里,当用户展开关键人信息的时候去移除或者添加一些item然后重新适配listview,小李啪啪啪300行代码搞出来了,效果还不错,只是展开时候没有动画。小明马上来了说小李listview已经快退出历史舞台了用起来不如RecyclerView,而且RecyclerView对动画的支持也更加友好,好的,我来啪啪啪写出150行代码,小李用RecyclerView实现了需求。

然而他们的项目经理对二人的代码都不满意,首先小李的没有过渡动画代码量太大,小明的呢,可以还不错,不过多样式逻辑复杂,数据不多,RecyclerView的view复用优势也不明显。用一个LinearLayout,如果超长需要滑动用ScrollView好不好?于是小李跑回去实现了效果。

首先准备一个工具类,以属性动画的形式改变View的高度:

分别传入view,view当前高度,view结束高度,动画时间毫秒。

public static void anim(final View view, int startHeight, int endHeight, int duration){
        ObjectAnimator anim = ObjectAnimator.ofInt(view, "view", startHeight,endHeight ).setDuration(duration);
        anim.start();
        anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator valueAnimator) {
                int cVal = (int) valueAnimator.getAnimatedValue();
                LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) view.getLayoutParams();
                lp.height = cVal;
                view.setLayoutParams(lp);
            }
        });
    }

dp px的转换(因为xml多用的dp去定义高度)

public static int dip2px(Context context, float dipValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        return (int) (dipValue * scale + 0.5f);
    }

展开View代码:

anim(mLinearLayout2, 0, l2Height, 500);

折叠View代码:

//记录一下当前高度方便下次展开
l2Height = mLinearLayout2.getHeight();
AnimTools.anim(mLinearLayout2, mLinearLayout2.getHeight(), 0, 500);


    }

确实很简单有么有,最基本的抽屉效果就出来了。

然后是如何add一行进来:

用一个view的list去管理动态的view item,先进入list然后加入我们的

LinearLayout并且对LinearLayout的高度施展动画大法,ADD view成功:

public void add(View v) {

nowNumber++;
final View view = LayoutInflater.from(this).inflate(R.layout.item, null);
TextView textView = (TextView) view.findViewById(R.id.tv_item);
mViews.add(view);
textView.setText("num:" + nowNumber);
mLinearLayout2.addView(view);
AnimTools.anim(mLinearLayout2, mLinearLayout2.getHeight(), mLinearLayout2.getHeight() + AnimTools.dip2px(this, 50), 200);

如何del一个view:

先施展动画然后再romove view,可以根据自己的需要更改这里的逻辑

AnimTools.anim(mLinearLayout2, mLinearLayout2.getHeight(), mLinearLayout2.getHeight() - AnimTools.dip2px(this, 50), 200);

        new Handler().postDelayed(new Runnable() {

            public void run() {

          mLinearLayout2.removeView(mViews.get(mViews.size() - 2));
mViews.remove(mViews.size() - 2);}

        }, 200);

就这样不到100行,逻辑清晰,抽屉效果就实现了,笔者也鼓励大家用不同的方法去干同一件事情,肯定会有不同的发现,不要见到多item就想起Listview就RecyclerView,这种定向的思维在编程的世界里是可怕的。请不要局限自己的思维。

欢迎关注作者。欢迎评论讨论。欢迎拍砖。

如果觉得这篇文章对你有帮助 欢迎star我的github。也算对笔者的一种支持。

本文Github代码链接

https://github.com/AndroidMsky/ElasticLayout

欢迎加作者自营安卓开发交流群:308372687

 超轻量!安卓巧妙实现多 item 和抽屉效果动画

博主原创未经允许不许转载。

 
标签: RecyclerView
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • Android轻松实现RecyclerView悬浮条
    Android轻松实现RecyclerView悬浮条
    在我们在刷Instagram的动态时,你是否注意到这样一个小小的动效,就是当一条动态(以卡片形式呈现)向上滑动时,动态卡片的头部会始终悬浮在列表最上方,直到下一张动态卡片的头部将它顶掉并替换它悬浮着。言语可能说不清楚,就直接来看一下它的效果好了。综合
    01-06 RecyclerView
  • Android ItemTouchHelper 实践
    Android ItemTouchHelper 实践
    实现RecyclerView拖动排序和滑动删除,我想到的是ViewDragHelper ,或者是第三方库,当我看了 ToDoList 的时候,发现原来官方已经支持RecyclerView拖动排序与滑动删除,那就是ItemTouchHelper。 简介 “ItemTouchHelper is a utility class to add swipe to d
    12-11 RecyclerView
  • TaoBaoUI:高仿淘宝界面
    TaoBaoUI:高仿淘宝界面
    TaoBaoUI自己写的高仿淘宝界面(非常适合新手学习), 使用了RecyclerView,用RecyclerView的多条目布局做的,里面使用了一些自定义组件,可以学习到自定义属性的编写。里面还有一些工具性的东西,可以拿到你自己的项目中改改就用(懒人必备)可以学习到:Recyc
    12-06 RecyclerView
  • Android 复杂的列表视图新写法: MultiType 详解篇
    Android 复杂的列表视图新写法: MultiType 详解
    前言 在开发我的TimeMachine时,我有一个复杂的聊天页面,于是我设计了我的类型池系统,它是完全解耦的,因此我能够轻松将它抽离出来分享,并给它取名为 MultiType .从前, 比如我们写一个类似微博列表页面 ,这样的列表是十分复杂的:有纯文本的、带转发原文
    11-13 RecyclerView
  • RecyclerView嵌入CheckBox带来的显示问题的解决办法
    RecyclerView嵌入CheckBox带来的显示问题的解决
    android 的recyclerview(或者是listview)内部item的布局包含checkbox控件时,会遇到常见的问题:选择的checkbox后滑动listview内容时会checkbox选择的值会刷新成原来状态值(即没选中),选择listview所有checkbox值之后,只能获取当前可见的checkbox的值,向后滑
    11-13 RecyclerView
  • RecyclerView的基本使用
    RecyclerView与ListView原理是类似的:都是仅仅维护少量的View并且可以展示大量的数据集。RecyclerView用如下两种方式简化了数据的展示和处理:使用LayoutManager来确定每一个item的排列方式为增加和删除项目提供默认的动画效果当然,LayoutManager和动画效果
    11-10 RecyclerView
  • Android-RecyclerView自定义布局文件-Oak先生
    Android-RecyclerView自定义布局文件-Oak先生
    之前我介绍了RecyclerView的简单使用,那么如何在RecyclerView中自定义布局呢,就像ListView那样,下面我给大家介绍一下,讲说和 RecyclerView的简单使用那篇博客差不多,但是代码不同, 大牛请绕过! 第一步:创建一个空的Activity项目,导入support-v7这个
    11-10 RecyclerView
  • Android 用 RecyclerView 练手仿美团分类界面
    Android 用 RecyclerView 练手仿美团分类界面
    RecyclerView目前来说对大家可能不陌生了。由于在公司的项目中,我们一直用的listview和gridview。某天产品设计仿照美团的分类界面设计了一个界面,我发现用gridview不能实现这样的效果,所以就想到了RecyclerView,确实是一个很好的控件。和大家分享一下。效
    11-03 RecyclerView
  • RecyclerView 自定义 LayoutManager, 打造不规则布局
    RecyclerView 自定义 LayoutManager, 打造不规
    本文由 亓斌 投稿。亓斌 的博客地址: http://blog.csdn.net/qibin0506一直以来灵活的LayoutManager也作为RecyclerView的一大特色被介绍,不过自定义LayoutManager的文章倒是不多,一起来看看作者是如何自定义的。 1 RecyclerView的时代 自从google推出了Recy
    10-17 RecyclerView
  • 【Android】新的工具类DiffUtil,让RecyclerView上天
    【Android】新的工具类DiffUtil,让RecyclerVie
    本文由 张旭童 投稿。张旭童 的博客地址: http://blog.csdn.net/zxt0601/跟作者的几次沟通后发现作者非常的贴心,对了,该类不是7.0才能用,其兼容到SDK 7,属于support-v7中的类。还有该类的思想,有兴趣可以应用到ListView中,如果你非常喜欢ListView的话
    10-10 RecyclerView
点击排行