Android 翻頁效果加蘋果桌面應用抖動效果

效果預覽

這是最近項目的一個需求，做者寫這篇文章目的不是想教你們如何作這個動畫。不少動畫不少效果，都有開源做者已經實現了，咱們只須要拿來用。在實際開發中開發效率纔是第一步，源碼的學習能夠放在本身沒事的時候來作。分享下我拿到一個需求時是怎樣一步一步來攻克的。我的看法，不吝賜教！

分析

首先咱們先將動畫分解，這一動畫分爲兩部分

• 翻頁動畫
• item抖動效果

而後咱們再來看佈局，可能一開始拿到這個效果圖，咱們直接就認爲筆記本里面就是一個gridview或者一個橫向的recyclerview。其實否則，咱們認真分析能夠看出不論是gridview仍是橫向recyclerview，它們的item第一行從左往右都是item0、item一、item二、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