Android —頁面下拉重新整理(ListView與SwipeRefreshLayout)
阿新 • • 發佈:2019-01-27
相信大家在使用淘寶的時候應該都看到過下拉重新整理的效果。這種效果看起來會感覺比較難做,一起來看下下拉重新整理。
ListView
思路:
通過FrameLayout底層為下拉重新整理的Header,上面一層是ListView,監聽手指滑動設定動畫效果,移動ListView。
使用:
1、編寫ListView頂部下拉重新整理的header
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width ="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:text="下拉重新整理"
/>
</LinearLayout>
2、ListView(後面將會進行動態新增)
<?xml version="1.0" encoding="utf-8"?>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff">
</ListView>
3、自定義FrameLayout動態新增ListView與header
public class MyFrameLayout extends FrameLayout{
ListView listview;
public MyFrameLayout(Context context) {
super(context);
}
public MyFrameLayout(Context context, AttributeSet attrs) {
super(context, attrs);
//先建立LayoutInflater 用於獲得佈局
LayoutInflater inflater=(LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
//新增頂部佈局
View header=inflater.inflate(R.layout.header, null);
//向佈局中新增header(下拉載入)
addView(header);
//ListView的Adapter
ArrayAdapter<String> adapter=new ArrayAdapter<String>(context, android.R.layout.simple_list_item_1,new String[]{"a","b","c","d","e","f","g","h","i","j","k","l","m","n"});
listview=(ListView) inflater.inflate(R.layout.mylistview, null);
listview.setAdapter(adapter);
//向佈局中新增ListView
addView(listview);
}
//攔截事件
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
if(ev.getAction()==MotionEvent.ACTION_DOWN){
}
if(listview.getFirstVisiblePosition()==0){
View firstview=listview.getChildAt(listview.getFirstVisiblePosition());
if(firstview.getY()>=0){
return true;
}
}
return super.onInterceptTouchEvent(ev);
}
//設定動畫時使用
private float oldy;
//處理事件
@Override
public boolean onTouchEvent(MotionEvent event) {
Log.d("onTouchEvent", ""+super.onTouchEvent(event));
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
//手指落下監聽
oldy=event.getY();
case MotionEvent.ACTION_MOVE:
float y=event.getY();
float distance=y-oldy;
//設定listview移動
listview.setTranslationY(listview.getTranslationY()+distance);
oldy=y;
invalidate();
return true;
case MotionEvent.ACTION_UP:
//手指擡起時,設定動畫效果,使ListView回到頂部
ObjectAnimator.ofFloat(listview, "translationY", listview.getTranslationY(),0).setDuration(300).start();
break;
default:
break;
}
return super.onTouchEvent(event);
}
}
4、佈局引用
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<com.example.administrator.myapplication2.MyFrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</com.example.administrator.myapplication2.MyFrameLayout>
</LinearLayout>
5、在MainActivity中使用該佈局即可。
SwipeRefreshLayout
實際上Android已經為我們實現一種下拉重新整理,那就是通過SwipeRefreshLayout,看下新出的SwipeRefreshLayout的實現方式。
使用:
1、佈局
注:SwipeRefreshLayout類似於ScrollView,內部只能有一個元件。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swiperefresh"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="@+id/listview2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
2、MainActivity
public class MainActivity extends Activity {
private SwipeRefreshLayout refresh;
private ListView mlistview;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
mlistview=(ListView) findViewById(R.id.listview2);
refresh=(SwipeRefreshLayout) findViewById(R.id.swiperefresh);
ArrayAdapter<String> adapter=new ArrayAdapter<String>(getApplicationContext(), android.R.layout.simple_list_item_1,new String[]{"a","b","c","d","e","f","g","h","i","j","k","l","m","n"});
mlistview.setAdapter(adapter);
//設定監聽事件
refresh.setOnRefreshListener(new OnRefreshListener() {
@Override
public void onRefresh() {
refresh.setRefreshing(false);
}
});
}
}