PullToRefreshListView 应用讲解

PullToRefreshListView用法和ListView没有什么区别,listview能用的属性pulltorefresh也能用。

我一直认为动手是最好的学习方法…

一.首先看布局文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?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" >

<!-- ptr:ptrAnimationStyle="flip" flip:翻转 rotate:旋转-->
<!-- ptr:ptrShowIndicator="true" 右上角 右下角出现箭头-->
<com.handmark.pulltorefresh.library.PullToRefreshListView
xmlns:ptr="http://schemas.android.com/apk/res-auto"
android:id="@+id/pullToRefresh"
android:layout_width="match_parent"
android:layout_height="wrap_content"
ptr:ptrDrawable="@drawable/default_ptr_flip"
ptr:ptrAnimationStyle="flip"
ptr:ptrHeaderBackground="#383838"
ptr:ptrHeaderTextColor="#FFFFFF"
/>

</LinearLayout>

ptr是pullToRefresh的配置属性 使用是需要添加 xmlns:ptr="http://schemas.android.com/apk/res-auto"

ptr:ptrDrawable=”” 上拉下拉图标
ptr:ptrAnimationStyle=”” 图标动画: flip-翻转 rotate-旋转
ptr:ptrHeaderBackground=”” 上拉下拉时 头部的背景色
ptr:ptrHeaderTextColor=”” 上拉下拉时 文字颜色

还有一些常用属性

ptrRefreshableViewBackground 设置整个mPullRefreshListView的背景色

ptrScrollingWhileRefreshingEnabled刷新的时候,是否允许ListView或GridView滚动。觉得为true比较好。

ptrListViewExtrasEnabled 决定了Header,Footer以何种方式加入mPullRefreshListView,true为headView方式加入,就是滚动时刷新头部会一起滚动。

注:上述属性都可以代码添加,请用pullToRefresh.set查看

二.MainActivity代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
public class MainActivity extends ActionBarActivity {  

private PullToRefreshListView pullToRefresh;
private List<PullBean> data = new ArrayList<PullBean>();
MyAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
pullToRefresh = (PullToRefreshListView) findViewById(R.id.pullToRefresh);
data = getData();
adapter = new MyAdapter(this);
pullToRefresh.setAdapter(adapter);
/*
* Mode.BOTH:同时支持上拉下拉
* Mode.PULL_FROM_START:只支持下拉Pulling Down
* Mode.PULL_FROM_END:只支持上拉Pulling Up
*/
/*
* 如果Mode设置成Mode.BOTH,需要设置刷新Listener为OnRefreshListener2,并实现onPullDownToRefresh()、onPullUpToRefresh()两个方法。
* 如果Mode设置成Mode.PULL_FROM_START或Mode.PULL_FROM_END,需要设置刷新Listener为OnRefreshListener,同时实现onRefresh()方法。
* 当然也可以设置为OnRefreshListener2,但是Mode.PULL_FROM_START的时候只调用onPullDownToRefresh()方法,
* Mode.PULL_FROM的时候只调用onPullUpToRefresh()方法.
*/
pullToRefresh.setMode(Mode.BOTH);
init();

/*
* setOnRefreshListener(OnRefreshListener listener):设置刷新监听器;
* setOnLastItemVisibleListener(OnLastItemVisibleListener listener):设置是否到底部监听器;
* setOnPullEventListener(OnPullEventListener listener);设置事件监听器;
* onRefreshComplete():设置刷新完成
*/
/*
* pulltorefresh.setOnScrollListener()
*/
// SCROLL_STATE_TOUCH_SCROLL(1) 正在滚动
// SCROLL_STATE_FLING(2) 手指做了抛的动作(手指离开屏幕前,用力滑了一下)
// SCROLL_STATE_IDLE(0) 停止滚动
/*
* setOnLastItemVisibleListener
* 当用户拉到底时调用
*/
/*
* setOnTouchListener是监控从点下鼠标 (可能拖动鼠标)到放开鼠标(鼠标可以换成手指)的整个过程 ,他的回调函数是onTouchEvent(MotionEvent event),
* 然后通过判断event.getAction()是MotionEvent.ACTION_UP还是ACTION_DOWN还是ACTION_MOVE分别作不同行为。
* setOnClickListener的监控时间只监控到手指ACTION_DOWN时发生的行为
*/
pullToRefresh.setOnRefreshListener(new OnRefreshListener2<ListView>(){
@Override
public void onPullDownToRefresh(
PullToRefreshBase<ListView> refreshView) {
// TODO Auto-generated method stub
PullBean bean = new PullBean();
bean.setTitle("下拉刷新");
bean.setContent("我的神");
adapter.addFirst(bean);
new FinishRefresh().execute();
adapter.notifyDataSetChanged();
}

@Override
public void onPullUpToRefresh(
PullToRefreshBase<ListView> refreshView) {
// TODO Auto-generated method stub
PullBean bean = new PullBean();
bean.setTitle("上拉刷新");
bean.setContent("我的神");
adapter.addLast(bean);
new FinishRefresh().execute();
adapter.notifyDataSetChanged();
}
});


// pullToRefresh.setOnRefreshListener(new OnRefreshListener<ListView>() {
//
// @Override
// public void onRefresh(PullToRefreshBase<ListView> refreshView) {
// // TODO Auto-generated method stub
// String label = DateUtils.formatDateTime(getApplicationContext(), System.currentTimeMillis(),
// DateUtils.FORMAT_SHOW_TIME | DateUtils.FORMAT_SHOW_DATE | DateUtils.FORMAT_ABBREV_ALL);
//
// // Update the LastUpdatedLabel
// refreshView.getLoadingLayoutProxy().setLastUpdatedLabel(label);
// PullBean bean = new PullBean();
// bean.setTitle("我的神");
// bean.setContent("我的神");
// adapter.addFirst(bean);
// new FinishRefresh().execute();
// }
//
// });
}

private void init()
{
ILoadingLayout startLabels = pullToRefresh
.getLoadingLayoutProxy(true, false);
startLabels.setPullLabel("下拉刷新...");// 刚下拉时,显示的提示
startLabels.setRefreshingLabel("正在载入...");// 刷新时
startLabels.setReleaseLabel("放开刷新...");// 下来达到一定距离时,显示的提示

ILoadingLayout endLabels = pullToRefresh.getLoadingLayoutProxy(
false, true);
endLabels.setPullLabel("上拉刷新...");// 刚下拉时,显示的提示
endLabels.setRefreshingLabel("正在载入...");// 刷新时
endLabels.setReleaseLabel("放开刷新...");// 下来达到一定距离时,显示的提示

// // 设置下拉刷新文本
// pullToRefresh.getLoadingLayoutProxy(false, true)
// .setPullLabel("上拉刷新...");
// pullToRefresh.getLoadingLayoutProxy(false, true).setReleaseLabel(
// "放开刷新...");
// pullToRefresh.getLoadingLayoutProxy(false, true).setRefreshingLabel(
// "正在加载...");
// // 设置上拉刷新文本
// pullToRefresh.getLoadingLayoutProxy(true, false)
// .setPullLabel("下拉刷新...");
// pullToRefresh.getLoadingLayoutProxy(true, false).setReleaseLabel(
// "放开刷新...");
// pullToRefresh.getLoadingLayoutProxy(true, false).setRefreshingLabel(
// "正在加载...");
}

private List<PullBean> getData(){
List<PullBean> list = new ArrayList<PullBean>();
for(int i = 0;i < 10;i ++){
PullBean bean = new PullBean();
bean.setTitle("item " + i + " 搜索业务增速下滑 Google廉颇老矣?");
bean.setContent("Google于10月17日发布了2014年第三季度财报");
list.add(bean);
}

return list;
}

private class FinishRefresh extends AsyncTask<Void, Void, Void>{
@Override
protected Void doInBackground(Void... params) {
try {
Thread.sleep(1000);
} catch (InterruptedException e) {
}
return null;
}

@Override
protected void onPostExecute(Void result){
// adapter.notifyDataSetChanged();
pullToRefresh.onRefreshComplete();
}
}

private class MyAdapter extends BaseAdapter{
private LayoutInflater mInflater;

public MyAdapter(Context context) {
// TODO Auto-generated constructor stub
mInflater = LayoutInflater.from(context);
}

public void addFirst(PullBean bean){
data.add(0, bean);
}

public void addLast(PullBean bean){
data.add(bean);
}

@Override
public int getCount() {
// TODO Auto-generated method stub
return data.size();
}

@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return data.get(position);
}

@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return 0;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
ViewHolder viewHolder = null;
if(convertView == null){
viewHolder = new ViewHolder();
convertView = mInflater.inflate(R.layout.item, null);
viewHolder.title = (TextView) convertView.findViewById(R.id.title);
viewHolder.content = (TextView) convertView.findViewById(R.id.content);

convertView.setTag(viewHolder);
}else{
viewHolder = (ViewHolder) convertView.getTag();
}

viewHolder.title.setText(data.get(position).getTitle());
viewHolder.content.setText(data.get(position).getContent());

return convertView;
}

class ViewHolder{
TextView title;
TextView content;
}
}



}

pullToRefresh适配器Adapter和listview也是继承于BaseAdapter 看一下item的布局

item.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?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:padding="5dp"
android:orientation="vertical" >

<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:textColor="#BA55D3"
android:text="我的神"/>

<TextView
android:id="@+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14.0sp"
android:layout_marginTop="5dp"
android:textColor="#7CFC00"
android:text="我的神"/>
</LinearLayout>

pullToRefresh:通过setMode来设置是否可以上拉下拉

Mode.BOTH:同时支持上拉下拉

Mode.PULL_FROM_START:只支持下拉Pulling Down

Mode.PULL_FROM_END:只支持上拉Pulling Up

也可以用 ptr:ptrMode=”both”

可选值为:disabled(禁用下拉刷新),pullFromStart(仅支持下拉刷新),pullFromEnd(仅支持上拉刷新),both(二者都支持),manualOnly(只允许手动触发)

如果Mode设置成Mode.BOTH,需要设置刷新Listener为OnRefreshListener2,并实现onPullDownToRefresh()、onPullUpToRefresh()两个方法。

如果Mode设置成Mode.PULL_FROM_START或Mode.PULL_FROM_END,需要设置刷新Listener为OnRefreshListener,同时实现onRefresh()方法。

当然也可以设置为OnRefreshListener2,但是Mode.PULL_FROM_START的时候只调用onPullDownToRefresh()方法,Mode.PULL_FROM的时候只调用onPullUpToRefresh()方法.

如果想上拉、下拉刷新的时候 做一样的操作,那就用OnRefreshListener,上拉下拉的时候都调用

如果想上拉、下拉做不一样的的操作,那就在setOnRefreshListener时用new OnRefreshListener2<ListView>

当然如果想自己设置上拉下拉中的文字 可以这样

1
2
3
4
5
6
7
8
9
ILoadingLayout startLabels = pullToRefresh.getLoadingLayoutProxy(true, false);    
startLabels.setPullLabel("下拉刷新...");// 刚下拉时,显示的提示
startLabels.setRefreshingLabel("正在载入...");// 刷新时
startLabels.setReleaseLabel("放开刷新...");// 下来达到一定距离时,显示的提示

ILoadingLayout endLabels = pullToRefresh.getLoadingLayoutProxy(false, true);
endLabels.setPullLabel("上拉刷新...");// 刚下拉时,显示的提示
endLabels.setRefreshingLabel("正在载入...");// 刷新时
endLabels.setReleaseLabel("放开刷新...");// 下来达到一定距离时,显示的提示

当然也可以这样

1
2
3
4
5
6
7
8
9
10
11
12
13
pullToRefresh.getLoadingLayoutProxy(false, true)  
.setPullLabel("上拉刷新...");
pullToRefresh.getLoadingLayoutProxy(false, true).setReleaseLabel(
"放开刷新...");
pullToRefresh.getLoadingLayoutProxy(false, true).setRefreshingLabel(
"正在加载...");
// 设置上拉刷新文本
pullToRefresh.getLoadingLayoutProxy(true, false)
.setPullLabel("下拉刷新...");
pullToRefresh.getLoadingLayoutProxy(true, false).setReleaseLabel(
"放开刷新...");
pullToRefresh.getLoadingLayoutProxy(true, false).setRefreshingLabel(
"正在加载...");

显然在实际操作的时候也会用到其他监听

setOnScrollListener():
SCROLL_STATE_TOUCH_SCROLL 正在滚动
SCROLL_STATE_FLING 手指做了抛的动作(手指离开屏幕前,用力滑了一下)
SCROLL_STATE_IDLE 停止滚动

setOnLastItemVisibleListener():当用户拉到底时调用

setOnItemClickListener():为pullToRefresh中每一个item设置事件

代码下载:点击下载代码

下拉上拉图标和文字位置改动是在PullToRefresh源代码中改的,即:PullToRefreshListView.handleStyledAttributes 中lp的Gravity改为CENTER_VERTICAL

如果想要改动图标和文字的距离和布局,在这library项目下这两个文件改:

pull_to_refresh_header_horizontal.xml

pull_to_refresh_header_vertical.xml

参考博客:
Android PullToRefresh (ListView GridView 下拉刷新) 使用详解
PullToRefresh使用详解(一)–构建下拉刷新的listView