CD组件库系列：一个轻量而强大的 HUD

超、凢脫俗 2022-10-01 05:53 205阅读 0赞

# [一个轻量而强大的 HUD][HUD] #

### 废话不多说先上图： ###

*  自定义 动图组、布局模式 Axis：vertical/horizontal
 *  默认支持的loading 样式:6种
 *  支持不同位置、自定义位置
 *  更多样式设置、自定义 详见[代码][HUD]

> 目的：用少量的代码，简单的接口实现一个简单却可统筹全局的HUD信息弹窗，包含更易于扩展和自定义的样式。

### 用了什么关键因素 ###

*  SnapKit
 *  阿里矢量图标库（CD系列集合[《CD\_IconFont》][CD_IconFont]）
 *  CABasicAnimation

### 摘抄 ###

#### 见 样式 枚举 ####

public extension CD_HUD {
        public enum Style {
            case text
            case loading(_ l:Loading?)
            case info
            case succeed
            case warning
            case error
            case progress(_ l:Progress)
            case custom(_ view:UIView)
            
            public enum Loading {
                /// 系统菊花
                case activity
                /// 环
                case ring
                /// 钻戒
                case diamond
                /// 毛笔墨
                case brush
                /// 写轮眼
                case roundEyes
                /// refresh 箭头
                case arrow
                /// 自定义 Gif 动画组
                case images(_ images:[UIImage], _ duration:TimeInterval, _ repeatCount:Int)
                /// 自定义 View
                case view(_ view:UIView)
            }
            
            public enum Progress {
                /// 默认
                case `default`(model:CD_HUDProgressView.Model, handler:((CD_HUDProgressView?)->Void)?)
                /// 自定义 View
                case view(_ view:UIView)
            }
        }
    }
    
    复制代码

#### 见布局与动画枚举 ####

public extension CD_HUD {
        public enum Axis {
            case vertical
            case horizontal
        }
        
        public enum Position {
            case top
            case center
            case bottom
            /// offsetY > 0 以top为参照  < 0 以bottom为参照
            case custom(_ offsetY:CGFloat)
        }
        
        public enum Animation {
            case fade
            case slide
            case zoom
            /// 弹簧动画 只适用 HUD显示 & Position .top .bottom .custom(_ point:CGPoint)
            case spring
            /// 自定义动画
            case custom(_ animat:((_ hud:CD_HUD?, _ contentView:UIView?)->Void)?)
            case none
        }
    }
    复制代码

### 附：对CD\_HUD 进行全局标准化扩展，即：如何用 ###

public extension UIView {
        func hud_loading() {
            self.cd.hud_remove()
            self.cd.hud(.loading(.activity))
        }
        func hud_hidden() {
            self.cd.hud_remove()
        }
        func hud_msg(_ title:String) {
            self.cd.hud_remove()
            var model = CD_HUD.modelDefault
            model._position = .bottom
            model._showAnimation = .slide
            self.cd.hud(.text, title: title, model:model)
        }
        
        func hud_succeed(_ title:String) {
            self.cd.hud_remove()
            var model = CD_HUD.modelDefault
            model._axis = .horizontal
            model._isSquare = false
            self.cd.hud(.succeed, title: title, model:model)
        }
        
        func hud_error(_ title:String) {
            self.cd.hud_remove()
            var model = CD_HUD.modelDefault
            model._axis = .horizontal
            model._isSquare = false
            self.cd.hud(.error, title: title, model:model)
        }
        func hud_info(_ title:String) {
            self.cd.hud_remove()
            var model = CD_HUD.modelDefault
            model._axis = .horizontal
            model._isSquare = false
            self.cd.hud(.info, title: title, model:model)
        }
        func hud_warning(_ title:String) {
            self.cd.hud_remove()
            var model = CD_HUD.modelDefault
            model._axis = .horizontal
            model._isSquare = false
            self.cd.hud(.warning, title: title, model:model)
        }
    }
    
    复制代码

*  友情链接 [SwiftMessages][]

转载于:https://juejin.im/post/5cfce4f5f265da1bd260df07

[HUD]: https://link.juejin.im?target=https%3A%2F%2Fgithub.com%2Fliucaide%2FCD%2Ftree%2Fmaster%2FCD%2FCD_HUD
[CD_IconFont]: https://link.juejin.im?target=https%3A%2F%2Fgithub.com%2Fliucaide%2FCD%2Ftree%2Fmaster%2FCD%2FCD_IconFont
[SwiftMessages]: https://link.juejin.im?target=https%3A%2F%2Fgithub.com%2FSwiftKickMobile%2FSwiftMessages