Swift-MJRefresh下拉刷新及上拉加载实践

Hello,今天给各位带来GitHub非常火一个第三方插件MJRefresh,有小码哥制作的,崇拜一下。。。


1、下载地址:https://github.com/CoderMJLee/MJRefresh  下载解压后将一下MJRefresh文件夹复制到你的Swift工程中,包含以下几个文件:

Base文件夹                   Custom文件夹
MJRefresh.bundle            MJRefresh.h
MJRefreshConst.h            MJRefreshConst.m
UIScrollView+MJExtension.h  UIScrollView+MJExtension.m
UIScrollView+MJRefresh.h    UIScrollView+MJRefresh.m
UIView+MJExtension.h        UIView+MJExtension.m

2、在工程的桥接文件中添加如下代码:(如何创建桥接文件:右键工程-->创建普通OC文件,名称随意起-->创建成功,会提示是否创建桥接文件-->点击是,会创建一个以"工程名-Bridging-Header.h"的.h文件,这就是你的桥接文件。)

//下来刷新及上拉加载MJRefresh
#import "MJRefresh.h"

3、然后就上代码吧,下面实现了最基本的带文字刷新及加载,同时实现了带图片的下拉刷新及上拉加载。(图片文件在下载MJRefresh插件demo工程中,请自取。)
//
//  NavigationViewController.swift
//  Yundou
//
//  Created by Slow on 16/1/3.
//  Copyright © 2016年 Slow. All rights reserved.
//

import UIKit

class ViewController: UIViewController,UITableViewDelegate,UITableViewDataSource {

    var tableView:UITableView!
    var idleImages:NSMutableArray = []
    var refreshingImages:NSMutableArray = []
    var objectArr = [String]()
    var i = 0
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        self.tableView = UITableView(frame: self.view.frame)
        self.view.addSubview(self.tableView)
        self.tableView.delegate = self
        self.tableView.dataSource = self
        
        //注册tableViewCell
        self.tableView.registerClass(UITableViewCell.classForCoder(), forCellReuseIdentifier: "cell")
        //去除无数据的空tableViewCell
        self.tableView.tableFooterView = UIView()
        
        for i ; i<10 ; i++ {
            self.objectArr.append("\(i)")
        }
        
        // 设置普通状态的动画图片
        for (var i = 1; i<=60; i++) {
            var image:UIImage = UIImage(named: "dropdown_anim__000\(i)")! as UIImage
            idleImages.addObject(image)
        }
        
        // 设置普通状态的动画图片
        for (var i = 1; i<=3; i++) {
            var image: UIImage = UIImage(named: "dropdown_loading_0\(i)")! as UIImage
            idleImages.addObject(image)
        }
        
        //定义动画刷新Header
        let header:MJRefreshGifHeader = MJRefreshGifHeader(refreshingTarget: self, refreshingAction: "headerRefresh")
        //设置普通状态动画图片
        header.setImages(idleImages as [AnyObject], forState: MJRefreshState.Idle)
        //设置下拉操作时动画图片
        header.setImages(refreshingImages as [AnyObject], forState: MJRefreshState.Pulling)
        //设置正在刷新时动画图片
        header.setImages(idleImages as [AnyObject], forState: MJRefreshState.Refreshing)
        
        //设置mj_header
        self.tableView.mj_header = header
        //普通带文字下拉刷新的定义
//        self.tableView.mj_header = MJRefreshNormalHeader(refreshingTarget: self, refreshingAction: "headerRefresh")
        //普通带文字上拉加载的定义
//        self.tableView.mj_footer = MJRefreshAutoNormalFooter(refreshingTarget: self, refreshingAction: "footerRefresh")
    
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    //定义表格有多少行
    func numberOfSectionsInTableView(tableView: UITableView) -> Int{
        return 1
    }
    
    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int{
        return objectArr.count
    }
    
    //定义tableViewCell样式
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("cell",forIndexPath:indexPath) as UITableViewCell
        
        cell.textLabel?.text = "第\(self.objectArr[indexPath.row])行"
        
        return cell
        
    }
    
    //下拉刷新操作
    func headerRefresh(){
        //模拟数据请求,设置10s是为了便于观察动画
        self.delay(10) { () -> () in
            self.objectArr.removeAll()
            self.i = 10
            for self.i ; self.i<20 ; self.i++ {
                self.objectArr.append("\(self.i)")
            }
            //结束刷新
            self.tableView.mj_header.endRefreshing()
            self.tableView.reloadData()
        }
    }
    
    //上拉加载操作
    func footerRefresh(){
        //模拟数据请求,设置10s是为了便于观察动画
        self.delay(10) { () -> () in
            let j = self.i + 10
            for self.i ; self.i<j ; self.i++ {
                self.objectArr.append("\(self.i)")
            }
            //结束刷新
            self.tableView.mj_footer.endRefreshing()
            self.tableView.reloadData()
        }
    }

    //延迟方法
    func delay(time:Double,closure:() -> ()){
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, Int64(time * Double(NSEC_PER_SEC))), dispatch_get_main_queue(), closure)
    }
}


  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
SwiftUI 中,可以使用 `List` 或 `ScrollView` 来显示可滚动的列表或视图。为了添加下拉刷新功能,可以使用 `UIRefreshControl`。 首先,需要创建一个 `UIRefreshControl` 的实例,然后将其添加到 `List` 或 `ScrollView` 中。在用户下列表时,`UIRefreshControl` 会触发一个动作。在该动作中,可以执行更新数据的操作,并结束下拉刷新。 下面是一个示例代码,演示如何在 SwiftUI 中使用 `UIRefreshControl` 实现下拉刷新: ```swift import SwiftUI struct ContentView: View { @State private var isRefreshing = false @State private var data = ["Item 1", "Item 2", "Item 3"] var body: some View { List(data, id: \.self) { item in Text(item) } .onPullToRefresh(isRefreshing: $isRefreshing) { // Simulate a network request DispatchQueue.main.asyncAfter(deadline: .now() + 2) { self.data = ["New Item 1", "New Item 2", "New Item 3"] self.isRefreshing = false } } } } extension View { func onPullToRefresh(isRefreshing: Binding<Bool>, action: @escaping () -> Void) -> some View { ModifiedContent(content: self, modifier: PullToRefresh(isRefreshing: isRefreshing, action: action)) } } struct PullToRefresh: ViewModifier { @Binding var isRefreshing: Bool var action: () -> Void func body(content: Content) -> some View { content .overlay( GeometryReader { geometry in VStack { if self.isRefreshing { ActivityIndicator(isAnimating: .constant(true), style: .medium) } else { Color.clear } } .frame(width: geometry.size.width, height: 60, alignment: .center) .offset(y: -60) }, alignment: .bottom ) .onAppear { let refreshControl = UIRefreshControl() refreshControl.addTarget(self, action: #selector(self.onRefresh), for: .valueChanged) UITableView.appearance().refreshControl = refreshControl } } @objc private func onRefresh() { isRefreshing = true action() } } struct ActivityIndicator: UIViewRepresentable { @Binding var isAnimating: Bool let style: UIActivityIndicatorView.Style func makeUIView(context: UIViewRepresentableContext<ActivityIndicator>) -> UIActivityIndicatorView { UIActivityIndicatorView(style: style) } func updateUIView(_ uiView: UIActivityIndicatorView, context: UIViewRepresentableContext<ActivityIndicator>) { isAnimating ? uiView.startAnimating() : uiView.stopAnimating() } } ``` 在该示例中,我们使用 `List` 显示一个简单的字符串列表。我们添加了一个名为 `onPullToRefresh` 的自定义修饰符,用于在 `List` 上添加下拉刷新功能。该修饰符接受两个参数:一个布尔绑定,用于控制刷新控件的状态;一个闭包,用于执行更新数据的操作。 在该示例中,我们使用 `GeometryReader` 将一个 `ActivityIndicatorView` 添加到列表头部。当用户下列表时,`UIRefreshControl` 会触发一个动作,在该动作中,我们将布尔绑定设置为 `true`,然后执行更新数据的操作。当数据更新完成后,我们将布尔绑定设置为 `false`,结束下拉刷新。 请注意,由于 SwiftUI 中的 `List` 是基于 `UITableView` 实现的,因此我们需要使用 `UITableView` 的 `refreshControl` 属性来添加 `UIRefreshControl`。在 `onAppear` 中,我们设置了 `UITableView` 的 `refreshControl` 属性,将其与我们创建的 `UIRefreshControl` 实例关联起来。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值