iOS自定义下拉刷新控件

自定义下拉刷新控件

概述

用了很多的别人的下拉刷新控件，想写一个玩玩，自定义一个在使用的时候也会比较有意思。使应用更加的灵动一些，毕竟谁不喜欢各种动画恰到好处的应用呢。

使用方式如下：

tableview.refreshControl = XRefreshControl.init(refreshingBlock: {DispatchQueue.main.asyncAfter(deadline: .now() + 5) { [weak self] inself?.table.endRefreshing()}
})

下边展示一下效果。

在这里插入图片描述

然后又搞了一个比较炫酷的版本～，效果图如下：

在这里插入图片描述

继承 UIRefreshControl，然后再其上直接添加view就能实现需要的加载效果，尝试发现自定义的类需要把背景色设置一下，要不然会有一下拉整体都显示出来的问题，而且最好在view上再加一个view整体给铺上，在设置一个背景色，把小菊花给盖上。

简单版本代码

import Foundation
import UIKit
import SnapKitclass XRefreshControl: UIRefreshControl {var observation: NSKeyValueObservation?var isLocalRefreshing: Bool = falselet indicator = UIProgressView(progressViewStyle: .bar)var refreshingBlock: (()->Void)?override init(frame: CGRect) {super.init(frame: frame)observation = observe(\.frame,options: .new) { [weak self] object, change inif self?.isRefreshing == true {if self?.isLocalRefreshing == false {if self?.refreshingBlock != nil {self?.refreshingBlock!()}}self?.isLocalRefreshing = true} else {let height = change.newValue!.heightself?.indicator.progress = min(Float(abs(height / 60)), 1)}}}convenience init(refreshingBlock: @escaping ()->Void) {self.init(frame: .zero)self.refreshingBlock = refreshingBlockself.layer.masksToBounds = trueself.backgroundColor = .redlet v = UIView()v.backgroundColor = .redlet center = UIView()v.addSubview(center)let title = UILabel()title.text = "加载中"title.textColor = .blackcenter.addSubview(title)indicator.layer.masksToBounds = truecenter.addSubview(indicator)self.addSubview(v)v.snp.makeConstraints { make inmake.edges.equalToSuperview()}center.snp.makeConstraints { make inmake.center.equalToSuperview()make.width.equalToSuperview()}indicator.snp.makeConstraints { make inmake.top.equalToSuperview()make.width.height.equalTo(32)make.centerX.equalToSuperview()}title.snp.makeConstraints { make inmake.top.equalTo(indicator.snp.bottom)make.bottom.equalToSuperview()make.centerX.equalToSuperview()}}required init?(coder: NSCoder) {fatalError("init(coder:) has not been implemented")}deinit {observation = nil}override func endRefreshing() {super.endRefreshing()self.isLocalRefreshing = falseindicator.progress = 0}
}extension UITableView {func endRefreshing() {if ((self.refreshControl?.isKind(of: XRefreshControl.self)) != nil) {self.refreshControl?.endRefreshing()}}
}

加强版本代码

class XRefreshControl: UIRefreshControl {var observation: NSKeyValueObservation?var isLocalRefreshing: Bool = falselet indicator = UIProgressView(progressViewStyle: .bar)var refreshingBlock: (()->Void)?var displayLink: CADisplayLink?var targetDuration: CGFloat = 3var fireDate: Date = .nowvar endRefreshingDate: Date = .nowvar title = UILabel()var colors: [UIColor] = [UIColor(hex: "ffbe0b"),UIColor(hex: "fb5607"),UIColor(hex: "ff006e"),UIColor(hex: "8338ec"),UIColor(hex: "3a86ff"),]var speedViews: [UIView] = []var blockViews: [UIView] = []// 背景var contentView = UIView()override init(frame: CGRect) {super.init(frame: frame)observation = observe(\.frame,options: .new) { [weak self] object, change inif self?.isRefreshing == true {if self?.isLocalRefreshing == false {if self?.refreshingBlock != nil {self?.refreshingBlock!()}self?.startAnimation()}self?.isLocalRefreshing = true} else {let height = change.newValue!.heightself?.dragEffect(distance: height)}}}convenience init(refreshingBlock: @escaping ()->Void) {self.init(frame: .zero)self.refreshingBlock = refreshingBlockself.layer.masksToBounds = trueself.backgroundColor = .whitecontentView.backgroundColor = .redself.addSubview(contentView)let center = UIView()contentView.addSubview(center)title.text = "下拉加载"title.textColor = .blackcenter.addSubview(title)center.addSubview(indicator)for _ in 0...6 {let v = UIView()v.backgroundColor = .whitespeedViews.append(v)contentView.addSubview(v)}for _ in 0..<10 {let v = UIView()v.backgroundColor = .whiteblockViews.append(v)contentView.addSubview(v)}contentView.snp.makeConstraints { make inmake.edges.equalToSuperview()}center.snp.makeConstraints { make inmake.center.equalToSuperview()}indicator.snp.makeConstraints { make inmake.left.top.right.equalToSuperview()make.width.equalTo(120)make.height.equalTo(6)}title.snp.makeConstraints { make inmake.top.equalTo(indicator.snp.bottom).offset(10)make.bottom.equalToSuperview()make.centerX.equalToSuperview()}}required init?(coder: NSCoder) {fatalError("init(coder:) has not been implemented")}deinit {observation = nilself.displayLink?.remove(from: RunLoop.current, forMode: .common)}func dragEffect(distance: CGFloat) {let diff = abs(endRefreshingDate.timeIntervalSinceNow)if diff < 0.5 {return}let precent = min(abs(distance/140),1)let value = precent * 8 * CGFloat.piself.indicator.progress = 1let opacity = Float(sin(value))
//        print("opacity \(opacity)")self.indicator.layer.opacity = opacityself.title.text = "下拉加载"for i in 0..<3 {let xx = (self.frame.size.width / 12.0) * CGFloat(i+1)var yy = abs(distance/2)-2yy += sin(distance/10 + CGFloat(i+1)*10)*6speedViews[i].frame = .init(x: xx, y: yy, width: 2, height: 4)}for i in 3..<6 {var x = (self.frame.size.width / 12.0) * CGFloat(i+1-3)x += self.frame.width * 2.0 / 3.0var yy = abs(distance/2)-2yy += sin(distance/10 + CGFloat(i+1-3)*10)*6speedViews[i].frame = .init(x: x, y: yy, width: 2, height: 4)}for i in 0..<blockViews.count {blockViews[i].frame = .init(x: 0, y: 0, width: 0, height: 0)}}func startAnimation() {displayLink = CADisplayLink(target: self, selector: #selector(update))displayLink?.add(to: RunLoop.current, forMode: .common)fireDate = .nowself.indicator.layer.opacity = 1self.indicator.progress = 1self.title.text = "加载中"let width = self.frame.widthfor i in 0..<blockViews.count {let size = CGFloat.random(in: 4...8)let x = CGFloat.random(in: 0...width)blockViews[i].frame = .init(x: x, y: 0, width: size, height: size)}}@objc func update(_ displayLink: CADisplayLink) {let diff = abs(fireDate.timeIntervalSinceNow)var precent = diff / targetDurationprecent = min(precent, 1)self.indicator.progress = Float(precent)contentView.backgroundColor = colors[Int(diff*3)%colors.count]for i in 0..<3 {var xx = (self.frame.size.width / 12.0) * CGFloat(i+1)var yy = self.frame.height/2-12if i == 1 {yy += sin(CGFloat(diff)*6) * 2xx += sin(CGFloat(diff)*6)} else {yy += sin(CGFloat(diff)*6) * 4xx += sin(CGFloat(diff)*6 + CGFloat(i+1))}speedViews[i].frame = .init(x: xx, y: yy, width: 2, height: 24)}for i in 3..<6 {var xx = (self.frame.size.width / 12.0) * CGFloat(i+1-3)xx += self.frame.width * 2.0 / 3.0var yy = self.frame.height/2-12if i == 4 {yy += sin(CGFloat(diff)*6) * 2xx += sin(CGFloat(diff)*6)} else {yy += sin(CGFloat(diff)*6) * 4xx += sin(CGFloat(diff)*6 + CGFloat(i+1-3))}speedViews[i].frame = .init(x: xx, y: yy, width: 2, height: 24)}for i in 0..<self.blockViews.count {var x = self.blockViews[i].frame.origin.xvar y = self.blockViews[i].frame.origin.y + self.blockViews[i].frame.width / 4if y > self.contentView.frame.height {y = 0x = CGFloat.random(in: 0...self.contentView.frame.width)}self.blockViews[i].frame = .init(origin: .init(x: x, y: y), size: self.blockViews[i].frame.size)}}override func endRefreshing() {super.endRefreshing()self.isLocalRefreshing = falseself.displayLink?.remove(from: RunLoop.current, forMode: .common)endRefreshingDate = .nowself.title.text = "加载完毕"}
}
extension UITableView {func endRefreshing() {if ((self.refreshControl?.isKind(of: XRefreshControl.self)) != nil) {self.refreshControl?.endRefreshing()}}
}
extension UIColor {/// 使用 #FFFFFF 来初始化颜色convenience init(hex: String, alpha: CGFloat = 1.0) {var hexFormatted: String = hex.trimmingCharacters(in: CharacterSet.whitespacesAndNewlines).uppercased()if hexFormatted.hasPrefix("#") {hexFormatted = String(hexFormatted.dropFirst())}if hexFormatted.hasPrefix("0x") {hexFormatted = String(hexFormatted.dropFirst())hexFormatted = String(hexFormatted.dropFirst())}assert(hexFormatted.count == 6, "Invalid hex code used.")var rgbValue: UInt64 = 0Scanner(string: hexFormatted).scanHexInt64(&rgbValue)self.init(red: CGFloat((rgbValue & 0xFF0000) >> 16) / 255.0,green: CGFloat((rgbValue & 0x00FF00) >> 8) / 255.0,blue: CGFloat(rgbValue & 0x0000FF) / 255.0,alpha: alpha)}
}

参考地址

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/94611.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

定量分析计算51单片机复位电路工作原理 怎么计算单片机复位电容和电阻大小

定量分析计算51单片机复位电路工作原理 怎么计算单片机复位电容和电阻大小

下面画出等效电路图 可以知道单片机内必然有一个电阻RX&#xff0c;为了简化分析&#xff0c;我们假设他是线性电阻&#xff08;不带电容&#xff0c;电感的支路&#xff09; 还有一个基础知识&#xff1a; 电容器的充电放电曲线&#xff1a; 还需要知道电容电压的变化是连续…
阅读更多...
Data Abstract for .NET and Delphi Crack

Data Abstract for .NET and Delphi Crack

Data Abstract for .NET and Delphi Crack .NET和Delphi的数据摘要是一套或RAD工具&#xff0c;用于在.NET、Delphi和Mono中编写多层解决方案。NET和Delphi的数据摘要是一个套件&#xff0c;包括RemObjects.NET和Delphi版本的数据摘要。RemObjects Data Abstract允许您创建访问…
阅读更多...
【C++精华铺】7.C++内存管理

【C++精华铺】7.C++内存管理

目录 1. C语言动态内存管理 2. C内存管理方式 2.1 new/delete和new T[]/delete[] 2.1.1 操作内置类型 2.1.2 操作自定义类型 2.2 new/delete和new T[]/delete[]的原理 2.2.1 原理 2.2.2 operator new和operator delete 2.2.3 new T[]的特殊处理&#xff08;可以…
阅读更多...
docker的资源控制管理——Cgroups

docker的资源控制管理——Cgroups

目录 一、对CPU使用率的控制 1.1 CPU 资源控制 1.2 cgroups有四大功能 1.3 设置cpu使用率上限 查看周期限制和cpu配额限制 进行cpu压力测试然后修改每个周期的使用cpu的时间&#xff0c;查看cpu使用率 1.4 设置cpu资源占用比&#xff08;设置多个容器时才有效&#xf…
阅读更多...
chatserver服务器开发笔记

chatserver服务器开发笔记

chatserver服务器开发笔记 1 chatserver2 开发环境3 编译 1 chatserver 集群聊天服务器和客户端代码&#xff0c;基于muduo、redis、mysql实现。 学习于https://fixbug.ke.qq.com/ 本人已经挂github&#xff1a;https://github.com/ZixinChen-S/chatserver/tree/main 需要该项…
阅读更多...
数学建模之“灰色预测”模型

数学建模之“灰色预测”模型

灰色系统分析法在建模中的应用 1、CUMCM2003A SARS的传播问题 2、CUMCM2005A长江水质的评价和预测CUMCM2006A出版社的资源配置 3、CUMCM2006B艾滋病疗法的评价及疗效的预测问题 4、CUMCM2007A 中国人口增长预测 灰色系统的应用范畴大致分为以下几方面: (1&#xff09;灰色关…
阅读更多...
小航助学GESP_C++一级模拟测试卷第2套（含题库答题软件账号）

小航助学GESP_C++一级模拟测试卷第2套（含题库答题软件账号）

需要在线模拟训练的题库账号请点击 小航助学编程在线模拟试卷系统&#xff08;含题库答题软件账号&#xff09;_程序猿下山的博客-CSDN博客 需要在线模拟训练的题库账号请点击 小航助学编程在线模拟试卷系统&#xff08;含题库答题软件账号&#xff09;_程序猿下山的博客-CSD…
阅读更多...
Python实战之使用Python进行数据挖掘详解

Python实战之使用Python进行数据挖掘详解

一、Python数据挖掘 1.1 数据挖掘是什么&#xff1f; 数据挖掘是从大量的、不完全的、有噪声的、模糊的、随机的实际应用数据中&#xff0c;通过算法&#xff0c;找出其中的规律、知识、信息的过程。Python作为一门广泛应用的编程语言&#xff0c;拥有丰富的数据挖掘库&#…
阅读更多...
2023年国赛数学建模思路 - 案例：最短时间生产计划安排

2023年国赛数学建模思路 - 案例：最短时间生产计划安排

文章目录 0 赛题思路1 模型描述2 实例2.1 问题描述2.2 数学模型2.2.1 模型流程2.2.2 符号约定2.2.3 求解模型 2.3 相关代码2.4 模型求解结果 建模资料 0 赛题思路 &#xff08;赛题出来以后第一时间在CSDN分享&#xff09; https://blog.csdn.net/dc_sinor?typeblog 最短时…
阅读更多...
恒运资本：机构持仓比例多少是重仓？

恒运资本：机构持仓比例多少是重仓？

组织投资者关于股票商场的影响越来越大&#xff0c;其持股份额已成为点评一只股票好坏的重要目标之一。但组织持仓份额究竟多少才算是重仓呢&#xff1f;这涉及到许多要素&#xff0c;让我们从多个视点进行剖析。 1.不同组织的界说不同 首要需求注意的是&#xff0c;不同的组织…
阅读更多...
Mr. Cappuccino的第63杯咖啡——Spring之AnnotationConfigApplicationContext源码分析

Mr. Cappuccino的第63杯咖啡——Spring之AnnotationConfigApplicationContext源码分析

Spring之AnnotationConfigApplicationContext源码分析 源码分析 源码分析 以上一篇文章《Spring之Bean的生命周期》的代码进行源码分析 AnnotationConfigApplicationContext applicationContext new AnnotationConfigApplicationContext(SpringConfig02.class); LifeCycleBe…
阅读更多...
uniapp编写微信小程序遇到的坑总结

uniapp编写微信小程序遇到的坑总结

1、阻止事件冒泡 使用uniapp开发微信小程序的时候&#xff0c;发现使用click.stop来阻止事件冒泡没有作用&#xff0c;点击了之后发现仍然会触发父组件或者祖先组件的事件。 在网上查阅&#xff0c;发现使用tap.stop才能阻止事件冒泡。 2、二维码生成 在网上找了很多&…
阅读更多...
MQTT协议-EMQX技术文档-spring-boot整合使用--发送接收-消费

MQTT协议-EMQX技术文档-spring-boot整合使用--发送接收-消费

概念先行&#xff1a; mqtt与mq的关系 MQTT&#xff08;Message Queuing Telemetry Transport&#xff09;是一种基于发布/订阅模式的通信协议&#xff0c;它与MQ&#xff08;Message Queue&#xff0c;消息队列&#xff09;有一定的关联&#xff0c;但二者并不完全相同。 M…
阅读更多...
重发布 路由策略

重发布 路由策略

[r4]ip ip_prefix 15 permit 192.168.3.0 24. 根据序号插入规则 [r4]undo ip-prefix aa index 15. 删除规则 [r4]ip ip-prefix aa permit 192.168.3.0 24 less- equal 28 抓取目标网段为3.0掩码长度为24到28的路由 [r4]ip ip-prefix aa permit 192.168.3.0 24 greate…
阅读更多...
【K8S系列】Weave Net 故障排除的常见问题和解决方案

【K8S系列】Weave Net 故障排除的常见问题和解决方案

写在前面 当使用 Weave Net 进行容器网络配置时&#xff0c;可能会遇到一些常见的故障情况。以下是一些常见问题及其解决方案&#xff1a; 问题列表 1 节点无法加入 Weave Net 网络 解决方案 检查节点之间的网络连通性&#xff0c;确保可以通过 IP 地址相互访问。 检查节点的…
阅读更多...
大模型时代，图像描述生成（image caption）怎么走？

大模型时代，图像描述生成（image caption）怎么走？

背景 Image caption是计算机视觉研究领域中的一个重要分支&#xff0c;其主要目标是根据输入的图像信息&#xff0c;生成相应的文字描述&#xff0c;从而完成对图像内容的准确描述。对于图像描述任务而言&#xff0c;最关键的是能够将图片中的信息以清晰准确的文字形式展现出来…
阅读更多...
基于python+MobileNetV2算法模型实现一个图像识别分类系统

基于python+MobileNetV2算法模型实现一个图像识别分类系统

一、目录 算法模型介绍模型使用训练模型评估项目扩展 二、算法模型介绍 图像识别是计算机视觉领域的重要研究方向&#xff0c;它在人脸识别、物体检测、图像分类等领域有着广泛的应用。随着移动设备的普及和计算资源的限制&#xff0c;设计高效的图像识别算法变得尤为重要。…
阅读更多...
Android DataStore：安全存储和轻松管理数据

Android DataStore：安全存储和轻松管理数据

关于作者&#xff1a;CSDN内容合伙人、技术专家&#xff0c; 从零开始做日活千万级APP。 专注于分享各领域原创系列文章 &#xff0c;擅长java后端、移动开发、人工智能等&#xff0c;希望大家多多支持。 目录 一、导读二、概览三、使用3.1 Preferences DataStore添加依赖数据读…
阅读更多...
解决校园网使用vmware桥接模式，虚拟机与物理机互相ping通，但是虚拟机ping不通百度的问题

解决校园网使用vmware桥接模式，虚拟机与物理机互相ping通，但是虚拟机ping不通百度的问题

遇到的问题 使用校园网时&#xff0c;桥接模式下&#xff0c;物理机可以ping通虚拟机&#xff0c;但是虚拟机ping不通主机 解决方法 在物理机中查看网络相关信息 ipconfig 修改虚拟机网卡信息 vim /etc/sysconfig/network-scripts/ifcfg-ens33 注意 /ifcfg-ens33需要根据…
阅读更多...
批次效应分析

批次效应分析

写在前面 批次效应分析，在医学芯片研究中，使用不同芯片进行分析时常用的数据处理方式，但是很多同学处理后的数据，存在不满意的情况。因此，到处咨询，各种查教程。今天，使用简短的时间分享该数据处理教程。 最终分析结果 欢迎投稿 小杜一直在分享自己平时学习笔记，因此…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023