pulltorefresh上拉加载以及下拉刷新

这里我是封装了一个上下拉的library,单纯的看的话不太懂,可以直接下载了自己去了解一下
http://download.csdn.net/detail/androidhaikuan/9691593
然后就是recyclerview的点击和长按监听,我是在适配器中做了个接口,然后通过接口回调实现的:
http://blog.csdn.net/huamnge/article/details/53691346

首先要导入pulltorefresh的library

然后是main.xml布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    //调用pulltorefreshi中的listview
    <com.handmark.pulltorefresh.library.PullToRefreshListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>  
</RelativeLayout>

在mainactivity中

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        listview= (PullToRefreshListView) findViewById(R.id.listview);
        // 设置pullToRefreshListView的刷新模式,BOTH代表支持上拉和下拉,PULL_FROM_END代表上拉,PULL_FROM_START代表下拉 */
        listview.setMode(PullToRefreshBase.Mode.BOTH);
        // 上下拉的监听
        listview.setOnRefreshListener(this);
        getXml();
    }

   //这是网络请求

   public void getXml() {
        new Thread(){
            @Override
            public void run() {
                super.run();
                try {
                    URL url=new URL("http://www.oschina.net/action/api/news_list?catalog=1&pageIndex=\"+ye+\"&pageSize=20");
                    HttpURLConnection urlConnection= (HttpURLConnection) url.openConnection();
                    urlConnection.setRequestMethod("GET");
                    int code=urlConnection.getResponseCode();
                    if (code==200) {
                        InputStream inputStream=urlConnection.getInputStream();
                        jieXml(inputStream);
                        //发送到handler进行解析(我这里就不写了)
                        handler.sendEmptyMessage(0);
                    }
                } catch (MalformedURLException e) {
                    e.printStackTrace();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }.start();
    }

这个是下拉刷新

@Override
    public void onPullDownToRefresh(PullToRefreshBase refreshView) {
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                ye=1;
                list.clear();
                getXml();
            }
        },1000);
        myadapter.notifyDataSetChanged();
        new FinishRefreshed().execute();
    }

这个是上拉加载

    @Override
    public void onPullUpToRefresh(PullToRefreshBase refreshView) {
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                ye++;
                getXml();
            }
        },1000);
        new FinishRefreshed().execute();
    }

内部类,写了上拉和下拉的时间

    private class FinishRefreshed extends AsyncTask<Void,Void,Void>{
        @Override
        protected Void doInBackground(Void... params) {
            try {
               //两秒
                Thread.sleep(2000);
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
            return null;
        }
        @Override
        protected void onPostExecute(Void aVoid) {
            //刷新listview
            listview.onRefreshComplete();
        }
    }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以使用iscroll的pullToRefresh和infiniteScroll插件来实现上拉加载下拉刷新功能。下面是一个简单的示例: ```html <div id="wrapper"> <div id="scroller"> <!-- 下拉刷新区域 --> <div class="pulldown-wrapper"> <div class="pullDown"> <span class="pullDownIcon"></span> <span class="pullDownLabel">下拉刷新...</span> </div> </div> <!-- 列表内容区域 --> <ul id="list"> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li>Item 5</li> </ul> <!-- 上拉加载区域 --> <div class="pullup-wrapper"> <div class="pullUp"> <span class="pullUpIcon"></span> <span class="pullUpLabel">上拉加载更多...</span> </div> </div> </div> </div> ``` CSS样式: ```css /* 滚动容器 */ #wrapper { position: relative; overflow: hidden; height: 200px; border: 1px solid #ccc; } /* 列表内容容器 */ #scroller ul { list-style: none; margin: 0; padding: 0; } /* 下拉刷新上拉加载提示容器 */ .pullup-wrapper, .pulldown-wrapper { position: absolute; width: 100%; height: 60px; overflow: hidden; } /* 下拉刷新提示容器 */ .pulldown-wrapper { top: -60px; } /* 上拉加载提示容器 */ .pullup-wrapper { bottom: -60px; } /* 下拉/上拉提示样式 */ .pullDown, .pullUp { height: 60px; line-height: 60px; text-align: center; font-size: 16px; color: #999; } .pullDownIcon, .pullUpIcon { width: 20px; height: 20px; display: inline-block; vertical-align: middle; margin-right: 10px; -webkit-animation: rotate .3s linear infinite; animation: rotate .3s linear infinite; } .pullUpIcon { background: url(icon-pullup.png) no-repeat center; background-size: contain; } .pullDownIcon { background: url(icon-pulldown.png) no-repeat center; background-size: contain; } .pullDownLabel { display: inline-block; } /* 下拉刷新动画 */ .down-flip, .down-flip .pullDownLabel { -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .down-flip .pullDownIcon { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } .down-flip .pullDownLabel { margin-left: 30px; } /* 上拉加载动画 */ .up-flip .pullUpIcon { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } .up-flip .pullUpLabel { margin-right: 30px; } /* 动画样式 */ @-webkit-keyframes rotate { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotate { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } ``` JavaScript代码: ```javascript var myScroll = new IScroll('#wrapper', { probeType: 3, // 开启滚动事件监听 mouseWheel: true, // 支持PC端滚轮滚动 scrollbars: false, // 隐藏滚动条 useTransition: false, // 不使用CSS3过渡效果 bounce: true, // 允许在顶部和底部弹跳 pullDownRefresh: true, // 开启下拉刷新功能 infiniteScroll: true, // 开启上拉加载功能 click: true // 允许元素点击事件 }); // 监听下拉刷新事件 myScroll.on('scroll', function () { if (this.y > 60) { // 超过60px,切换为释放刷新状态 $('.pulldown-wrapper').addClass('down-flip'); this.minScrollY = 60; } else { // 否则保持下拉刷新状态 $('.pulldown-wrapper').removeClass('down-flip'); this.minScrollY = 0; } }); myScroll.on('scrollEnd', function () { if ($('.pulldown-wrapper').hasClass('down-flip')) { // 如果处于释放刷新状态,则触发刷新事件 $('.pulldown-wrapper').addClass('loading'); setTimeout(function () { // 模拟2秒后数据加载完成 $('#list').prepend('<li>New item</li>'); // 重置下拉刷新状态 $('.pulldown-wrapper').removeClass('loading down-flip'); myScroll.refresh(); }, 2000); } }); // 监听上拉加载事件 myScroll.on('scroll', function () { if ((this.y - this.maxScrollY) < 60) { // 接近底部60px时,切换为释放加载状态 $('.pullup-wrapper').addClass('up-flip'); } else { // 否则保持上拉加载状态 $('.pullup-wrapper').removeClass('up-flip'); } }); myScroll.on('scrollEnd', function () { if ($('.pullup-wrapper').hasClass('up-flip')) { // 如果处于释放加载状态,则触发加载事件 $('.pullup-wrapper').addClass('loading'); setTimeout(function () { // 模拟2秒后数据加载完成 $('#list').append('<li>More item</li>'); // 重置上拉加载状态 $('.pullup-wrapper').removeClass('loading up-flip'); myScroll.refresh(); }, 2000); } }); ``` 上述代码实现的是一个简单的上拉加载下拉刷新功能,你可以根据自己的需求进行修改和扩展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值