前言
弹出框组件应该是绝大多数应用都少不了的(只有极少数精心设计的APP会用不到) 当然我们的APP也不例外 之前我们APP的弹出框组件是我用pop写的 可是后来发现与系统原生动画有些冲突(pop内部用到了CATransaction 导致跟系统动画同时发生时会有问题) 所以上周花了大半天时间重写了一下MMPopupView这个组件
因为新写的组件完全是用Masonry写的 我觉得是个非常好的示例教程 结合之前我写的Masonry入门教程 应该可以更好的理解和运用Masonry/Autolayout 所以我又花了一点时间重新整理成了一个简单的开源库 有兴趣的朋友可以研究一下
运行的demo可以在这里查看
介绍
整体的组成大概就是这个样子
MMPopupWindow就是用来显示所有弹出框的容器 相对直接显示在当前UIWindow上来说 弄个独立的Window出来当容器的会更好
MMPopupView就是弹出框的基类 所有的弹出框只要继承自这个类 就具备了显示的能力 用户只要关注于弹出框本身的表现就行了
MMAlertView和MMSheetView都是我提供的基于MMPopupView的简单组件 可以直接拿来用 而且都是高度可定制的(这个稍后会介绍)
MMPopupWindow
MMPopupWindow的定义如下
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
@interface MMPopupWindow : UIWindow @property (nonatomic, assign) BOOL touchWildToHide; // default is NO. When YES, popup views will be hidden when user touch the translucent background. + (MMPopupWindow *)sharedWindow; /** * cache the window to prevent the lag of the first showing. */ - (void) cacheWindow; /** * show the translucent background */ - (void) showDimBackground; /** * hide the translucent background */ - (void) hideDimBackground; @end |
很简单 只有一个属性touchWildToHide
用来控制是否可以点击非弹出框的地方来使弹出框消失 还有一个cacheWindow
的方法来预加载MMPopupWindow 防止第一次使用的时候顿卡
另外还有两个用于显示和隐藏背景色的方法 这个在自定义动画的时候会用到
1 2 |
- (void) showDimBackground; - (void) hideDimBackground; |
MMPopupView
MMPopupView的定义如下
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
typedef NS_ENUM(NSUInteger, MMPopupType) { MMPopupTypeAlert, MMPopupTypeSheet, MMPopupTypeCustom, }; @class MMPopupView; typedef void(^MMPopupBlock)(MMPopupView *); @interface MMPopupView : UIView @property (nonatomic, assign, readonly) BOOL visible; // default is NO. @property (nonatomic, strong ) UIView *attachedView; // default is MMPopupWindow. You can attach MMPopupView to any UIView. @property (nonatomic, assign ) MMPopupType type; // default is MMPopupTypeAlert. @property (nonatomic, assign ) NSTimeInterval animationDuration; // default is 0.3 sec. @property (nonatomic, assign ) BOOL withKeyboard; // default is NO. When YES, alert view with be shown with a center offset (only effect with MMPopupTypeAlert). @property (nonatomic, copy ) MMPopupBlock showCompletionBlock; // show completion block. @property (nonatomic, copy ) MMPopupBlock hideCompletionBlock; // hide completion block @property (nonatomic, copy ) MMPopupBlock showAnimation; // custom show animation block. @property (nonatomic, copy ) MMPopupBlock hideAnimation; // custom hide animation block. /** * override this method to show the keyboard if with a keyboard */ ʁ(pop内部用到了CATransaction 导致跟系统动画同时发生时会有问题) 所以上周花了大半天时间重写了一下MMPopupView这个组件
因为新写的组件完全是用Masonry写的 我觉得是个非常好的示例教程 结合之前我写的Masonry入门教程 应该可以更好的理解和运用Masonry/Autolayout 所以我又花了一点时间重新整理成了一个简单的开源库 有兴趣的朋友可以研究一下 运行的demo可以在这里查看 介绍 整体的组成大概就是这个样子 MMPopupWindow就是用来显示所有弹出框的容器 相对直接显示在当前UIWindow上来说 弄个独立的Window出来当容器的会更好 MMPopupView就是弹出框的基类 所有的弹出框只要继承自这个类 就具备了显示的能力 用户只要关注于弹出框本身的表现就行了 MMAlertView和MMSheetView都是我提供的基于MMPopupView的简单组件 可以直接拿来用 而且都是高度可定制的(这个稍后会介绍) MMPopupWindowMMPopupWindow的定义如下
很简单 只有一个属性 另外还有两个用于显示和隐藏背景色的方法 这个在自定义动画的时候会用到
MMPopupViewMMPopupView的定义如下
|