在網(wǎng)上看到一個(gè)好用的控件,找到一篇中文翻譯彬呻,記錄一下衣陶,萬(wàn)一以后用的到呢柄瑰?
轉(zhuǎn)載文章地址:http://www.th7.cn/Program/IOS/201606/890088.shtml
下載地址:https://github.com/mutualmobile/MMDrawerController
一、 MMDrawerController是一個(gè)輕量級(jí)的側(cè)邊欄抽屜控件剪况,其支持左側(cè)抽屜和右側(cè)抽屜教沾,可以很好的支持導(dǎo)航控制器,并且支持開(kāi)發(fā)者對(duì)手勢(shì)和動(dòng)畫(huà)進(jìn)行自定義
二拯欧、MMDrawerController的使用及相關(guān)設(shè)置 MMDrawerController的使用十分簡(jiǎn)單详囤,只需將中心視圖控制器和左邊欄視圖控制器傳入初始化方法即可完成MMDrawerController的創(chuàng)建。示例代碼如下:
UIViewController * leftViewController = [[UIViewController alloc]init];
leftViewController.view.backgroundColor = [UIColor redColor];UIViewController * rightViewController = [[UIViewController alloc]init];
rightViewController.view.backgroundColor = [UIColor greenColor];ViewController * centerViewController = [[ViewController alloc]init];
centerViewController.view.backgroundColor = [UIColor blueColor];
//創(chuàng)建控件
MMDrawerController * rootController = [[MMDrawerController alloc]initWithCenterViewController:centerViewController leftDrawerViewController:leftViewController rightDrawerViewController:rightViewController];
MMDrawerController中還提供了兩個(gè)方法供開(kāi)發(fā)者創(chuàng)建單側(cè)邊欄镐作,如下:
//只創(chuàng)建帶左側(cè)邊欄的視圖控制器
-(id)initWithCenterViewController:(UIViewController *)centerViewController leftDrawerViewController:(UIViewController *)leftDrawerViewController;
//只創(chuàng)建帶右側(cè)邊欄的視圖控制器
-(id)initWithCenterViewController:(UIViewController *)centerViewController rightDrawerViewController:(UIViewController *)rightDrawerViewController;
//MMDrawerController中也提供了許多屬性和方法供開(kāi)發(fā)者進(jìn)行自定義的設(shè)置藏姐,其中可用屬性解析如下:
//設(shè)置左側(cè)邊欄的最大寬度 默認(rèn)280
@property (nonatomic, assign) CGFloat maximumLeftDrawerWidth;//設(shè)置右側(cè)邊欄的最大寬度 默認(rèn)280
@property (nonatomic, assign) CGFloat maximumRightDrawerWidth;
//這個(gè)是一個(gè)只讀屬性,用于獲取可見(jiàn)的左側(cè)邊欄寬度
@property (nonatomic, assign, readonly) CGFloat visibleLeftDrawerWidth;
//這個(gè)是一個(gè)只讀屬性该贾,用于獲取可見(jiàn)的右側(cè)邊欄寬度
@property (nonatomic, assign, readonly) CGFloat visibleRightDrawerWidth;
//動(dòng)畫(huà)速度羔杨,這個(gè)參數(shù)的意義是每秒移動(dòng)多少單位 默認(rèn)為800/s
@property (nonatomic, assign) CGFloat animationVelocity;
//設(shè)置是否允許回彈效果,如果設(shè)置為YES杨蛋,當(dāng)使用手勢(shì)進(jìn)行側(cè)邊欄的開(kāi)啟時(shí)會(huì)出現(xiàn)回彈效果
@property (nonatomic, assign) BOOL shouldStretchDrawer;
//獲取當(dāng)前開(kāi)啟的側(cè)邊欄類型兜材,MMDrawerSide枚舉如下:
/*typedef NS_ENUM(NSInteger,MMDrawerSide{
MMDrawerSideNone = 0,//無(wú)側(cè)邊欄
MMDrawerSideLeft,//左側(cè)邊欄
MMDrawerSideRight, //右側(cè)邊欄
};
*/@property (nonatomic, assign, readonly) MMDrawerSide openSide;
//開(kāi)啟側(cè)邊欄的手勢(shì)模式 MMOpenDrawerGestureMode枚舉意義如下
/*typedef NS_OPTIONS(NSInteger, MMOpenDrawerGestureMode){
//沒(méi)有手勢(shì) 此模式為默認(rèn)模式
MMOpenDrawerGestureModeNone = 0,
//在導(dǎo)航欄上拖動(dòng)時(shí)可以打開(kāi)側(cè)邊欄
MMOpenDrawerGestureModePanningNavigationBar = 1 << 1,
//在中心視圖控制器的視圖上拖動(dòng)時(shí)可以打開(kāi)側(cè)邊欄
MMOpenDrawerGestureModePanningCenterView = 1 << 2,
//在中心視圖控制器的視圖邊緣20個(gè)單位內(nèi)拖動(dòng)時(shí)可以打開(kāi)側(cè)邊欄
MMOpenDrawerGestureModeBezelPanningCenterView = 1 << 3,
//自定義手勢(shì) 需配合自定義手勢(shì)的方法使用
MMOpenDrawerGestureModeCustom = 1 << 4,
//所有模式兼容
MMOpenDrawerGestureModeAll= MMOpenDrawerGestureModePanningNavigationBar |MMOpenDrawerGestureModePanningCenterView |MMOpenDrawerGestureModeBezelPanningCenterView |MMOpenDrawerGestureModeCustom,
};*/
@property (nonatomic, assign) MMOpenDrawerGestureMode openDrawerGestureModeMask;
//關(guān)閉側(cè)邊欄的手勢(shì)模式 MMCloseDrawerGestureMode枚舉的意義如下
/*typedef NS_OPTIONS(NSInteger, MMCloseDrawerGestureMode) {
//沒(méi)有關(guān)閉手勢(shì)
MMCloseDrawerGestureModeNone= 0,
//在導(dǎo)航欄上拖動(dòng)時(shí)可以關(guān)閉側(cè)邊欄
MMCloseDrawerGestureModePanningNavigationBar= 1 << 1,
//在中心視圖控制器上推動(dòng)時(shí)可以關(guān)閉側(cè)邊欄
MMCloseDrawerGestureModePanningCenterView= 1 << 2,
//在中心視圖控制器邊緣20單位內(nèi)拖動(dòng)是可以關(guān)閉側(cè)邊欄
MMCloseDrawerGestureModeBezelPanningCenterView= 1 << 3,
//點(diǎn)擊導(dǎo)航欄時(shí)可以關(guān)閉側(cè)邊欄
MMCloseDrawerGestureModeTapNavigationBar = 1 << 4,
//點(diǎn)擊中心視圖控制器視圖時(shí)可以關(guān)閉側(cè)邊欄
MMCloseDrawerGestureModeTapCenterView= 1 << 5,
//在側(cè)邊欄視圖上拖動(dòng)時(shí)可以關(guān)閉側(cè)邊欄
MMCloseDrawerGestureModePanningDrawerView= 1 << 6,
//自定義關(guān)閉手勢(shì),需要和自定義手勢(shì)的方法結(jié)合使用
MMCloseDrawerGestureModeCustom= 1 << 7,
//所有模式兼容
MMCloseDrawerGestureModeAll = MMCloseDrawerGestureModePanningNavigationBar|MMCloseDrawerGestureModePanningCenterView|MMCloseDrawerGestureModeBezelPanningCenterView|MMCloseDrawerGestureModeTapNavigationBar |MMCloseDrawerGestureModeTapCenterView|MMCloseDrawerGestureModePanningDrawerView|MMCloseDrawerGestureModeCustom,
};*/
@property (nonatomic, assign) MMCloseDrawerGestureMode closeDrawerGestureModeMask;
//設(shè)置側(cè)邊欄顯示時(shí)的中心視圖控制器的用戶交互規(guī)則 MMDrawerOpenCenterInteractionMode枚舉意義如下
/*typedef NS_ENUM(NSInteger, MMDrawerOpenCenterInteractionMode) {
//中心視圖控制器不能進(jìn)行用戶交互 默認(rèn)為此枚舉
MMDrawerOpenCenterInteractionModeNone,
//中心視圖控制器完全可以進(jìn)行用戶交互
MMDrawerOpenCenterInteractionModeFull,
//中心視圖控制器只有導(dǎo)航可以進(jìn)行用戶交互
MMDrawerOpenCenterInteractionModeNavigationBarOnly,
};*/
@property (nonatomic, assign) MMDrawerOpenCenterInteractionMode centerHiddenInteractionMode;
//設(shè)置是否顯示陰影效果
@property (nonatomic, assign) BOOL showsShadow;
//設(shè)置是否顯示狀態(tài)欄的自定義視圖 只有在iOS7之后可用
@property (nonatomic, assign) BOOL showsStatusBarBackgroundView;
//設(shè)置狀態(tài)欄視圖顏色 只有在iOS7之后可用
@property (nonatomic, strong) UIColor * statusBarViewBackgroundColor;
//相關(guān)方法解析如下:
//切換側(cè)邊欄的狀態(tài)逞力,drawerSide參數(shù)為要切換的側(cè)邊欄曙寡,animated設(shè)置是否有動(dòng)畫(huà)效果,completion會(huì)在切換完成后執(zhí)行
//注意:如果在切換一個(gè)關(guān)著的側(cè)邊欄時(shí)寇荧,如果另一個(gè)側(cè)邊欄正在開(kāi)啟狀態(tài)举庶,則此方法不會(huì)有任何效果
-(void)toggleDrawerSide:(MMDrawerSide)drawerSide animated:(BOOL)animated completion:(void(^)(BOOL finished))completion;
//關(guān)閉側(cè)邊欄
-(void)closeDrawerAnimated:(BOOL)animated completion:(void(^)(BOOL finished))completion;
//開(kāi)啟側(cè)邊欄-(void)openDrawerSide:(MMDrawerSide)drawerSide animated:(BOOL)animated completion:(void(^)(BOOL finished))completion;
//更換中心視圖控制器
-(void)setCenterViewController:(UIViewController *)centerViewController withCloseAnimation:(BOOL)closeAnimated completion:(void(^)(BOOL finished))completion;-(void)setCenterViewController:(UIViewController *)newCenterViewController withFullCloseAnimation:(BOOL)fullCloseAnimated completion:(void(^)(BOOL finished))completion;
//設(shè)置左側(cè)邊欄最大寬度
-(void)setMaximumLeftDrawerWidth:(CGFloat)width animated:(BOOL)animated completion:(void(^)(BOOL finished))completion;
//設(shè)置右側(cè)邊欄最大寬度
-(void)setMaximumRightDrawerWidth:(CGFloat)width animated:(BOOL)animated completion:(void(^)(BOOL finished))completion;
//進(jìn)行側(cè)邊欄的預(yù)覽操作 默認(rèn)預(yù)覽距離為40個(gè)單位
-(void)bouncePreviewForDrawerSide:(MMDrawerSide)drawerSide completion:(void(^)(BOOL finished))completion;
//進(jìn)行側(cè)邊欄的預(yù)覽操作 可以設(shè)置預(yù)覽距離
-(void)bouncePreviewForDrawerSide:(MMDrawerSide)drawerSide distance:(CGFloat)distance completion:(void(^)(BOOL finished))completion;
//這個(gè)方法用于進(jìn)行視圖側(cè)邊欄視圖出現(xiàn)動(dòng)畫(huà)的自定義
-(void)setDrawerVisualStateBlock:(void(^)(MMDrawerController * drawerController, MMDrawerSide drawerSide, CGFloat percentVisible))drawerVisualStateBlock;
//這個(gè)方法用于設(shè)置當(dāng)一個(gè)手勢(shì)觸發(fā)完成后的回調(diào)
-(void)setGestureCompletionBlock:(void(^)(MMDrawerController * drawerController, UIGestureRecognizer * gesture))gestureCompletionBlock;
//這個(gè)方法用于定義自定義的手勢(shì)操作 要將開(kāi)啟側(cè)邊欄與關(guān)閉側(cè)邊欄的模式設(shè)置為MMOpenDrawerGestureModeCustom和MMCloseDrawerGestureModeCustom才有效
-(void)setGestureShouldRecognizeTouchBlock:(BOOL(^)(MMDrawerController * drawerController, UIGestureRecognizer * gesture, UITouch * touch))gestureShouldRecognizeTouchBlock;
//對(duì)于自定義過(guò)渡動(dòng)畫(huà)的方法:
-(void)setDrawerVisualStateBlock:(void(^)(MMDrawerController * drawerController, MMDrawerSide drawerSide, CGFloat percentVisible))drawerVisualStateBlock;
//回調(diào)block中會(huì)傳遞進(jìn)來(lái)側(cè)邊欄顯示完成的百分比,并且在側(cè)邊欄出現(xiàn)過(guò)程中揩抡,這個(gè)回調(diào)block會(huì)被不停刷新調(diào)用户侥,開(kāi)發(fā)者可以直接在其中對(duì)要過(guò)渡的屬性進(jìn)行設(shè)置,例如透明度的漸變動(dòng)畫(huà)峦嗤,示例如下:
//進(jìn)行自定義動(dòng)畫(huà)
[rootController setDrawerVisualStateBlock:^(MMDrawerController *drawerController, MMDrawerSide drawerSide, CGFloat percentVisible) {
UIViewController * sideDrawerViewController;
if(drawerSide == MMDrawerSideLeft) {
sideDrawerViewController = drawerController.leftDrawerViewController;
}else if (drawerSide == MMDrawerSideRight) {
sideDrawerViewController = drawerController.rightDrawerViewController;
}
[sideDrawerViewController.view setAlpha:percentVisible];
}];
三蕊唐、關(guān)于MMDrawerController的子類 開(kāi)發(fā)者如果有特殊的需求,也可以通過(guò)繼承MMDrawerController來(lái)實(shí)現(xiàn)自己的側(cè)邊欄控制器類烁设,MMDrawerController框架中提供了一個(gè)擴(kuò)展替梨,在編寫(xiě)MMDrawerController時(shí),開(kāi)發(fā)者可以導(dǎo)入MMDrawerController+Subclass.h文件装黑,這個(gè)文件中提供了許多控制器的監(jiān)聽(tīng)方法供開(kāi)發(fā)者重寫(xiě)副瀑,解析如下:
//出現(xiàn)單擊手勢(shì)會(huì)回調(diào)的方法 如果要重寫(xiě) 必須調(diào)用父類的此方法
-(void)tapGestureCallback:(UITapGestureRecognizer *)tapGesture __attribute((objc_requires_super));
//出現(xiàn)滑動(dòng)手勢(shì)會(huì)回調(diào)的方法 如果要重寫(xiě) 必須調(diào)用父類的此方法
-(void)panGestureCallback:(UIPanGestureRecognizer *)panGesture __attribute((objc_requires_super));
//決定是否響應(yīng)某個(gè)手勢(shì)
-(BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldReceiveTouch:(UITouch *)touch __attribute((objc_requires_super));
//準(zhǔn)備展示側(cè)邊欄時(shí)調(diào)用的方法
-(void)prepareToPresentDrawer:(MMDrawerSide)drawer animated:(BOOL)animated __attribute((objc_requires_super));
//關(guān)閉側(cè)邊欄時(shí)調(diào)用的方法-(void)closeDrawerAnimated:(BOOL)animated velocity:(CGFloat)velocity animationOptions:(UIViewAnimationOptions)options completion:(void (^)(BOOL))completion __attribute((objc_requires_super));
//打開(kāi)側(cè)邊欄時(shí)調(diào)用的方法
-(void)openDrawerSide:(MMDrawerSide)drawerSide animated:(BOOL)animated velocity:(CGFloat)velocity animationOptions:(UIViewAnimationOptions)options completion:(void (^)(BOOL))completion __attribute((objc_requires_super));
//設(shè)備旋轉(zhuǎn)方向時(shí)調(diào)用的方法
-(void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration __attribute((objc_requires_super));
-(void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration __attribute((objc_requires_super));
四、一些輔助類 MMDrawerController框架中還提供了一個(gè)MMDrawerBarButtonItem的輔助類曹体,這個(gè)類可以創(chuàng)建三道杠的菜單按鈕。其中方法如下:
//初始化方法
-(id)initWithTarget:(id)target action:(SEL)action;
//獲取某個(gè)狀態(tài)下的按鈕顏色
-(UIColor *)menuButtonColorForState:(UIControlState)state __attribute__((deprecated("Use tintColor instead")));
//設(shè)置某個(gè)狀態(tài)的按鈕顏色
-(void)setMenuButtonColor:(UIColor *)color forState:(UIControlState)state __attribute__((deprecated("Use tintColor instead")));
// MMDrawerBarButtonItem繼承自UIBarButtonItem硝烂,可以直接在導(dǎo)航欄上使用箕别。
前面有提到,側(cè)邊欄的展現(xiàn)動(dòng)畫(huà)開(kāi)發(fā)者可以進(jìn)行自定義,為了使開(kāi)發(fā)者在使用MMDrawerController時(shí)更加方便串稀,MMDrawerController框架中還提供了一個(gè)動(dòng)畫(huà)輔助類MMDrawerVisualState除抛,這個(gè)類中封裝好了許多動(dòng)畫(huà)效果,開(kāi)發(fā)者可以直接使用母截,示例如下:
//使用提供的動(dòng)畫(huà)模板
[rootController setDrawerVisualStateBlock:[MMDrawerVisualState slideAndScaleVisualStateBlock]];
//MMDrawerVisualState中所提供的動(dòng)畫(huà)模板列舉如下:
//從后向前漸現(xiàn)
+(MMDrawerControllerDrawerVisualStateBlock)slideAndScaleVisualStateBlock;
//滑動(dòng)漸現(xiàn)
+(MMDrawerControllerDrawerVisualStateBlock)slideVisualStateBlock;
//立方動(dòng)畫(huà)
+(MMDrawerControllerDrawerVisualStateBlock)swingingDoorVisualStateBlock;
//視差動(dòng)畫(huà)
+(MMDrawerControllerDrawerVisualStateBlock)parallaxVisualStateBlockWithParallaxFactor:(CGFloat)parallaxFactor;
五到忽、MMDrawerController無(wú)法完成的需求 為了確保MMDrawerController庫(kù)的輕量級(jí),其作者在設(shè)計(jì)時(shí)也做了功能上的取舍權(quán)衡清寇,MMDrawerController無(wú)法完成以下需求:
1.上邊欄與下邊欄喘漏。
2.同時(shí)展示左邊欄與又邊欄。
3.無(wú)法設(shè)置顯示一個(gè)最小的抽屜寬度华烟。
4.不能支持UITabBarController容器翩迈。
5.不能在中心視圖控制器之上呈現(xiàn)側(cè)邊欄視圖。