小試 Material Design：一大波養眼妹紙

嗯……就是偶然看到了一個網站，因而經得站長贊成後，決定寫一個~~極致單手操做體驗的~~ App 練練~~手~~。

• 源代碼戳：xingrz/meizhi
• APK 下載回覆 1024

咳，這裏纔是重點

主要用了這些玩意：

• Material Design
• Volley + jsoup
• Picasso
• ObservableRecyclerView + GridLayoutManager
• ViewPager

RecyclerView 網格佈局

關於 RecyclerView 的用法不重複了，能夠戳我以前寫過的一片博客。網格佈局（Grid Layout）和線性佈局（Linear Layout）大同小異，只是把 Layout Manager 指定爲 GridLayoutManager，並指定要多少列（span）而已，看源代碼吧。

GalleryAdapter adapter = new GalleryAdapter(this, this);

GridLayoutManager layoutManager = new GridLayoutManager(this, 3);

RecyclerView albums = (RecyclerView) findViewById(R.id.albums);
albums.setHasFixedSize(true);
albums.setLayoutManager(layoutManager);
albums.setAdapter(adapter);

向上滾動隱藏 Action Bar

我知道大家想要這個的。

祭出神器：ksoichiro/Android-ObservableScrollView

compile('com.github.ksoichiro:android-observablescrollview:1.2.0') {
    // 顯然咱們但願用咱們本身項目裏引用的 Support Library
    // 因此把它引用的這個依賴排除掉吧
    exclude group: 'com.android.support', module: 'recyclerview-v7'
}

這位大神呢，把 ScrollView ListView WebView RecyclerView 等等一大堆可滾動控件都作了二次開發，把觸摸事件作了處理。

public class GalleryActivity extends ActionBarActivity implements
        ObservableScrollViewCallbacks {

    private ObservableRecyclerView albums;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        /* ... */
        albums = (ObservableRecyclerView) findViewById(R.id.albums);
        albums.setScrollViewCallbacks(this);
        /* ... */
    }

    @Override
    public void onUpOrCancelMotionEvent(ScrollState scrollState) {
        ActionBar actionBar = getSupportActionBar();
        if (scrollState == ScrollState.UP) {
            if (actionBar.isShowing()) {
                actionBar.hide();
            }
        } else if (scrollState == ScrollState.DOWN) {
            if (!actionBar.isShowing()) {
                actionBar.show();
            }
        }
    }

}

編譯，運行。咦？發現問題了沒？對了，ActionBar 隱藏的時候帶着整個 RecyclerView 一塊兒向上滑了。

之前用 ListView 的作法是 addHeaderView 在頂部加一個和 ActionBar 等高的佔位 View 對不？

RecyclerView 加頭

<?xml version="1.0" encoding="utf-8"?>
<View xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize" />

額，你說 RecyclerView 哪來的 addHeaderView？嗯，爲了不我懶得碼太多字的尷尬，我已經封裝好一個 HeaderListRecyclerAdapter 了。這個繼承自我寫的 ListRecyclerAdapter，用於將 List<E> 直接綁定到一個 RecyclerView.Adapter 上。同一個項目裏本身找吧……

好了，如今咱們稍微迂迴地成功地在 RecyclerView 最開頭放了一個和 ActionBar 同高的佔~~坑~~位 View。等下，咱們是網格佈局耶……

網格佈局控制

GridLayoutManager 提供了一個 setSpanSizeLookup() 的方法。能夠讓你傳入一個繼承自 GridLayoutManager.SpanSizeLookup 的類，在裏面你能夠決定每一個 position 上的項應該跨越多少列。既然是頭部，那麼就應該和 span size 一致吧：HeaderSpanSizeLookup

public class HeaderSpanSizeLookup extends GridLayoutManager.SpanSizeLookup {

    private final GridLayoutManager layoutManager;

    public HeaderSpanSizeLookup(GridLayoutManager layoutManager) {
        this.layoutManager = layoutManager;
    }

    @Override
    public int getSpanSize(int position) {
        return position == 0 ? layoutManager.getSpanCount() : 1;
    }

}

---

好像我又編不下去了……