ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

iOS一句代码搞定下拉刷新和上拉加载更多

2020-12-01 18:00:12  阅读:286  来源: 互联网

标签:搞定 tableView self iOS scrollView 刷新 refreshState newValue 加载


现在的iOS刷新控件层出不穷,但是想找到一个样式完全符合自己基本没有,所以利用空余时间自己实现了一个刷新的控件,通过一个demo来搞明白其中的原理。
先来个效果图
在这里插入图片描述

大概说一下设计思路,在scrollView的顶部和底部分别添加headerView和footView。通过KVO来监听scrollView的contentOffset、contentSize、bounds这个三个属性,根据contentOffset的改变来显示headerView和footView,监听contentSize的目的是让footView一直保持在最底部,监听bounds的作用是刷新headerView和footView的frame。
headerView和footView呈现的内容则是通过refreshState这个状态的改变分别显示不同的内容。代码如下

    override var refreshState: RefreshState? {
        willSet {
            tipsLabel?.isHidden = false
            loadingView?.isHidden = true
            if newValue == .Ready  {
                tipsLabel?.text = "下拉刷新"
            }else if newValue == .WillRefresh  {
                tipsLabel?.text = "松开立即刷新"
            }else if newValue == .Refreshing {
                tipsLabel?.isHidden = true
                loadingView?.isHidden = false
            }else {
                tipsLabel?.text = "刷新完成"
            }
        }
    }

核心代码,通过KVO监听属性的改变

    /// KVO监听contentOffset的变化
    override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
        if keyPath == RefreshView.contentOffsetKeyPath {
            if canRefresh == true && self.scrollView!.isDragging == false {
                if self.refreshState == .WillRefresh {
                    //松手进入刷新状态
                    self.refreshState = .Refreshing
                    if self.refresh != nil {
                        self.refresh!()
                    }
                    UIView.animate(withDuration: 0.5) {
                        self.scrollView?.contentInset.top = self.frame.size.height
                    }
                }
            }
            
            if self.scrollView!.isDragging == true {
                if self.refreshState != .Refreshing && self.refreshState != .Refreshed {
                    //非刷新状态下拖拽scrollView
                    if self.scrollView!.contentOffset.y <= -(self.frame.size.height  + 5) {
                        self.refreshState = .WillRefresh
                        self.canRefresh = true
                    }else {
                        self.refreshState = .Ready
                        self.canRefresh = false
                    }
                }
                
            }
        }else if keyPath == RefreshView.boundsKeyPath {
            //scrollView的bound发生改变
            let newValue: CGRect = change?[NSKeyValueChangeKey.newKey] as? CGRect ?? .zero
            let oleValue: CGRect = change?[NSKeyValueChangeKey.oldKey] as? CGRect ?? .zero
            if newValue.size.width != oleValue.size.width {
                self.frame.size.width = newValue.size.width
            }
        }
    }

使用,一句代码搞定

  • 刷新操作
        self.tableView.refreshHeaderView {
            //这里进行刷新操作
        }
        //结束刷新,如果处于没有更多数据状态下将自动重置
        self.tableView.refreshHeaderView?.endRefresh()
  • 加载更多操作
        self.tableView.refreshFootView {
            //这里进行加载更多操作
        }
        //结束加载更多
        self.tableView.refreshFootView?.endRefresh()
        
        //如果服务器没有更多数据返回,可以使用这个方法
        self.tableView.refreshFootView?.noMoreData()

最后附上demo

标签:搞定,tableView,self,iOS,scrollView,刷新,refreshState,newValue,加载
来源: https://blog.csdn.net/iOS_kyq/article/details/110438883

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有