Swift - 第三方Alert弹出框组件（SCLAlertView）使用详解

一、安装配置

import SCLAlertView

二、基本用法

1，简单的使用样例

import UIKit
import SCLAlertView

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    @IBAction func showInfo(_ sender: Any) {
        //弹出普通消息提示框
        SCLAlertView().showInfo("这个是标题", subTitle: "这个是普通消息提示框正文内容。")
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

2，自带的消息框样式

//普通消息提示框
SCLAlertView().showInfo("这个是标题", subTitle: "这个是普通消息提示框正文内容。")

//编辑消息提示框
SCLAlertView().showEdit("这个是标题", subTitle: "这个是编辑消息提示框正文内容。")

//通知消息提示框
SCLAlertView().showNotice("这个是标题", subTitle: "这个是通知消息提示框正文内容。")

//警告提示框
SCLAlertView().showWarning("这个是标题", subTitle: "这个是警告提示框正文内容。")

//错误提示框
SCLAlertView().showError("这个是标题", subTitle: "这个是警告提示框正文内容。")
        
//成功提示框
SCLAlertView().showSuccess("这个是标题", subTitle: "这个是成功提示框正文内容。")
        
//等待提示框
SCLAlertView().showWait("这个是标题", subTitle: "这个等待提示框正文内容。")

 

 

 

3，修改关闭按钮文字

//成功提示框
SCLAlertView().showSuccess("这个是标题", subTitle: "这个是成功提示框正文内容。",
                           closeButtonTitle: "确定")

SCLAlertView().showTitle("邮件发送成功", subTitle: "我们将在10个工作日内给您回复。",
                         timeout: nil, completeText: "确定", style: .info,
                         colorStyle: 0xffae3e, colorTextButton: 0xFFFFFF,
                         circleIconImage: UIImage(named: "email.png"),
                         animationStyle: .topToBottom)

6，动态修改提示框内容

提示框弹出后，我们可以通过其返回的 SCLAlertViewResponder 对象来修改提示框内部的标题以及正文内容。

//显示等待提示框
let alertViewResponder = SCLAlertView().showWait("这个是标题", subTitle: "这个是正文内容。")
        
//修改提示框内容
alertViewResponder.setTitle("修改标题")
alertViewResponder.setSubTitle("修改正文内容")

7，使用代码关闭提示框

提示框弹出后，除了通过点击提示框上的按钮来关闭提示框外。我们还可以在代码中通过其返回的 SCLAlertViewResponder 对象的 close() 方法对其关闭。

//显示等待提示框
let alertViewResponder = SCLAlertView().showWait("这个是标题", subTitle: "这个是正文内容。")
        
//关闭提示框
alertViewResponder.close()

三、高级用法

1，修改字体样式

下面我们通过自定义外观样式（放大标题文字，缩小正文文字、按钮文字加粗）来实现一个自定义的提示框组件并使用。

//自定义提示框样式
let appearance = SCLAlertView.SCLAppearance(
    kTitleFont: UIFont(name: "HelveticaNeue", size: 22)!, //标题文字字体
    kTextFont: UIFont(name: "HelveticaNeue", size: 12)!,  //正文文字字体
    kButtonFont: UIFont(name: "HelveticaNeue-Bold", size: 14)!  //按钮文字字体
)

//使用自定义样式的提示框
let alert = SCLAlertView(appearance: appearance)
        
//显示提示框
alert.showInfo("这个是标题", subTitle: "这个是普通消息提示框正文内容。")

2，隐藏关闭按钮

//自定义提示框样式
let appearance = SCLAlertView.SCLAppearance(
    showCloseButton: false //不显示关闭按钮
)

//使用自定义样式的提示框
let alert = SCLAlertView(appearance: appearance)
        
//显示提示框
alert.showInfo("这个是标题", subTitle: "这个是普通消息提示框正文内容。")

3，等待一段时间自动关闭提示框

//自定义提示框样式
let appearance = SCLAlertView.SCLAppearance(
    showCloseButton: false //不显示关闭按钮
)

//使用自定义样式的提示框
let alert = SCLAlertView(appearance: appearance)

//显示提示框（3秒后自定关闭）
let timeout = SCLAlertView.SCLTimeoutConfiguration(timeoutValue: 3) { 
    print("提示框自动关闭了")
}
alert.showInfo("这个是标题", subTitle: "这个是普通消息提示框正文内容。", timeout: timeout)

4，添加多个按钮

let alertView = SCLAlertView()
alertView.addButton("第一个按钮", target:self, selector:#selector(firstButtonTapped))
alertView.addButton("第二个按钮") {
    print("第二个按钮点击")
}
alertView.showSuccess("这个是标题", subTitle: "下面添加了多个按钮", closeButtonTitle: "取消")
        
        
//第一个按钮点击事件相应
func firstButtonTapped() {
    print("第一个按钮点击")
}

5，隐藏头部图标

//自定义提示框样式
let appearance = SCLAlertView.SCLAppearance(
    showCircularIcon: false  //隐藏头部图标
)

//使用自定义样式的提示框
let alertView = SCLAlertView(appearance: appearance)
alertView.showSuccess("这个是标题", subTitle: "这个是提示框正文内容。")

6，修改头部图标

let alertViewIcon = UIImage(named: "email.png")
SCLAlertView().showSuccess("这个是标题", subTitle: "这个是提示框正文内容。",
                           circleIconImage: alertViewIcon)

7，添加文本输入框

let alert = SCLAlertView()

//添加第一个输入框
let textField1 = alert.addTextField("用户名")
//添加第二个输入框
let textField2 = alert.addTextField("密码")
textField2.isSecureTextEntry = true

alert.addButton("确定") {
    print(textField1.text!, textField2.text!)
}
alert.showEdit("登录", subTitle: "请输入用户名和密码", closeButtonTitle: "取消")

8，添加自定义视图

let alert = SCLAlertView()

//创建日期选择器
let datePicker = UIDatePicker(frame: CGRect(x:0, y:0, width:236, height:150))
//将日期选择器区域设置为中文，则选择器日期显示为中文
datePicker.locale = Locale(identifier: "zh_CN")
//只有日期选择
datePicker.datePickerMode = .date
//将日期选择器作为提示框的自定义视图
alert.customSubview = datePicker

//添加确定按钮
alert.addButton("确定", backgroundColor: UIColor.brown, textColor: UIColor.yellow) {
    let formatter = DateFormatter()
    formatter.dateFormat = "yyyy年MM月dd日"
    print(formatter.string(from: datePicker.date))
}

alert.showInfo("请选择日期", subTitle: "", closeButtonTitle: "取消")

四、所有的自定义样式

1，按钮（Button ）相关

kButtonFont: UIFont  //按钮字体
buttonCornerRadius : CGFloat  //按钮圆角
showCloseButton: Bool  //是否显示关闭按钮
kButtonHeight: CGFloat  //按钮高度

2，图标（Circle Image）相关

showCircularIcon: Bool  //是否显示图标
kCircleTopPosition: CGFloat  //圆形头部位置
kCircleBackgroundTopPosition: CGFloat  //圆形背景头部位置
kCircleHeight: CGFloat  //圆形高度尺寸
kCircleIconHeight: CGFloat  //图标高度尺寸

3，文字（Text）相关

kTitleFont: UIFont  //标题文字字体
kTitleTop:CGFloat  //标题文字位置
kTitleHeight:CGFloat  //标题文字高度
kTextFont: UIFont  //内容文字字体
kTextHeight: CGFloat  //内容文字高度
kTextFieldHeight: CGFloat  //文本输入框高度
kTextViewdHeight: CGFloat  //文本视图高度

4，整个提示框相关

kDefaultShadowOpacity: CGFloat  //提示框显示时后面的阴影遮罩背景透明度
kWindowWidth: CGFloat  //提示框宽度
kWindowHeight: CGFloat  //提示框高度
shouldAutoDismiss: Bool //点击按钮后是否自动关闭提示框
fieldCornerRadius : CGFloat  //文本输入框圆角
contentViewCornerRadius : CGFloat  //内容视图圆角
disableTapGesture: Bool //是否禁用手势（如果我们添加了一个tableview作为子视图，可以将该属性设为true）