Android Metro風格的Launcher開發系列第三篇

前言：

各位小夥伴，又到了每週更新文章了時候了，原本是週日能發出來呢，這不是遇上清明節嗎，女王大人發話了，清明節前兩天半陪她玩，只留給我週一下午半天時間寫博客，哪裏有女王哪裏就有壓迫呀有木有！好了閒話少說，上一篇博客(Android Metro風格的Launcher開發系列第二篇)說到Launcher主體框架用ViewPager來實現，這一篇博客我們來講說每個page的具體實現。

PagerAdapter：

        Launcher主體ViewPager實現就引出了PagerAdapter，PagerAdapter是android.support.v4包中的類，它的子類有FragmentPagerAdapter, FragmentStatePagerAdapter，這兩個adapter都是Fragment的適配器，這裏由於沒有用到Fragment因此這裏不講，我只講PagerAdapter。關於PageAapter的描述，Google官網原文是這樣的：Base class providing the adapter to populate pages inside of a ViewPager.  You will most likely want to use a more specific implementation of this, such as FragmentPagerAdapter or FragmentStatePagerAdapter，大體就是說PagerAdapter是ViewPager提供的一個適配器，方便咱們對ViewPager的每個View進行控制。個人PagerAdapter是這樣實現的：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49

public class LauncherAdapter extends PagerAdapter {     private ArrayList<PageViewItem> mViews;       public LauncherAdapter(ArrayList<PageViewItem> views) {         mViews = views;     }       @Override     public void destroyItem(View arg0, int arg1, Object arg2) {         ((ViewPager) arg0).removeView(mViews.get(arg1));     }       @Override     public void finishUpdate(View arg0) {     }       @Override     public int getCount() {         if (mViews != null) {             return mViews.size();         }         return 0;     }       public View getCurrentView(int currentID) {         return mViews.get(currentID);     }       @Override     public Object instantiateItem(View arg0, int arg1) {         ((ViewPager) arg0).addView(mViews.get(arg1));         return mViews.get(arg1);     }       @Override     public boolean isViewFromObject(View arg0, Object arg1) {         return (arg0 == arg1);     }       @Override     public void restoreState(Parcelable arg0, ClassLoader arg1) {     }       @Override     public Parcelable saveState() {         return null;     }   }

PageViewItem：

        PagerAdapter的getCurrentView方法返回的每個view都是自定義View，爲何要自定義呢？由於在每個圖標獲取焦點放大的時候會與旁邊的圖標有重疊部分，ViewPager每一頁view都是一個FrameLayout，在繪製view的時候是按照必定的順序繪製的，就會遇到焦點view放大後顯示的效果是被旁邊的view壓了一部分，若是不改變view繪製順序就不能避免這個問題。

如上圖所示，圖一顯示效果就是焦點view放大，改變繪製順序的實現效果。改變繪製順序其實就是重寫ViewGroup的getChildDrawingOrder(int childCount, int i)方法，每一次繪製時，最後返回focusview所在的viewgroup中的index就好了。

CellView：

 如上圖所示，每個正方形的view我在這裏叫作CellView，它也是一個自定義的view，自定義主要是爲了實現：

一、獲取焦點時放大和丟掉焦點時縮小效果，這裏是應用了屬性動畫，ViewPropertyAnimator能夠經過View的animate()方法獲取的，具體動畫實現以下：

?

1 2 3 4

mPropertyAnimator.scaleX((width + mScaleX) / width)                         .scaleY((height + mScaleY) / height).setDuration(duration)                         .setInterpolator(new DecelerateInterpolator())                         .start();

二、在xml文件靈活配置一些CellView的屬性，好比點擊打開的應用，呈現的ICON獲取地址，焦點x、y的放大值等，CellView對應的屬性定義attrs.xml文件以下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

<?xml version="1.0" encoding="utf-8"?> <resources>       <declare-styleable name="Launcher_ScaleView">         <attr name="parentID" format="integer" />         <attr name="resUrl" format="string" />         <attr name="resType" format="integer" />         <attr name="isRightEdge" format="boolean" />         <attr name="isLeftEdge" format="boolean" />         <attr name="isTopEdge" format="boolean" />         <attr name="isBottomEdge" format="boolean" />         <attr name="scaleX" format="integer" />         <attr name="scaleY" format="integer" />         <attr name="packageName" format="string" />         <attr name="activityName" format="string" />         <attr name="intentKey" format="string" />         <attr name="intentValue" format="string" />         <attr name="focusType" format="integer" />     </declare-styleable>   </resources>

三、實如今用遙控器移動焦點時不會焦點錯亂，在開發遙控器應用時一個很大的問題就是焦點在移動時焦點錯亂，基本上應用UI bug至少有一半時焦點bug，這個應用我爲了防止焦點錯亂定義了CellView的邊界屬性，上面的xml文件中isXXEdge就是，這樣在焦點移動到邊界時能夠進行Page之間的切換和其餘處理，防止焦點在進入每個page時出現錯亂。

    下面來看一下實現的具體效果：

總結：以上就是Metro風格Launcher實現，我用了三篇博客來說解這個應用，全部效果的實現都是本身摸索的，應該還有更好的實現方法，你們能夠多多交流提出本身的見解，也能夠關注個人微信號coder_online，以上謝謝！

  第一時間得到博客更新提醒，以及更多技術信息分享，歡迎關注我的微信公衆平臺:程序員互動聯盟(coder_online)，掃一掃下方二維碼或搜索微信號coder_online便可關注,咱們能夠在線交流。