Android翻页效果加苹果桌面应用抖动效果

本文同步发布至博客、公众号androidparks

效果预览

这是最近项目的一个需求，作者写这篇文章目的不是想教大家如何做这个动画。很多动画很多效果，都有开源作者已经实现了，我们只需要拿来用。在实际开发中开发效率才是第一步，源码的学习可以放在自己没事的时候来做。分享下我拿到一个需求时是怎样一步一步来攻克的。个人见解，不吝赐教！

分析

首先我们先将动画分解，这一动画分为两部分

• 翻页动画
• item抖动效果

然后我们再来看布局，可能一开始拿到这个效果图，我们直接就认为笔记本里面就是一个gridview或者一个横向的recyclerview。其实不然，我们认真分析可以看出不管是gridview还是横向recyclerview，它们的item第一行从左往右都是item0、item1、item2、item3，而我们实现的效果是笔记本的左边页->右边页，也就是必须要左边半页填满后才向右边半页填数据，作者用了两个两行两列的girdview放在笔记本里面，实现了这一效果。如下图（注意看item的下标）：

编码实现

翻页效果

如果我们自己来写这个翻页的效果，还是有点复杂。经过搜索我发现了一个类库android-FlipView已经实现了这一效果，在这里也感谢原作者的贡献。android-FlipView支持左右翻页和上下翻页。
作者将api设计得尽可能跟ListView一样。FlipView拥有一个一般的adapter，你可以在如下设置adapter：

void setAdapter(ListAdapter adapter);
ListAdapter getAdapter();

获取可翻转的页数和当前页：

int getPageCount();
int getCurrentPage();

类似于ListView中scrollTo, smoothScrollTo, scrollBy 和smoothScrollBy 作用的一些方法：

void flipTo(int page);
void smoothFlipTo(int page);
void flipBy(int pageDelta);
void smoothFlipBy(int pageDelta);

翻页效果最大的难题已经解决，接下来问题就是数据封装，嵌套两个girdview了，这里简单贴下代码，感兴趣的可以直接去看源码。

/**
         * 当前数据8个一页，获取总页数
         * 两种情况1：数据长度刚好是8的倍数，那么总页数=数据长度÷8
         *        2：数据长度不为8的倍数，总页数=数据长度÷8 + 1 （为什么加1？因为长度与8相除有余数，余数这一部分也要占一页）
         */
        if (familyInfos.size() % 8 == 0) {
            totalPage = familyInfos.size() / 8;
        } else {
            totalPage = familyInfos.size() / 8 + 1;
        }

        /**用一个新的集合来装每一页里面的数据，形成一个新的集合
         * 循环总页数次   用List.subList(int start, int end)方式取出数据  注意这里的参数不是下标，从1开始
         * 同样两种情况1：当当前页的数据刚好8个的时候直接取
         *            2：最后一页的情况，就是从 页码*8->数据长度
         */
        List<List<FamilyInfo>> family = new ArrayList<>();
        for (int i = 0; i < totalPage; i++) {
            List newlist = null;
            if (i * 8 + 7 < familyInfos.size() - 1) {
                newlist = familyInfos.subList(i * 8, (i + 1) * 8);
            } else {
                newlist = familyInfos.subList(i * 8, familyInfos.size());
            }
            family.add(newlist);
        }
        adapter = new FlipViewAdapter(this, family);
        flipView.setAdapter(adapter);

抖动效果

开始作者用的是gridview的setLayoutAnimation方法，不了解LayoutAnimation的可以去搜索下，但是这种方式只能在girdview第一次加载的时候才会有，后面我们再需要开启动画就不行了。
所以只有一个item一个item的去做动画了。分析一下这个动画，这个抖动的动画是以item的中心点左右旋转。ok，那就用rotate旋转动画

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="100"
    android:fromDegrees="-2"
    android:pivotX="50%"
    android:pivotY="50%"
    android:repeatCount="infinite"
    android:repeatMode="reverse"
    android:toDegrees="2" />
<!--    
  duration      动画执行时间
  fromDegrees   动画开始时的角度   
  toDegrees     动画结束时物件的旋转角度,正代表顺时针     
  pivotX    属性为动画相对于物件的X坐标的开始位置  
  pivotY    属性为动画相对于物件的Y坐标的开始位置
  repeatCount 动画的重复次数 infinite表示循环
  repeatMode  重复模式  restart：重新从头开始执行。reverse：反方向执行。
-->   

总结

以上只是一个大概的思路，感兴趣的可以去我的github看下源码。重点说明，因为是在平板上面做的，没有做适配。可以用模拟器看效果或者横屏模式。

本文作者：Rance935本文出处：Android翻页效果加苹果桌面应用抖动效果转载请在开头注明作者详细信息和本文出处
欢迎关注我的微信公众号和QQ群，分享Android 开发和互联网内容
Android技术分享：群号534813930
微信号：androidparks
公众号：AndroidParks