前言
ListView的上拉分页加载在很多app中都能看到，例如微信朋友圈、QQ空间、新闻列表等，因为数据量很大，一次加载所有的数据将严重造成资源浪费且影响用户体验。所以如果每次只加载一部分的数据，需要时再加载下一部分数据，那么就可以很大程度上节约资源。
具体实现
（前排提示：熟悉使用ListView而只想了解分页加载的朋友可直接空降第五部分）
一、数据源
- 这里我的数据源来自 易源接口 的奇闻异事API
- 通过谷歌自带的HttpURLConnection获取数据，这里我将数据获取封装成GetJsonObject方法，返回值为JSONObject对象，代码如下：
public class GetJsonObject {
public static JSONObject getJsonObject(String url) {
JSONObject mJsonObject = null;
try {
URL mURL = new URL(url);
HttpURLConnection mHttpURLConnection = (HttpURLConnection) mURL.openConnection();
mHttpURLConnection.setRequestMethod("GET");
mHttpURLConnection.setReadTimeout(5000);
mHttpURLConnection.setDoInput(true);
StringBuffer mStringBuffer = new StringBuffer();
String str;
BufferedReader mBufferedReader = new BufferedReader(new InputStreamReader(mHttpURLConnection.getInputStream()));
while ((str = mBufferedReader.readLine()) != null) {
mStringBuffer.append(str);
}
//用数据源StringBuffer创建JSONObject对象方便后面解析json
mJsonObject = new JSONObject(String.valueOf(mStringBuffer));
} catch (JSONException | IOException e) {
e.printStackTrace();
}
return mJsonObject;
}
}
- 解析json
1、创建Bean对象，用于数据封装
public class NewsBean {
public String news_ImageView;
public String news_TextView;
}
2、创建用于存储数据的List<NewsBean>
private List<NewsBean> mList = new ArrayList<>();
3、用谷歌自带的JSONObject解析json并将数据填充到List<NewsBean>中
try {
JSONObject mJSONObject = GetJsonObject.getJsonObject(url).getJSONObject("showapi_res_body");
JSONArray mJSONArray = mJSONObject.getJSONArray("newslist");
for (int i = 0; i < mJSONArray.length(); i++) {
JSONObject mJSONObject1 = mJSONArray.getJSONObject(i);
NewsBean mNewsBean = new NewsBean();
mNewsBean.news_ImageView = mJSONObject1.getString("picUrl");
mNewsBean.news_TextView = mJSONObject1.getString("title");
mList.add(mNewsBean);
}
} catch (JSONException e) {
e.printStackTrace();
}
二、创建ListView的适配器
- 新建一个MyListAdapter类继承BaseAdapter ，代码如下：
public class MyListAdapter extends BaseAdapter {
private List<NewsBean> mNewsBeanList;
private LayoutInflater mLayoutInflater;
private Context mContext;
public void bindData(Context mContext, List<NewsBean> mNewsBeanList){
this.mContext = mContext;
this.mLayoutInflater = LayoutInflater.from(mContext);
this.mNewsBeanList = mNewsBeanList;
}
@Override
public int getCount() {
return mNewsBeanList.size();
}
@Override
public Object getItem(int position) {
return mNewsBeanList.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder mViewHolder;
if (convertView == null){
mViewHolder = new ViewHolder();
convertView = mLayoutInflater.inflate(R.layout.list_item, null);
mViewHolder.mImageView = (ImageView) convertView.findViewById(R.id.image_item);
mViewHolder.mTextView = (TextView) convertView.findViewById(R.id.text_item);
convertView.setTag(mViewHolder);
}else {
mViewHolder = (ViewHolder) convertView.getTag();
}
NewsBean mNewsBean = mNewsBeanList.get(position);
//使用了Glide框架加载图片
Glide.with(mContext).load(mNewsBean.news_ImageView).placeholder(R.mipmap.ic_launcher).into(mViewHolder.mImageView);
mViewHolder.mTextView.setText(mNewsBean.news_TextView);
return convertView;
}
class ViewHolder{
public ImageView mImageView;
public TextView mTextView;
}
}
三、加载数据
- 由于网络请求是耗时操作，事实上请求和解析都是在异步任务AsyncTask的doInBackground中方法完成的，而给ListView设置适配器则是在onPostExecute方法中完成的。这里我在MainActivity中新建了一个内部类MyAsyncTask继承AsyncTask，代码如下：
class MyAsyncTask extends AsyncTask<String, Void, List<NewsBean>> {
@Override
protected void onPreExecute() {
super.onPreExecute();
}
@Override
protected List<NewsBean> doInBackground(String... params) {
try {
JSONObject mJSONObject = GetJsonObject.getJsonObject(params[0]).getJSONObject("showapi_res_body");
JSONArray mJSONArray = mJSONObject.getJSONArray("newslist");
for (int i = 0; i < mJSONArray.length(); i++) {
JSONObject mJSONObject1 = mJSONArray.getJSONObject(i);
NewsBean mNewsBean = new NewsBean();
mNewsBean.news_ImageView = mJSONObject1.getString("picUrl");
mNewsBean.news_TextView = mJSONObject1.getString("title");
mNewsBean.news_Url = mJSONObject1.getString("url");
mList.add(mNewsBean);
}
} catch (JSONException e) {
e.printStackTrace();
}
return mList;
}
@Override
protected void onPostExecute(List<NewsBean> strings) {
super.onPostExecute(strings);
mMyListAdapter.bindData(MainActivity.this, strings);
//只有当加载入第一页时才设置一次适配器
if (page == 1) {
mListView.setAdapter(mMyListAdapter);
}
mMyListAdapter.notifyDataSetChanged();
page++;
}
@Override
protected void onProgressUpdate(Void... values) {
super.onProgressUpdate(values);
}
}
-
调用 MyAsyncTask的execute()方法加载数据
Paste_Image.png -
效果如图所示
Paste_Image.png
五、分页加载
- 准备了那么多终于到了本文的重点，其实分页加载的关键在于什么时候需要加载下一页？
1、判断ListView什么时候滑动到了底部？方法是给ListView设置滚动监听，并重写onScroll()方法，代码如下：
mListView.setOnScrollListener(new AbsListView.OnScrollListener() {
@Override
public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
isLast = (totalItemCount == firstVisibleItem + visibleItemCount); //判断是否滑到底部
}
});
其中
-isLast是个boolean变量，用于判断ListView是否滑动到了底部
-totalItemCount 表示ListView总的的item数量
-firstVisibleItem 表示手机屏幕所显示的第一个item是ListView中的第几个item
-visibleItemCount表示手机屏幕可以看见的item的数量
所以当totalItemCount == firstVisibleItem + visibleItemCount时，就是滑动到了底部
2、然而有时ListView是滑动到了底部，但是我们的手指并没有离开屏幕，此时我们不想继续看下面的内容而往上滑动了，这时就没必要加载分页了，于是我们还需要判断滚动状态是否为停止滚动了
Paste_Image.png
所以需要再重写onScrollStateChanged()方法，于是完整的判断代码为：
mListView.setOnScrollListener(new AbsListView.OnScrollListener() {
@Override
public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
isLast = (totalItemCount == firstVisibleItem + visibleItemCount); //判断是否滑倒底部
}
@Override
public void onScrollStateChanged(AbsListView view, int scrollState) {
//当滑动到底部 且 手指离开屏幕时 确定为需要加载分页
if (isLast && scrollState == AbsListView.OnScrollListener.SCROLL_STATE_IDLE) {
new MyAsyncTask().execute(URL_PATH1 + num + URL_PATH2 + page + URL_PATH3 + showapi_timestamp + URL_PATH4);
}
}
});
再返回来看MyAsyncTask中的onPostExecute()方法
Paste_Image.png
其中
if (page == 1) {
mListView.setAdapter(mMyListAdapter);
}
mMyListAdapter.notifyDataSetChanged();
保证了适配器不会被多次设置且加载分页后页面不会移动到ListView的第一个item那边，而 page++ 则使每次调用加载分页时传入的url的页码参数自增一。
后话
- 关于网络请求和解析json格式的数据，推荐使用okHttp框架+Gson框架，更佳高效便捷。
- 关于ListView中加载网络图片，强烈推荐使用Glide框架，原因是因为在ListView上加载图片时会出现错误的位置加载图片而有图片闪动现象，还有时我们需要看的是ListView后面的一点的数据，所以滑动时的图片不需要加载，而只需加载最终我们等待加载的页面的图片，这些Glide框架都帮我们处理好了，不需要我们自己去实现这些代码。
- 完整代码已上传Github，如有疑问或表述有误的地方，欢迎在评论区交流。
- Github：https://github.com/TheCoffeeNoSugar/Novel
