EMPopView —— 一款 iOS 基于Swift 3.0 的弹窗框架
发布于:2016-10-01 15:26,阅读数:1922,点赞数:7
> 本项目为一款 iOS 基于 Swift 3.0 的清爽型自定义弹窗框架。 > > 项目在[「GitHub」](https://github.com/trmbhs/EMPopView)中开源,已集成`CocoaPods`。 # 更新 代码已经过更新,方法名和参数名可能发生变化。以`GitHub`中的`Example`代码为准。 # 弹窗内容 - `EMLoadingView`:读取时弹窗 - `EMProgressView`:带进度的读取时弹窗 - `EMSheetView`:选项弹窗 - `EMAlertView`:对话框弹窗 # 使用方法 ### 初始化 - 该操作是注册Notification的过程,使所有弹窗支持横屏旋转,全局只需执行一次。 ```swift func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { EMPopViewFactory.regist() return true } ``` ### EMLoadingView —— 读取时弹窗 - 配置`EMLoadingViewConfig`: 其构造方法原型为: ```swift public init(colorStyle: EMPopViewColorStyle = EMPopViewDefaultValue.colorStyle, showAniStyle: EMPopViewShowAnimationStyle = EMPopViewDefaultValue.showAniStyle, closeAniStyle: EMPopViewCloseAnimationStyle = EMPopViewDefaultValue.closeAniStyle, windowAlpha: CGFloat = EMPopViewDefaultValue.windowAlpha, viewAlpha: CGFloat = EMPopViewDefaultValue.viewAlpha) } ``` 接收`colorStyle`、`showAniStyle`、`closeAniStyle`、`windowAlpha`和`viewAlpha`参数,分别指定了`颜色主题`、`出现动画`、`关闭动画`、`背景透明度`和`窗口透明度`。所有参数均设有默认值,因此构造时可以自由选择参数传值,没有传入的参数将会采用默认值。默认值设定存在于`EMPopViewDefaultValue`类中。 `Example`中的例子为: ```swift let config = EMLoadingViewConfig.init(colorStyle: .White, showAniStyle: .FadeIn, closeAniStyle: .FadeOut) ``` - 弹出窗口 `index`参数用来接收该窗口索引值,关闭窗口时需要使用索引值进行关闭。 ```swift let index = EMPopViewFactory.showView(type: .Loading, config: config) ``` - 关闭窗口 ```swift EMPopViewFactory.closeView(index: index) ``` - 两种`colorStyle`的截图 ![](//cdn.blog.yuusann.com/img/posts/16002_1.jpg) ![](//cdn.blog.yuusann.com/img/posts/16002_2.jpg) ### EMProgressView —— 带进度的读取时弹窗 - 配置`EMProgressViewConfig`: 其构造方法原型为: ```swift public init(colorStyle: EMPopViewColorStyle = EMPopViewDefaultValue.colorStyle, showAniStyle: EMPopViewShowAnimationStyle = EMPopViewDefaultValue.showAniStyle, closeAniStyle: EMPopViewCloseAnimationStyle = EMPopViewDefaultValue.closeAniStyle, windowAlpha: CGFloat = EMPopViewDefaultValue.windowAlpha, viewAlpha: CGFloat = EMPopViewDefaultValue.viewAlpha, max: UInt = 100, step: UInt = 1) ``` 除了通用的配置以外,多了`max`和`step`参数,分别指定`总进度长度`和`每一步进度长度`。所有参数外全部设有默认值,可以自由选择参数传递。 `Example`中的例子为: ```swift let config = EMProgressViewConfig.init(colorStyle: .White, showAniStyle: .FadeIn, closeAniStyle: .FadeOut, max: 5) ``` - 弹出窗口 ```swift let index = EMPopViewFactory.showView(type: .Progress, config: config) ``` - 进度条步进 ```swift (EMPopViewFactory.getView(index: index)! as! EMProgressView).step() (EMPopViewFactory.getView(index: index)! as! EMProgressView).step(value: 10) ``` - 指定当前进度值 ```swift (EMPopViewFactory.getView(index: index)! as! EMProgressView).setProgress(current: 10) ``` - 关闭窗口 ```swift EMPopViewFactory.closeView(index: index) ``` - 两种`colorStyle`的截图 - ![](//cdn.blog.yuusann.com/img/posts/16002_3.jpg) ![](//cdn.blog.yuusann.com/img/posts/16002_4.jpg) ### EMSheetView —— 选项弹窗 - 配置`EMSheetViewConfig`: 其构造方法原型为: ```swift public init(colorStyle: EMPopViewColorStyle = EMPopViewDefaultValue.colorStyle, showAniStyle: EMPopViewShowAnimationStyle = EMPopViewDefaultValue.showAniStyle, closeAniStyle: EMPopViewCloseAnimationStyle = EMPopViewDefaultValue.closeAniStyle, windowAlpha: CGFloat = EMPopViewDefaultValue.windowAlpha, viewAlpha: CGFloat = EMPopViewDefaultValue.viewAlpha, text: String = "", cancelFoo: (() -> Void)? = nil) ``` 除了通用的配置以外,多了`text`和`cancelFoo`参数,分别指定`提示文字`和`取消时回调`。 `Example`中的例子为: ```swift let config = EMSheetViewConfig.init(colorStyle: .White, showAniStyle: .SlideInBottom, closeAniStyle: .SlideOutBottom, text: "Sheet 选项") ``` - 配置选项 `EMSheetViewCellConfig`构造方法原型为: ```swift public init(title: String = "", foo: (() -> Void)? = nil) ``` `title`和`foo`分别指代选项的`显示内容`和`点击回调`。 - 选项压栈 ```swift config.pushCell(cell: EMSheetViewCellConfig.init(title: "A", foo: { print("A") })) config.pushCell(cell: EMSheetViewCellConfig.init(title: "B", foo: { print("B") })) ``` - 弹出窗口 ```swift EMPopViewFactory.showView(type: .Sheet, config: config) ``` - 两种`colorStyle`的截图 - ![](//cdn.blog.yuusann.com/img/posts/16002_5.jpg) ![](//cdn.blog.yuusann.com/img/posts/16002_6.jpg) ### EMAlertView —— 对话框弹窗 - 配置`EMAlertViewConfig`: 其构造方法原型为: ```swift public init(colorStyle: EMPopViewColorStyle = EMPopViewDefaultValue.colorStyle, showAniStyle: EMPopViewShowAnimationStyle = EMPopViewDefaultValue.showAniStyle, closeAniStyle: EMPopViewCloseAnimationStyle = EMPopViewDefaultValue.closeAniStyle, windowAlpha: CGFloat = EMPopViewDefaultValue.windowAlpha, viewAlpha: CGFloat = EMPopViewDefaultValue.viewAlpha, title: String = "", text: String = "") ``` 除了通用的配置以外,多了`title `和`text `参数,分别指定`对话框标题`和`对话框文字`。 `Example`中的例子为: ```swift let config = EMAlertViewConfig.init(colorStyle: .White, showAniStyle: .FadeIn, closeAniStyle: .FadeOut, title: "删除", text: "确认要删除该项目吗?\n该操作无法撤销!") ``` - 配置按钮 `EMAlertViewButtonConfig`的构造方法原型为: ```swift public init(style: EMAlertViewButtonStyle = .Default, text: String = "", foo: (() -> Void)? = nil) ``` `EMAlertViewButtonStyle`仅有`Default`和`Cancle`两个选项。`text`为按钮的文字,`foo`为按键回调。 - 按钮压栈 对话框支持单按钮和双按钮,因此按钮可入栈1个,也可入栈2个。 ```swift config.pushButton(config: EMAlertViewButtonConfig.init(style: .Default, text: "取消", foo: { print("back") })) config.pushButton(config: EMAlertViewButtonConfig.init(style: .Cancel, text: "删除", foo: { print("del") })) ``` - 弹出窗口 ```swift EMPopViewFactory.showView(type: .Alert, config: config) ``` - 两种`colorStyle`的截图 ![](//cdn.blog.yuusann.com/img/posts/16002_7.jpg) ![](//cdn.blog.yuusann.com/img/posts/16002_8.jpg) ### EMPopViewDefaultValue —— 配置默认值 弹窗配置过程中均使用了默认值配置,修改默认值可以更方便地使用本框架。框架中的默认值有: ```swift static internal var colorStyle: TColorStyle = .White static internal var showAniStyle: TShowAniStyle = .FadeIn static internal var closeAniStyle: TCloseAniStyle = .FadeOut static internal var windowAlpha: CGFloat = 0.2 static internal var viewAlpha: CGFloat = 0.8 static internal var phoneTitleFontSize: CGFloat = 18 static internal var phoneTextFontSize: CGFloat = 16 static internal var padTitleFontSize: CGFloat = 26 static internal var padTextFontSize: CGFloat = 20 ``` 配置默认值的方法原型为 ```swift static public func setDefault(colorStyle: EMPopViewColorStyle! = nil, showAniStyle: EMPopViewShowAnimationStyle! = nil, closeAniStyle: EMPopViewCloseAnimationStyle! = nil, windowAlpha: CGFloat! = nil, viewAlpha: CGFloat! = nil, phoneTitleFontSize: CGFloat! = nil, phoneTextFontSize: CGFloat! = nil, padTitleFontSize: CGFloat! = nil, padTextFontSize: CGFloat! = nil) ``` 调用`EMPopViewDefaultValue.setDefault(...)`传入需要修改的默认值即可。 ### 修改源码以增加配色方案 源码的`EMPopViewConfig.swift`文件中存在`EMPopViewColorStyle`枚举类型,其保存了当前所有的配色方案。修改该枚举类型,增加新的枚举项目后直接编译,编译器将会提醒你需要实现新配色源码的位置。仅需实现`7`处位置的代码,即可新增一个全新的配色方案。 ### 修改源码以增加过渡动画 源码的`EMPopViewAnimation.swift`文件中存在`EMPopViewShowAnimationStyle`和`EMPopViewCloseAnimationStyle`枚举,分别对应`出现时过渡动画`和`关闭时过度动画`。修改这里的枚举值后在`EMPopViewAnimationFactory`中实现相应的方法即可新增新的过渡动画。 # 小结 Swift 进入 3.0 版本以后 iOS SDK 发生了巨大的改变。这一组简单的弹窗框架,经过我的设计,能非常简便地加入新的配色和动画方案,是我的第一个 Swift 3.0 项目,也是我跨入 Swift 3.0 的第一步。
评论:0条