首页 > 其他分享 >iOS气泡提示工具BubblePopup的使用

iOS气泡提示工具BubblePopup的使用

时间:2023-06-09 12:25:27浏览次数:32  
标签:虚线 BubblePopup 子类 iOS bubblePopup 基类 弹窗 气泡

  在平时的开发中,通常新手引导页或功能提示页会出现气泡弹窗来做提示。如果遇到了这类功能通常需要花费一定的精力来写这么一个工具的,这里写了一个气泡弹窗工具,希望能帮你提升一些开发效率。   使用方法 1.从gitHub上下载代码到本地,代码地址:https://github.com/zhfei/BubblePopup 2.调用BubblePopupManager文件内的单例方法,在指定的页面上添加气泡提示。 普通文本气泡弹窗使用方式如下:

BubblePopupManager.shared.addPopup(toView: self.view, tips: "冒泡弹窗", popupType: .dotLine, positionType: .bottom, popupPoint: nil, linkPoint: CGPoint(x: sender.frame.midX, y: sender.frame.minY), maxWidth: 200.0)
自定义View气泡弹窗使用方式如下:
BubblePopupManager.shared.addPopup(toView: self.view, customContentView: MyContentView(), popupType: .triangle, positionType: .bottom, popupPoint: CGPoint(x: sender.frame.midX, y: sender.frame.minY), linkPoint: nil, maxWidth: 200.0)
 注意:自定义内容View只能使用frame布局,不能使用约束。   设计模式 气泡弹窗View的结构设计采用的设计模式为组合模式 把气泡弹窗分为3个部分:气泡背景,气泡指示器,气泡提示内容。 在创建气泡弹窗时,根据子类的自定义实现,将这三部分分别创建并组装到一起。实现了功能的灵活插拔和自定义扩展。

气泡弹窗生成算法采用的设计模式为模版方法模式 在气泡构建基类中设置好气泡的构建步骤,把必要的部分或者提供默认实现的部分在父类中提供默认的实现,对其他需要自定义实现的部分,只在父类中写了一个抽象方法,具体实现交给子类自己实现。 虚线气泡弹窗类图

三角形气泡弹窗类图

  核心实现 BubblePopupManager: 使用气泡弹窗工具的入口,通过它创建并添加一个气泡弹窗到指定的View上。 BubblePopupBuilder: 气泡弹窗构建者基类,使用模版方法模式定义了气泡的构建流程,子类可以自定义各自的实现。 DotLineBubblePopupBuilder:虚线气泡弹窗基类,它是基类BubblePopupBuilder的子类,内部包含了虚线气泡弹窗生成时所需要的工具方法和必要属性,方便创建top,bottom,left,right虚线气泡弹窗。 TriangleBubblePopupBuilder :三角形气泡弹窗基类,它是BubblePopupBuilder的子类,内部包含了三角形气泡弹窗生成时所需要的工具方法和必要属性,方便创建top,bottom,left,right三角形气泡弹窗 BubblePopup:气泡弹窗View,它内部使用组合模式将子部件组合起来,组成了一个气泡弹窗。 BubbleViewFactory: 气泡弹窗子视图创建工程,用于创建气泡弹窗所需要的子视图,并将各个子视图组装成一个最终的气泡弹窗。
BubblePopupBuilder BubblePopupBuilder是所有气泡弹窗的公共基类,对于里面定义的属性和方法的功能分别为 属性:属性里保存的是气泡弹窗公共的,必要的数据。 方法:在基类提供的方法中主要用于定义气泡的构建流程。 核心方法如下:
func setupUI() {
    addBubbleContentView(to: bubblePopup)
    addBubbleBGView(to: bubblePopup)
    updateLayout(to: bubblePopup)
    addBubbleFlagView(to: bubblePopup)
}
其中气泡内容展示视图和气泡背景视图有默认实现,子类可以直接使用默认样式。 而气泡标识View和气泡布局方法则需要子类自己实现,因为不同类型的气泡弹窗它们的气泡标识设布局方式是不一样的。
DotLineBubblePopupBuilder 虚线气泡基类DotLineBubblePopupBuilder,它继承自BubblePopupBuilder 属性:增加了虚线弹窗必要的linkPoint属性,即:虚线与气泡弹窗的连接点。 增加了一个坐标系转换懒加载属性,用于将用户设置的屏幕坐标点转成气泡内部的视图坐标系中的点。 重要方法说明:
getDrawDotLineLayerRectParams
用于虚线图层绘制:获取虚线绘制时所需要的绘制元素坐标,如:虚线的开始,结束坐标,连接点圆的直径等。
getDotLineLayerContainerViewFrame
更新虚线容器View的位置大小信息:获取不同情况下的虚线容器Frame。
layoutDotLineBubblePopupView
更新虚线气泡弹窗的frame。
updateBGBubbleViewFrame
更新气泡背景的frame。
这里提供的方法属于工具方法,子类可以通过传递自己的类型来得到对应的结果。这里按道理可以使用设计模式中策略模式来对算法进行封装,如:在基类定义一个抽象方法,将上面则4个工具方法分拆到各自的子类中,让子类在对应的自己的类中实现这个方法。 这里没有这样做原因是:这些方法在子类中的实现代码并不复杂,用一个方法根据条件集中返回是比较方便的,而分拆到不同类中反而很麻烦。所以选择在基类中以方法工具的形式统一放置了。
DotLineTopBubblePopupBuilder top型虚线气泡弹窗DotLineTopBubblePopupBuilder,它继承自DotLineBubblePopupBuilder,属于一直具体的弹窗类型。 它里面只对下面两个方法进行了重写,根据自己的类型进行子类个性化实现。
override func updateLayout
override func addBubbleFlagView

具体实现如下:

class DotLineTopBubblePopupBuilder: DotLineBubblePopupBuilder {
    
    override func updateLayout(to bubblePopup: BubblePopup) {
        layoutDotLineBubblePopupView(bubblePopup: bubblePopup, positionType: .top)
    }
    
    override func addBubbleFlagView(to bubblePopup: BubblePopup) {
        assert(!self.targetPoint.equalTo(.zero), "气泡提示点无效")
        
        let flagFrame = getDotLineLayerContainerViewFrame(position: .top, targetPoint: self.targetPoint)
        let params = getDrawDotLineLayerRectParams(position: .top)
        let flagBubbleView = BubbleViewFactory.generateDotLineBubbleFlagView(flagFrame: flagFrame, position: .top, params: params)
        bubblePopup.bubbleFlagView = flagBubbleView
        bubblePopup.addSubview(flagBubbleView)
    }
    
}
其他bottom, left, right类型相似。
TriangleBubblePopupBuilder 三角形气泡基类TriangleBubblePopupBuilder,它继承自BubblePopupBuilder  属性:相对于基类增加了popupPoint属性,它是三角形顶点指向的坐标点 增加了一个坐标系转换懒加载属性,用于将用户设置的屏幕坐标点转成气泡内部的视图坐标系中的点。 重要方法说明:
getDrawTriangleLayeyRectParams
为三角形图层绘制提供不同气泡类型所需要的绘制元素坐标,如:三角形的三个顶点。
getTriangleLayerContainerViewFrame
获取不同情况下三角形图层容器的Frame,用于更新三角形图层容器View的位置大小。
layoutTriangleBubblePopupView
更新三角形气泡弹窗的frame。
updateTriangleBGBubbleView
更新气泡背景的frame。
三角形弹窗基类TriangleBubblePopupBuilder的设计方式和虚线弹窗基类是一样的。 这里的方法属于工具方法,子类可以通过传递自己的类型来得到对应的结果,通过牺牲一点开发模式的规范化来换取开发效率的提升。 在三角形气泡基类的下面同样有4个子类top,bottom,left ,right进行各种的自定义实现。
TriangleTopBubblePopupBuilder top型三角形气泡弹窗DotLineTopBubblePopupBuilder,它继承自DotLineBubblePopupBuilder,属于一直具体的弹窗类型。
它里面只对下面这两个方法做了重写,根据自己的类型进行子类个性化实现。
override func updateLayout
override func addBubbleFlagView
具体实现如下:
class TriangleTopBubblePopupBuilder: TriangleBubblePopupBuilder {
    override func updateLayout(to bubblePopup: BubblePopup) {
        layoutTriangleBubblePopupView(bubblePopup: bubblePopup, positionType: .top)
    }
    override func addBubbleFlagView(to bubblePopup: BubblePopup) {
        assert(!self.targetPoint.equalTo(.zero), "气泡提示点无效")
        
        let flagFrame = getTriangleLayerContainerViewFrame(position: .top, targetPoint: self.targetPoint)
        let params = getDrawTriangleLayeyRectParams(position: .top)
        let flagBubbleView = BubbleViewFactory.generateTriangleBubbleFlagView(flagFrame: flagFrame, position: .top, params: params)
        bubblePopup.bubbleFlagView = flagBubbleView
        bubblePopup.addSubview(flagBubbleView)
    }
}
其他bottom, left, right类型相似。   弹窗效果展示 三角形气泡弹窗  

虚线气泡弹窗

自定义气泡弹窗

 

 

 

标签:虚线,BubblePopup,子类,iOS,bubblePopup,基类,弹窗,气泡
From: https://www.cnblogs.com/zhou--fei/p/17468906.html

相关文章

  • 使用axios的post方法传输对象数据和后台数据进行解析判断
    使用vue的v-model绑定生成对象数据的通过axios传输数据操作的时候,对象中属性的命名必须和实体中的一致。实体:privateIntegerid;privateStringname;privateStringnickname;privateStringpassword;privateIntegerage;privateStringgend......
  • [Animations] 快速上手 iOS10 属性动画
    概述今天要说的UIViewPropertyAnimator,是iOS10新的API详细基础动画,核心动画到自定义转场动画其实都不是什么新东西了,所以我也是草草看一遍就能够读个大概,但今天要说的UIViewPropertyAnimator,是iOS10新的API,其他的好处我还不太清楚,但抽象动画逻辑和监控......
  • iOS微信支付集成
    概述iOS微信支付集成详细支付宝和微信都是业界的老大哥,相信大家都有所觉得文档、SDK都是各种坑吧(纯粹吐槽而已),这是继上篇支付宝支付集成后接着的微信支付集成。一、准备工作1、微信商户申请步骤申请步骤: http://kf.qq.com/faq/120911VrYVrA150906F3qqY3.html2、申......
  • iOS支付宝支付集成
    概述iOS支付宝支付集成详细支付宝和微信都是业界的老大哥,相信大家都有所觉得文档、SDK都是各种坑吧(纯粹吐槽而已),本文先整理支付宝支付集成。一、准备工作1、向支付宝”签约"成为支付宝的”商户”,签约完成后,支付宝会提供一些必要的数据给我们(商户ID-partner,......
  • linux iostat命令
    作者:天之翼Linux系统出现了性能问题,一般我们可以通过top、iostat、free、vmstat等命令来查看初步定位问题。其中iostat可以给我们提供丰富的IO状态数据。基本使用$iostat-d-k110参数-d表示,显示设备(磁盘)使用状态;-k某些使用block为单位的列强制使用Kilobytes为单位;110......
  • uniapp打包所需的ios证书和证书profile文件获取的图文教程
    使用uniapp进行云打包,可以打包android和ios两种app,但是uniapp官方并不能凭空产生这两种平台所需的打包证书。那么这两种打包证书又是如何获取呢?android相对简单,使用jdk的工具生成就可以了,也可以使用香蕉云编来一键生成。但是ios证书的生成就没有这么简单,因为ios证书的生成需要......
  • 视频直播网站源码,自定义气泡效果(BubbleView)
    视频直播网站源码,自定义气泡效果(BubbleView)代码如下: packagecom.example.myapplication;importandroid.content.Context;importandroid.graphics.BlurMaskFilter;importandroid.graphics.Canvas;importandroid.graphics.Color;importandroid.graphics.Paint;importandr......
  • iOS系统安全机制
    引言在开发过程中,经常会遇到这么一些问题:修改App结构后无法运行不能直接读取其他应用程序程序每次运行地址都不一样系统升级了不允许降级带着这些问题,我们来学习一下,iOS系统提供的安全机制。iOS系统安全架构  上图是苹果官方的iOS系统安全架构图,他分为两个部分,第一个部分......
  • 6-8|如何使用Python语言开发IOS混淆工具
    在iOS开发中,混淆工具主要用于保护代码的安全性,避免别人通过反编译等手段获取到关键代码。Python语言是一门高效、易于编写和调试的开发语言,可以用它来编写iOS混淆工具。下面是一个简单的示例代码,用Python实现对Objective-C代码进行简单的混淆。```pythonimportosimportrandom......
  • VMware ESXi 6.7 U3 Final Unlocker & OEM BIOS 集成 REALTEK 网卡驱动和 NVMe 驱动 (
    VMwareESXi6.7U3Final最终版,集成驱动版。此版本解决的问题:VMwareHostClient无法将现有虚拟磁盘(VMDK)附加到虚拟机请访问原文链接:https://sysin.org/blog/vmware-esxi-6-sysin/,查看最新版。原创作品,转载请保留出处。作者主页:sysin.org2023-02-28,发布一个UIfix版......