[iOS开发]常用弹窗总结

最近写项目 对各种各样的弹窗搞的有点头疼，于是决定总结一下常用的弹窗

弹窗是什么？

弹框是人机交互中常见的方式，常常出现于询问、警示以及完成某个插入任务，常见于网页端及移动端。弹框能使用户有效聚焦于当前最紧急的信息，也可以在不用离开当前页面的前提下，完成一些轻量的任务。

弹窗都有哪些分类？

模态弹窗

关于模态，官方文档中说明：模态视图突出焦点，因为用户只有在完成当前的任务或关闭一个信息或视图之后才能去做其它事情。 当屏幕上出现一个模态视图时，用户必须采取一个决定（点击按钮或是其它）才能退出模态化体验。一个模态视图可以占据整个屏幕、整个父视图（比如浮出层）或者屏幕的一部分。一个模态视图一般都含有“完成”和“取消”按钮来退出视图。

简单来说，模态视图，就是在原始视图上，叠加一层蒙版（我理解的模版就是一层透明的UIView），用以隔离原始视图中的所有操作，然后在蒙版上展示一层新视图，让用户更专注于完成新视图中的任务。

一、对话框

对话框承载与当前状态有关的重要信息，常需要用户进行响应。对话框由标题、信息内容（可选）、一个或多个按钮、文本输入框（可选）四部分组成。就是我们最常见的弹框，除了上述可选元素以外，对话框的外观是固定的不可修改的。
常见例如：
常用于手机app中的信息提示、操作二次确认、邀请评分、授权等场景

正常的一个提示弹窗 代码如下：

UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"" message:@"收藏成功！" preferredStyle:UIAlertControllerStyleAlert];//先创建一个弹窗控制器 然后里面有title和message来提示需要的东西
UIAlertAction *sureAction = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:nil];//添加一个弹窗的action 活动可以是取消 可以是确认
[alert addAction:sureAction];
[self presentViewController:alert animated:NO completion:nil];

注意：

关于UIAlertActionStyle有三种样式
UIAlertActionStyleDefault  , 默认样式         UIAlertActionStyleCancel,      取消
UIAlertActionStyleDestructive, 有毁灭性的操作是使用, 呈现红色

如果想要通过弹窗的action进行一些操作，我们可以把handler后面的nil改成需要进行的操作即可
例如下面这样

   UIAlertAction *picture = [UIAlertAction actionWithTitle:@"相册" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
     
        [self selectImageFromAlbum];
    }];

想要实现下图这样的文本输入框：

UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"提示" message:@"请输入新密码" preferredStyle:UIAlertControllerStyleAlert];
    
    [alert addTextFieldWithConfigurationHandler:^(UITextField * _Nonnull textField) {
     
        textField.placeholder = @"请输入修改后的密码";
    }];//原本的addAction改成addTextFieldWithConfigurationHandler就行了 同样是在后面写出textfield的一些限制条件

标题：简短能说明问题的标题。

信息内容：根据需要可不填写。

按钮：
可通过选择不同style等方式，使用户清楚明白选什么

文案要具体精准，让用户明白选择之后会发生什么。而不要使用“是”“否”等语意不明的词。

符合用户预期的按钮放在右侧，【取消】按钮固定在左侧。

当有破坏性的操作的时候，一方面要突出显示具有潜在破坏性的操作按钮，另一方面要确保有【取消】按钮，保证用户能够安全地取消破坏性操作。（例如删除等。）

操作方式：由于必须要获取用户明确的响应，因此只有选择按钮才能关闭弹窗。（也就是点击蒙板无法关闭弹窗）

二、操作列表

操作列表是一种特殊的对话框，是对操作动作的响应，显示当前操作场景下相关联的多个选项。用于让用户开始任务，或者在执行潜在的破坏性操作前，进行二次确认。
操作列表常被用于单选操作，以及删除操作的二次确认。(单一操作)

操作视图常被用于分享操作。

操作列表正常代码如下：

 UIAlertController *alertViewController = [UIAlertController alertControllerWithTitle:@"请选择方式" message:nil preferredStyle:UIAlertControllerStyleActionSheet];// style 为 sheet
        UIAlertAction *cancle = [UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:nil];
        UIAlertAction *picture = [UIAlertAction actionWithTitle:@"相册" style:UIAlertActionStyleDefault handler:nil];//handler里可以写需要的函数
        UIAlertAction *photo = [UIAlertAction actionWithTitle:@"相机" style:UIAlertActionStyleDefault handler:nil];//同理
        [alertViewController addAction:cancle];
        [alertViewController addAction:photo];
        [alertViewController addAction:picture];
        [self presentViewController:alertViewController animated:YES completion:nil];

当然也可以自定义底部弹框

1. 实现一个有遮罩效果的半透明 view,然后添加一个可设置展示内容高度的 contentView
2. 我们实现的底部弹框实质上是一个可滑动的表单(tableView),在 contentView 上添加一个 tableView
3. 通过设置UIView 动画,实现遮罩 menuView 的展示和消失效果
4. 实现选项和头部的定制化 通过编写自己的代理方法,让开发人员根据自己项目的实际需要设置各个选项,并且可以定制固定的头部以及底部

三、浮出层

一种iOS浮层视图的简单封装
这个作者 基于装饰者模式对这种弹出浮层做了一个简单的封装，把项目里的浮层视图都统一了起来 减少了耦合度

什么又是装饰者模式呢？
装饰模式是在不必改变原类文件和使用继承的情况下，动态地扩展一个对象的功能。它是通过创建一个包装对象，也就是装饰来包裹真实的对象.

这个作者将移除浮层的代码被封装了起来，自动执行。这样就达到了减少和调用端代码耦合以及复用的目的。

第一步先新建一个继承自UIView的类 然后给改类添加协议 添加方法 同时在创建一个内容视图（继承或创建自该类）内容视图添加一个可点击的背景 点击背景视图可以隐藏

1. 只需要展示内容的简单浮层，直接创建KKPopupView对象，并在它上面添加内容子视图，然后传给KKPopupViewWrapper封装对象显示。
   

2. 复杂一些或有交互的浮层，可以继承自KKPopupView

3. 有弹出和移除动画的浮层，动画代码需要添加在重写的show和hide方法里。
   

iOS这里与传统的c++装饰模式不太一样，一般的装饰者模式，decorator 会保有一份被装饰的对象，这里被装饰的对象可以是其父类，但是在iOS中“被保有”的对象就是delegate，这个delegate一般是vc。
说白一点，就是给vc灵活添加一些功能（装饰）–比如原始网络数据的处理，而又不用继承vc。

总结：为了让被装饰者的一个方法在执行前或者执行后进行一些预处理或者后处理。起到装饰执行者的一个方法的目的。

非模态弹窗

与模态相反 并不是用户只有在完成当前的任务或关闭一个信息或视图之后才能去做其它事情 其会自动关闭 或者 因为点击屏幕而消失

一、透明指示层

最好理解的就是iOS系统中自带的音量键

就我们的项目而言 知乎日报的收藏功能最终如果仅仅提示一个收藏成功 并且 可以通过afterDelay进行操作 从而保证定时的消失

 [self performSelector:@selector(disAlert:) withObject:alert afterDelay:1];
 -(void)disAlert : (UIAlertController *) alert {
     
    [alert dismissViewControllerAnimated:YES completion:nil];
}

二、app的通知