首页 > 移动开发 > Android 下拉刷新上拉加载效果功能

Android 下拉刷新上拉加载效果功能

应用场景:

在App开发中,对于信息的获取与演示,不可能全部将其获取与演示,为了在用户使用中,给予用户以友好、方便的用户体验,以滑动、下拉的效果动态加载数据的要求就会出现。为此,该效果功能就需要应用到所需要的展示页面中。

知识点介绍:

本文主要根据开源项目android-pulltorefresh展开介绍。
android-pulltorefresh
【一个强大的拉动刷新开源项目,支持各种控件下拉刷新 ListView、ViewPager、WevView、ExpandableListView、GridView、(Horizontal )ScrollView、Fragment上下左右拉动刷新,比下面johannilsson那个只支持ListView的强大的多。并且他实现的下拉刷新ListView在item不足一屏情况下也不会显示刷新提示,体验更好。】
 
项目地址:
https://github.com/chrisbanes/Android-PullToRefresh 
Demo地址:
https://github.com/Trinea/TrineaDownload/blob/master/pull-to-refreshview-demo.apk?raw=true 

使用方式:

第一步:新建Android工程SampleDemo
第二步:在res/values下新建attrs.xml
[html]

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <resources>  
  3.     <declare-styleable name="PullToRefresh">  
  4.         <attr name="mode" format="reference" >  
  5.             <flag name="pullDownFromTop" value="0x1" />  
  6.             <flag name="pullUpFromBottom" value="0x2" />  
  7.             <flag name="both" value="0x3" />  
  8.         </attr>  
  9.     </declare-styleable>  
  10. </resources>  
  11. srings.xml  
  12. <?xml version="1.0" encoding="utf-8"?>  
  13. <resources>  
  14.     <string name="app_name">SampleDemo</string>  
  15.     <string name="action_settings">Settings</string>  
  16.     <string name="pull_to_refresh_pull_down_label">滑动刷新</string>  
  17.     <string name="pull_to_refresh_release_label">释放刷新</string>  
  18.     <string name="pull_to_refresh_refreshing_label">加载中</string>  
  19.     <string name="pull_to_refresh_tap_label">点击刷新</string>  
  20. </resources>  

第三步:将所需要的图片文件放入相应的文件夹下面,所用的图片文件有:


第四步:
1、导入或将开源项目android-pulltorefresh中需要的类文件(.java),加入到自己的项目中的指定包内。
该演示用例涉及的类文件为:
【library\src\com\handmark\pulltorefresh\library】
PullToRefreshAdapterViewBase.java
PullToRefreshBase.java
PullToRefreshListView.java
【library\src\com\handmark\pulltorefresh\library\internal】
EmptyViewMethodAccessor.java
LoadingLayout.java
2、构建自己所需要的类文件(.java)。
【PullTask.java】
[java]

  1. import java.util.LinkedList;  
  2.   
  3. import com.example.sampledemo.view.PullToRefreshListView;  
  4.   
  5. import android.os.AsyncTask;  
  6. import android.widget.BaseAdapter;  
  7.   
  8. public class PullTask extends AsyncTask<Void, Void, String>{  
  9.   
  10.     private PullToRefreshListView pullToRefreshListView;  //实现下拉刷新与上拉加载的ListView  
  11.     private int pullState;               //记录判断,上拉与下拉动作  
  12.     private BaseAdapter baseAdapter;     //ListView适配器,用于提醒ListView数据已经更新  
  13.     private LinkedList<String> linkedList;  
  14.       
  15.     public PullTask(PullToRefreshListView pullToRefreshListView, int pullState,  
  16.             BaseAdapter baseAdapter, LinkedList<String> linkedList) {  
  17.         this.pullToRefreshListView = pullToRefreshListView;  
  18.         this.pullState = pullState;  
  19.         this.baseAdapter = baseAdapter;  
  20.         this.linkedList = linkedList;  
  21.     }  
  22.       
  23.     @Override  
  24.     protected String doInBackground(Void... params) {  
  25.         try {  
  26.             Thread.sleep(1000);  
  27.         } catch (InterruptedException e) {  
  28.         }  
  29.         return "StringTest";  
  30.     }  
  31.   
  32.     @Override  
  33.     protected void onPostExecute(String result) {  
  34.         if(pullState == 1) {//name="pullDownFromTop" value="0x1" 下拉  
  35.             linkedList.addFirst("顶部数据");  
  36.         }  
  37.         if(pullState == 2) {//name="pullUpFromBottom" value="0x2" 上拉  
  38.             linkedList.addLast("底部数据");  
  39.         }  
  40.         baseAdapter.notifyDataSetChanged();  
  41.         pullToRefreshListView.onRefreshComplete();  
  42.         super.onPostExecute(result);  
  43.     }  
  44. }  

【PullAdapter.java】

[java]

  1. import java.util.LinkedList;  
  2.   
  3. import com.example.sampledemo.R;  
  4.   
  5. import android.content.Context;  
  6. import android.view.LayoutInflater;  
  7. import android.view.View;  
  8. import android.view.ViewGroup;  
  9. import android.widget.BaseAdapter;  
  10. import android.widget.TextView;  
  11.   
  12. public class PullAdapter extends BaseAdapter {  
  13.   
  14.     private LinkedList<String> linkedList;  
  15.     private LayoutInflater mInflater;  
  16.       
  17.     public PullAdapter(LinkedList<String> linkedList, Context context) {  
  18.         mInflater = LayoutInflater.from(context);  
  19.         this.linkedList = linkedList;  
  20.     }  
  21.       
  22.     @Override  
  23.     public int getCount() {  
  24.         return linkedList.size();  
  25.     }  
  26.   
  27.     @Override  
  28.     public Object getItem(int position) {  
  29.         return linkedList.get(position);  
  30.     }  
  31.   
  32.     @Override  
  33.     public long getItemId(int position) {  
  34.         return position;  
  35.     }  
  36.   
  37.     @Override  
  38.     public View getView(int position, View convertView, ViewGroup parent) {  
  39.         ViewHolder holder=null;  
  40.   
  41.         if (convertView == null) {  
  42.             holder = new ViewHolder();  
  43.             convertView = mInflater.inflate(R.layout.layout_main_listitem, null);  
  44.             holder.textView = (TextView) convertView.findViewById(R.id.textView);  
  45.             convertView.setTag(holder);  
  46.         }else {  
  47.             holder = (ViewHolder) convertView.getTag();  
  48.         }  
  49.         if(linkedList.size()>0){  
  50.             final String dataStr = linkedList.get(position);  
  51.             holder.textView.setText(dataStr);  
  52.         }  
  53.         return convertView;  
  54.     }  
  55.   
  56.     private static class ViewHolder {  
  57.         TextView textView;        //数据显示区域  
  58.     }  
  59. }  

第四步:为PullAdapter.java 设计布局文件layout_main_listitem.xml

[html]

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:background="#FFFFFF"  
  6.     android:orientation="vertical" >  
  7.     <TextView  
  8.         android:id="@+id/textView"  
  9.         android:textColor="#99CC66"  
  10.         android:textSize="18dp"  
  11.         android:layout_marginTop="4dp"  
  12.         android:layout_width="match_parent"  
  13.         android:layout_height="wrap_content"  
  14.         android:gravity="left" />  
  15. </LinearLayout>  

滑动时出现提醒布局文件pull_to_refresh_header.xml

[html]

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:paddingTop="10dp"  
  6.     android:paddingBottom="10dip">  
  7.      <TextView  
  8.         android:id="@+id/pull_to_refresh_text"  
  9.         android:text="@string/pull_to_refresh_pull_down_label"  
  10.         android:textAppearance="?android:attr/textAppearanceMedium"  
  11.         android:textStyle="bold"  
  12.         android:layout_width="wrap_content"  
  13.         android:layout_height="wrap_content"  
  14.         android:layout_centerInParent="true" />  
  15.     <ProgressBar  
  16.         android:id="@+id/pull_to_refresh_progress"  
  17.         android:indeterminate="true"  
  18.         android:layout_width="wrap_content"  
  19.         android:layout_height="wrap_content"  
  20.         android:layout_marginLeft="30dip"  
  21.         android:layout_marginRight="20dip"  
  22.         android:visibility="gone"  
  23.         android:layout_centerVertical="true"  
  24.         style="?android:attr/progressBarStyleSmall" />   
  25.     <ImageView  
  26.         android:id="@+id/pull_to_refresh_image"  
  27.         android:layout_width="wrap_content"  
  28.         android:layout_height="wrap_content"  
  29.         android:layout_marginLeft="30dip"  
  30.         android:layout_marginRight="20dip"  
  31.         android:layout_centerVertical="true" />  
  32. </RelativeLayout>  

MainActivity.java 主布局文件activity_main.xml

[html]

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.  xmlns:cp="http://schemas.android.com/apk/res/com.example.sampledemo"  
  4.     android:layout_width="match_parent"  
  5.     android:background="#FFFFFF"  
  6.     android:layout_height="match_parent">  
  7.     <com.example.sampledemo.view.PullToRefreshListView  
  8.         android:id="@+id/pullrefresh"  
  9.         android:background="#FFFFFF"  
  10.          android:layout_width="fill_parent"  
  11.          android:layout_height="fill_parent"  
  12.          android:divider="@android:color/black"  
  13.             android:dividerHeight="0.1dip"  
  14.             android:cacheColorHint="#00000000"   
  15.         cp:mode="both">  
  16.     </com.example.sampledemo.view.PullToRefreshListView>  
  17. </RelativeLayout>  

第五步:编写MainActivity.java

[java]

  1. import java.util.Arrays;  
  2. import java.util.LinkedList;  
  3.   
  4. import com.example.sampledemo.view.PullToRefreshBase.OnRefreshListener;  
  5. import com.example.sampledemo.view.PullToRefreshListView;  
  6. import com.example.sampledemo.view.adapter.PullAdapter;  
  7. import com.example.sampledemo.view.task.PullTask;  
  8.   
  9. import android.os.Bundle;  
  10. import android.widget.ArrayAdapter;  
  11. import android.widget.ListView;  
  12. import android.app.Activity;  
  13. /** 
  14.  * @ClassName MainActivity.java 
  15.  * @Author MaHaochen 
  16.  * @Date 2014-4-30 15:56:47 
  17.  */  
  18. public class MainActivity extends Activity {  
  19.     private LinkedList<String> mListItems;  
  20.     private PullToRefreshListView mPullRefreshListView;  
  21.     private ArrayAdapter<String> mAdapter;  
  22.     private ListView mListView;  
  23.     private PullAdapter pullAdapter;  
  24.     private String[] mStrings = { "初始数据01","初始数据02","初始数据03","初始数据04","初始数据05"   
  25.   
  26. };  
  27.       
  28.     @Override  
  29.     protected void onCreate(Bundle savedInstanceState) {  
  30.         super.onCreate(savedInstanceState);  
  31.         setContentView(R.layout.activity_main);  
  32.         initViews();  
  33.     }  
  34.   
  35.     private void initViews() {  
  36.         mPullRefreshListView = (PullToRefreshListView) findViewById(R.id.pullrefresh);  
  37.         mPullRefreshListView.setOnRefreshListener(mOnrefreshListener);  
  38.         mListView = mPullRefreshListView.getRefreshableView();  
  39.         mListItems = new LinkedList<String>();  
  40.         mListItems.addAll(Arrays.asList(mStrings));  
  41.         pullAdapter = new PullAdapter(mListItems, MainActivity.

    本文固定链接: http://www.devba.com/index.php/archives/5628.html | 开发吧

报歉!评论已关闭.