JXPopupView
一个轻量级的自定义视图弹出框架,可灵活配置动画和背景样式。
特性
- 默认提供丰富的动画效果,可以灵活配置,只需遵循并实现
PopupViewAnimator
协议; - 使用范围更广,通过view封装,可以在任何view上展示,并不局限于UIViewController;
- 弹框背景配置灵活,借鉴了
MBProgressHUD
处理背景视图的逻辑; - 交互细节可配置,提供了
isDismissible
、isInteractive
、isPenetrable
属性进行配置;
预览
动画效果
动画效果 | GIF |
---|---|
渐隐渐现 | ![]() |
缩放 | ![]() |
向左 | ![]() |
向右 | ![]() |
向下 | ![]() |
向上 | ![]() |
弹性动画 | ![]() |
完全自定义动画 | ![]() |
Layout布局方式
动画效果 | GIF |
---|---|
顶部 | ![]() |
底部 | ![]() |
前部 | ![]() |
尾部 | ![]() |
居中 | 居中(无示意图) |
帧 | 自定义帧(无示意图) |
背景样式
背景样式 | GIF |
---|---|
固定颜色值 | ![]() |
模糊亮度 | ![]() |
模糊暗淡 | ![]() |
指定containerView
指定containerView | GIF |
---|---|
窗口 | ![]() |
UIViewController.view | ![]() |
自定义视图 | ![]() |
要求
iOS: 9+ XCode: 12.1+ swift: 5.0+
安装
CocoaPods
在Podfile文件中添加
pod 'JXPopupView'
然后运行pod install(最好先运行pod update)
使用
//- 确定contentView的布局方式
enum Layout {
case center(Center)
case top(Top)
case bottom(Bottom)
case leading(Leading)
case trailing(Trailing)
case frame(CGRect)
}
//如果contentView重载了intrinsicContentSize属性并返回其内容的CGSize,就无需再设置width、height值。
let layout: BaseAnimator.Layout = .center(.init(offsetY: 0, offsetX: 0, width: 200, height: 200))
//- 确定动画效果
let animator = FadeInOutAnimator(layout: layout)
//- 初始化JXPopupView
let contentView = TestAlertView()
let popupView = JXPopupView(containerView: containerView, contentView: contentView, animator: animator)
//- 配置交互
popupView.isDismissible = true
popupView.isInteractive = true
popupView.isPenetrable = false
//- 配置背景
popupView.backgroundView.style = self.backgroundStyle
popupView.backgroundView.blurEffectStyle = self.backgroundEffectStyle
popupView.backgroundView.color = self.backgroundColor
//- 展示popupView
popupView.display(animated: true, completion: nil)
//- 消失popupView
//通过extension提供的popupView方法,获取JXPopupView进行操作,可以不用全局持有JXPopupView属性
contentView.popupView()?.dismiss(animated: true, completion: nil)
动画自定义
PopupViewAnimator
协议方法
/// 初始化配置动画驱动器
///
/// - Parameters:
/// - popupView: PopupView
/// - contentView: 自定义的弹框视图
/// - backgroundView: 背景视图
/// - Returns: void
func setup(popupView: PopupView, contentView: UIView, backgroundView: PopupView.BackgroundView)containerView: UIView)
/// 处理展示动画
///
/// - Parameters:
/// - contentView: 自定义的弹框视图
/// - backgroundView: 背景视图
/// - animated: 是否需要动画
/// - completion: 动画完成后的回调
/// - Returns: void
func display(contentView: UIView, backgroundView: JXBackgroundView, animated: Bool, completion: @escaping ()->())
/// 处理消失动画
///
/// - Parameters:
/// - contentView: 自定义的弹框视图
/// - backgroundView: 背景视图
/// - animated: 是否需要动画
/// - completion: 动画完成后的回调
func dismiss(contentView: UIView, backgroundView: JXBackgroundView,animated: Bool, completion: @escaping ()->())
自定义动画建议
- 完全自定义动画可以通过继承
BaseAnimator
或创建自己的类,遵循PopupViewAnimator
协议,实现相应方法。请参考demo工程中的BaseAnimator
类。
证书
JXPopupView遵循MIT许可证。更多详情请参阅LICENSE文件。