Material Designのデザインガイドラインの1つにSwipe to Refreshがあります。
GmailやNewsStandなどに実装されているこんな感じのやつです。
実装してみたら結構簡単に導入できました。上の画像を実装したリポジトリはこちら。
以下手順です。
#build.gradleにdependenciesを追加
support-v4:21.0
のライブラリを利用します。
dependencies {
compile 'com.android.support:support-v4:21.0.+'
}
#レイアウトにSwipeRefreshLayoutを記述
ListViewやRecyclerViewを囲うようにSwipeRefreshLayout
を記述します。
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swipe_refresh"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="@color/grey300"
android:dividerHeight="@dimen/line_small"
android:listSelector="@drawable/bg_feedback"
android:scrollingCache="false" />
</android.support.v4.widget.SwipeRefreshLayout>
#OnRefreshListenerを実装
上記レイアウトをinflateしているクラスで、OnRefreshListener
をセットします。
// onCreate()などで初期化します。
mSwipeRefresh.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
// 引っ張って離した時に呼ばれます。
loadData();
}
});
#リフレッシュ後にsetRefreshing(false)を呼ぶ
画面の更新が終わったら、setRefreshing(false)
を呼ぶ必要があります。
これを呼ばないと、引っ張って更新が終わってもクルクルがずっと表示され続けます。
if (mSwipeRefresh.isRefreshing()) {
mSwipeRefresh.setRefreshing(false);
}
#色のカスタマイズ
ローディングのデフォルトの色は黒です。
Gmailみたいに、1周目は緑、2周目は赤、3周目は青、4周目は黄のようにローディングの色を変えたい場合は、初期化時に設定できます。
ちなみに、色はMaterial Designのカラーパレットから選ぶのがよいです。
mSwipeRefresh.setColorSchemeResources(R.color.green, R.color.red, R.color.blue, R.color.yellow);