相信小夥伴在APP裏面都使用過下拉刷新這個功能,像微信、QQ等各種APP都有下拉刷新這個功能,那麼它究竟是如何實現的呢?來看看!
效果圖先行:
可以看到圖中,下拉刷新進行了事件處理,並且下拉刷新的樣式比較漂亮(鮮豔。。。)
首先來看看XML佈局文件
可以看到,SwipeRefreshLayout是一個根佈局,然後裏面具體放什麼看你需求了!
<?xml version="1.0" encoding="utf-8"?>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/swiprefresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/txv_refresh"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="這個是一個TtetView"
android:textColor="@color/colorRed"
android:textSize="22sp" />
<Button
android:id="@+id/btn_refresh"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="點擊進行刷新" />
</LinearLayout>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
然後來看看JAVA後臺代碼(逐個解析)
首先是利用下拉刷新的監聽回調實現了每次下拉刷新對TextView增加**“刷新了一下”的字樣,爲什麼要設置1.5秒停止**呢,因爲你如果不設置,那麼刷新的小圈圈就會永不停歇的在那裏轉呀轉~所以我們需要調用mSwiprefresh.setRefreshing(false);
讓它停下來!
//SwipeRefreshLayout的下拉刷新監聽回調
mSwiprefresh.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
//每次刷新都給TextView加上一段文字
mTxvRefresh.setText(mTxvRefresh.getText().toString()+"刷新了一次");
//這裏設置1.5秒後停止
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
if (mSwiprefresh.isRefreshing()){
mSwiprefresh.setRefreshing(false);
}
}
},1500);
}
});
緊接着,是按鈕的點擊也觸發了刷新,但是細心的朋友會發現效果圖中,點擊按鈕刷新完以後,TextView並沒有像之前那樣增加**“刷新了一下”**的字樣!這就是下拉刷新和調用mSwiprefresh.setRefreshing(true);
方法進行刷新的區別了!
//這裏設置點擊按鈕進行刷新動作(不需要下滑)
//不會執行上面的監聽回調裏面的方法
mBtnRefresh.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//設置SwipeRefreshLayout的狀態
mSwiprefresh.setRefreshing(true);
//這裏設置1.5秒後停止
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
if (mSwiprefresh.isRefreshing()){
mSwiprefresh.setRefreshing(false);
}
}
},1500);
}
});
最後是關於SwipeRefreshLayout樣式的兩個設置,以及刷新的觸發距離,這裏說一下設置刷新圓球裏面線條的顏色集,線條轉一圈是1秒的時間,所以說,如果你不準備讓它轉很久,那你設置太多顏色也是白費!
//設置觸發下拉刷新的滑動距離
mSwiprefresh.setDistanceToTriggerSync(100);
//設置刷新圓球的背景顏色
mSwiprefresh.setProgressBackgroundColorSchemeColor(Color.YELLOW);
//設置圓球裏面轉圈圈線條的顏色集 下拉時是第一個顏色,後面是轉一圈換一個顏色
mSwiprefresh.setColorSchemeColors(new int[]{Color.RED,Color.BLUE});
如果小夥伴們有什麼不懂的,可以下方評論區留言,我會第一時間盡我所能地答覆你!