最新Android ListView 下拉重新整理 上滑載入
阿新 • • 發佈:2019-02-14
開發專案過程中基本都會用到listView的下拉重新整理和上滑載入更多,之前大家最常用的應該是pull to refresh或它的變種版吧,google官方在最新的android.support.v4包中增加了一個新類SwipeRefreshLayout,地址 這個類的作用就是提供官方的下拉重新整理,並且效果相當不錯,而上拉載入更多則用我們自定義的listview,也是相當簡單。
下拉重新整理
簡單的介紹下:
首先它是一個viewgroup,但是它只允許有一個子控制元件,子控制元件能是任何view,使用的時候,所在類實現OnRefreshListener介面,在onRefresh()方法中實現所要完成的任務,
findviewbyid得到SwipeRefreshLayout後,顯示重新整理動畫用SwipeRefreshLayout.setRefreshing(true);取消重新整理動畫用SwipeRefreshLayout.setRefreshing(false);相當簡單。
另外有一些其他的常用方法比如判斷時候正在顯示重新整理動畫,用SwipeRefreshLayout.isShown()。
佈局:
<android.support.v4.widget.SwipeRefreshLayout android:id="@+id/swip_index" android:layout_width="match_parent" android:layout_height="match_parent" > <com.example.listviewloadmore.LoadMoreListView android:id="@+id/listView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" > </com.example.listviewloadmore.LoadMoreListView> </android.support.v4.widget.SwipeRefreshLayout>
上拉載入更多
思路:監聽滑動事件並判斷是否到達底部,到達底部的時候,回撥我們定義好的一個方法,從而達到上拉載入更多的目的。 但是具體怎麼監聽和回撥呢,我們不妨看看Button控制元件的點選事件的執行流程,Button繼承textView,textView繼承View 1.實現OnClickListener介面,重寫onClick方法 2.設定Button.setOnClickListener(this)或者new一個介面也一樣的。 檢視View原始碼,我們可得知View類中有OnClickOistener介面,setOnClickListener方法 那麼我們在我們自己的listview中要實現的步驟狠清楚了 1.myListView繼承listView 2.實現onLoadMore介面 3.在類中宣告onLoadMore介面物件 4.設定點選方法setOnLoadMore 5.在需要的地方呼叫onLoadMore.loadMore方法。 下面附上MyListView原始碼:
package com.example.listviewloadmore; import android.annotation.SuppressLint; import android.content.Context; import android.util.AttributeSet; import android.util.Log; import android.view.LayoutInflater; import android.view.View; import android.widget.AbsListView; import android.widget.AbsListView.OnScrollListener; import android.widget.ListView; public class LoadMoreListView extends ListView implements OnScrollListener{ private View footer; private int totalItem; private int lastItem; private boolean isLoading; private OnLoadMore onLoadMore; private LayoutInflater inflater; public LoadMoreListView(Context context) { super(context); init(context); } public LoadMoreListView(Context context, AttributeSet attrs) { super(context, attrs); init(context); } public LoadMoreListView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); init(context); } @SuppressLint("InflateParams") private void init(Context context) { inflater = LayoutInflater.from(context); footer = inflater.inflate(R.layout.load_more_footer,null ,false); footer.setVisibility(View.GONE); this.addFooterView(footer); this.setOnScrollListener(this); } @Override public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) { this.lastItem = firstVisibleItem+visibleItemCount; this.totalItem = totalItemCount; } @Override public void onScrollStateChanged(AbsListView view, int scrollState) { if(this.totalItem == lastItem&&scrollState == SCROLL_STATE_IDLE){ Log.v("isLoading", "yes"); if(!isLoading){ isLoading=true; footer.setVisibility(View.VISIBLE); onLoadMore.loadMore(); } } } public void setLoadMoreListen(OnLoadMore onLoadMore){ this.onLoadMore = onLoadMore; } /** * 載入完成呼叫此方法 */ public void onLoadComplete(){ footer.setVisibility(View.GONE); isLoading = false; } public interface OnLoadMore{ public void loadMore(); } }
程式碼不是很複雜,認真看一定能看明白。 底部正在載入佈局程式碼
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/load_more_footer"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ProgressBar
android:id="@+id/load_more_progressBar"
android:layout_width="36dp"
android:layout_height="36dp"
android:padding="3dp"
android:visibility="visible" />
<TextView
android:id="@+id/no_more_textView"
android:layout_width="wrap_content"
android:layout_height="36dp"
android:gravity="center"
android:text="正在載入"
android:textColor="#666666"
android:textSize="16sp"
android:visibility="visible" />
</LinearLayout>
</RelativeLayout>
基本到這上拉載入更多就結束了。 下面就是把下拉上拉結合起來用了 佈局檔案main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.listviewloadmore.MainActivity" >
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swip_index"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.example.listviewloadmore.LoadMoreListView
android:id="@+id/listView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world" >
</com.example.listviewloadmore.LoadMoreListView>
</android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>
MainActivity程式碼
package com.example.listviewloadmore;
import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.support.v4.widget.SwipeRefreshLayout;
import android.support.v4.widget.SwipeRefreshLayout.OnRefreshListener;
import android.widget.ArrayAdapter;
import android.widget.Toast;
import com.example.listviewloadmore.LoadMoreListView.OnLoadMore;
public class MainActivity extends Activity implements OnRefreshListener, OnLoadMore {
private LoadMoreListView listView;
private SwipeRefreshLayout swip;
private int page = 1;
ArrayList<String> data1 = new ArrayList<String>();
private ArrayAdapter<String> adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData(1);
}
private void initView() {
listView = (LoadMoreListView) findViewById(R.id.listView);
listView.setLoadMoreListen(this);
swip = (SwipeRefreshLayout) findViewById(R.id.swip_index);
swip.setOnRefreshListener(this);
swip.setColorSchemeResources(android.R.color.holo_blue_light, android.R.color.holo_red_light, android.R.color.holo_orange_light,
android.R.color.holo_green_light);
adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, data1);
}
/**
* 載入資料
* @param page2 頁數
*/
private void initData(int page2) {
// TODO Auto-generated method stub
if(page2==1){
for (int i = 0; i < 10; i++) {
data1.add((i+1)+"");
listView.setAdapter(adapter);
}
}else{
data1.add("新加的第"+(9+page2)+"個");
}
}
// 下拉重新整理的方法
@Override
public void onRefresh() {
Toast.makeText(this, "開始重新整理啦", Toast.LENGTH_SHORT).show();
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
if(swip.isShown()){
swip.setRefreshing(false);
}
Toast.makeText(MainActivity.this, "重新整理完成了", Toast.LENGTH_SHORT).show();
}
}, 3000);
}
// 載入更多的方法
@Override
public void loadMore() {
page++;
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
initData(page);
listView.onLoadComplete();
Toast.makeText(MainActivity.this, "載入完成", Toast.LENGTH_SHORT).show();
adapter.notifyDataSetChanged();
}
}, 3000);
}
}
上一下效果圖:
原始碼地址:點選下載