Android Material Design 之 Snackbar

概述

Snackbar 是一個類似於 Toast 的用來顯示消息的條狀控件。和 Toast 的不同之處在於，Toast 是在屏幕下方偏上一點的位置彈出來；而 Snackbar 是從屏幕下方彈出來，並顯示在屏幕底部。

代碼

代碼和 Toast 類似

RelativeLayout rootLayout = (RelativeLayout) findViewById(R.id.root_layout);
Snackbar.make(rootLayout, "This is a snack bar!", Snackbar.LENGTH_SHORT).show();

可以看到 make 方法和 show 方法都是採用的 Toast 的設計風格。

make 方法的第二個和第三個參數和 Toast 一樣，第一個參數是指定 Snackbar 的父控件，表示想在哪個 Layout 的底部顯示一個 Snackbar。
但是有時候雖然指定了一個 Layout，但是 Snackbar 並不是顯示在這個 Layout 的底部。這是爲什麼？
看一下 make 方法裏面的 parent 取得方法

final ViewGroup parent = findSuitableParent(view);

再看一下 findSuitableParent 方法

    private static ViewGroup findSuitableParent(View view) {
        ViewGroup fallback = null;
        do {
            if (view instanceof CoordinatorLayout) {
                // We've found a CoordinatorLayout, use it
                return (ViewGroup) view;
            } else if (view instanceof FrameLayout) {
                if (view.getId() == android.R.id.content) {
                    // If we've hit the decor content view, then we didn't find a CoL in the
                    // hierarchy, so use it.
                    return (ViewGroup) view;
                } else {
                    // It's not the content view but we'll use it as our fallback
                    fallback = (ViewGroup) view;
                }
            }

            if (view != null) {
                // Else, we will loop and crawl up the view hierarchy and try to find a parent
                final ViewParent parent = view.getParent();
                view = parent instanceof View ? (View) parent : null;
            }
        } while (view != null);

        // If we reach here then we didn't find a CoL or a suitable content view so we'll fallback
        return fallback;
    }

意思就是
1. 如果傳進去的 View 是 CoordinatorLayout，那麼 View 就是 CoordinatorLayout。
2. 否則，一直向上取 parent 知道 parent 是 android.R.id.content，返回 android.R.id.content。
3. 否則，返回傳進去的 View。

Snackbar 還可以在右側設置按鈕來添加事件，根據 Material Design 的設計原則，最多隻可以添加 1 個按鈕。

RelativeLayout rootLayout = (RelativeLayout) findViewById(R.id.root_layout);
Snackbar.make(rootLayout, "This is a snack bar!", Snackbar.LENGTH_SHORT)
    .setAction("UNDO", new View.OnClickListener() {
      @Override
       public void onClick(View v) {
       }
     })
     .show();