ARTICLE · INTELLIGENCE

战地情报 · 详情页

来自尧图项目组的一线实战观察与深度解析

如何将自定义Xib视图嵌入TYAlertController?从ShareView到ActionSheet的实战技巧

如何将自定义Xib视图嵌入TYAlertController?从ShareView到ActionSheet的实战技巧

【免费下载链接】TYAlertController

Powerful, Easy to use alert view or popup view on controller and window, support blur effects,custom view and animation,for objective-c,support iphone, ipad

项目地址:https://gitcode.com/gh_mirrors/ty/TYAlertController
点击查看免费下载

TYAlertController 是一款功能强大的 iOS 轻量级 Objective-C 弹窗组件,支持模糊效果、自定义视图和自定义转场动画。本文以官方 Demo 中的 ShareView 和 SettingModelView 两个实例,手把手教你把自定义 Xib 视图嵌入 TYAlertController,一键弹出 Alert 或 ActionSheet 弹窗,新手也能快速上手。

🧭 先搞懂:TYAlertController 的弹窗架构

TYAlertController 本质是一个UIViewController,它把"要显示的内容"抽象为一个UIView。这个视图有两种来源:

视图类型来源适用场景
TYAlertView纯代码构建(标题 + 消息 + 按钮 + 输入框)简单的确认框、表单弹窗
任意UIView子类你的 Xib / Storyboard / 代码分享面板、设置列表等复杂 UI

本文主角是第二种——这也是它能被称为"Powerful"的原因:任何画好的 Xib 视图都能直接当弹窗内容。核心入口在 TYAlertController.h,只要传入一个alertView就能创建控制器:

+ (instancetype)alertControllerWithAlertView:(UIView *)alertView preferredStyle:(TYAlertControllerStyle)preferredStyle;

集成方式有两种:CocoaPods 一行pod 'TYAlertController'(详见 README.md),或者直接把 TYAlertController/ 目录拷入工程;若需要模糊效果,还要一并拷贝 Blur Effects/ 目录。

要求:Xcode 5+、iOS 7.0+、ARC,版本兼容性很好。

第一步:准备同名 Xib 与 UIView 子类

Demo 里有两个现成的自定义视图范例:

  • ShareView.xib + ShareView.m:一个 300x300 的"分享到"面板,包含微博、QQ、微信等入口按钮
  • SettingModelView.xib + SettingModelView.m:一个 ActionSheet 风格的设置面板

它们能无缝配合 TYAlertController 工作,靠的是两条命名约定:

  1. Xib 文件名与类名完全一致:ShareView类对应ShareView.xib
  2. Xib 根视图的 Custom Class 指向子类:打开 ShareView.xib 可以看到根 view 已设置为customClass="ShareView",这样加载出来的根视图类型就是ShareView,按钮的 IBAction 也能正确连上

第二步:用 createViewFromNib 一行加载视图

加载工作由UIView分类 UIView+TYAlertView.h 完成,实现逻辑非常直白(见 UIView+TYAlertView.m#L13-L22):

+ (instancetype)createViewFromNib { return [self createViewFromNibName:NSStringFromClass(self.class)]; }

也就是说,默认按类名去找同名 Xib 并用loadNibNamed:加载,取出第一个对象返回。这就是上面"同名约定"的由来——不满足约定时,改用createViewFromNibName:手动指定 Xib 名即可。

第三步:把自定义视图弹出为弹窗

方式 A:TYAlertController(推荐,可精细控制)

ViewController.m#L134-L145 演示了完整的 ActionSheet 用法:

// 从 Xib 加载自定义视图 SettingModelView *settingModelView = [SettingModelView createViewFromNib]; // 以 ActionSheet 风格弹出 TYAlertController *alertController = [TYAlertController alertControllerWithAlertView:settingModelView preferredStyle:TYAlertControllerStyleActionSheet]; alertController.backgoundTapDismissEnable = YES; // 允许点击背景关闭 [self presentViewController:alertController animated:YES completion:nil];

方式 B:UIView 分类一行调用(更简洁)

同一个效果可以压缩成一行(ViewController.m#L139 的注释示例):

[settingModelView showInController:self preferredStyle:TYAlertControllerStyleActionSheet backgoundTapDismissEnable:YES];

分类内部会自动帮你创建TYAlertController并 present(见 UIView+TYAlertView.m#L94-L103),适合简单场景。

Alert 与 ActionSheet 两种风格怎么选?

属性风格视觉效果适用场景
TYAlertControllerStyleAlertAlert居中悬浮卡片分享面板、确认对话框
TYAlertControllerStyleActionSheetActionSheet底部上滑面板操作选项、设置菜单

风格枚举定义在 TYAlertController.h#L12-L15。配合transitionAnimation:还能指定转场动画:淡入(Fade)、缩放淡入(ScaleFade)、下拉(DropDown)或自定义(Custom),完整列表见 TYAlertController.h#L17-L22。

另外两个常用属性(TYAlertController.h#L38-L43):

  • alertViewOriginY:调整 Alert 的垂直位置(默认屏幕居中)
  • alertStyleEdging/actionSheetStyleEdging:调整弹窗与屏幕边缘的间距

🎨 进阶实战:ShareView 加模糊背景效果

这是 Demo 最出彩的场景:分享面板弹出时,背后整个页面实时高斯模糊,质感拉满。核心只有一行(ViewController.m#L108-L118):

ShareView *shareView = [ShareView createViewFromNib]; TYAlertController *alertController = [TYAlertController alertControllerWithAlertView:shareView preferredStyle:TYAlertControllerStyleAlert]; // 给背景视图加上模糊效果 [alertController setBlurEffectWithView:self.view]; [self presentViewController:alertController animated:YES completion:nil];

setBlurEffectWithView:来自分类 TYAlertController+BlurEffects.h,支持 Light、ExtraLight、Dark 三种模糊风格,还可以传入effectTintColor自定义色调。

⚠️ 注意:模糊效果依赖 Blur Effects/ 目录下的UIImage+ImageEffects高斯模糊工具类,拷贝库文件时别漏掉这个文件夹(README.md 的 Usage 第 1 条有明确提示)。

✋ 从 Xib 内部关闭弹窗:hideView 自动判断

自定义 Xib 视图里怎么关闭自己?Demo 的答案是分类提供的hideView(UIView+TYAlertView.m#L134-L143),它会自动判断当前弹窗挂在 Controller 还是 Window 上,并调用正确的关闭方法。

ShareView.m#L14-L17 中的取消按钮就是这么接的:

- (IBAction)cancelAction:(id)sender { [self hideView]; // 自动识别并关闭,无需关心弹出方式 }

如果视图是加到 Window 上显示的(不占导航层级、可全局展示),还有更轻量的路径(ViewController.m#L167-L172):

ShareView *shareView = [ShareView createViewFromNib]; [shareView showInWindow]; // 直接挂到 Window 上

Window 方式适合"任何页面随时弹出"的全局分享面板,具体 API 全集可查阅 UIView+TYAlertView.h#L34-L53。

🛠 避坑清单:新手最容易踩的 5 个坑

#坑点正确做法
1Xib 名与类名不一致,createViewFromNib加载失败保持同名,或用createViewFromNibName:显式指定
2Xib 根视图忘了设 Custom Class在 Attribute Inspector 里把 Class 改成你的子类名
3backgoundTapDismissEnable默认为 NO需要点背景关闭时手动设为 YES(注意原库拼写就是 backgound)
4在 block 中强引用 alertView 造成循环引用按 ViewController.m#L39 的写法先转 weak 引用
5想要模糊效果却没拷 Blur Effects 目录集成时连同 Blur Effects/ 一起拷入

总结

把自定义 Xib 视图嵌入 TYAlertController 的完整链路只有四步:同名建 Xib →createViewFromNib加载 →TYAlertController(或分类一行调用)弹出 →hideView自动关闭。相比只写代码的TYAlertView,这条 Xib 路线让你把复杂 UI 交给可视化的 Interface Builder,而弹窗的转场动画、模糊背景、点击背景关闭等能力全部由框架接管。配合 Demo 工程中的 ShareView 与 SettingModelView 两个范例对照阅读,基本可以覆盖 iOS 弹窗的绝大多数业务场景。

【免费下载链接】TYAlertController

Powerful, Easy to use alert view or popup view on controller and window, support blur effects,custom view and animation,for objective-c,support iphone, ipad

项目地址:https://gitcode.com/gh_mirrors/ty/TYAlertController
点击查看免费下载

创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

RELATED READING

延伸阅读

更多一线实战笔记与深度复盘,助您持续精进