抽屉效果目前比较有名的有第三方RESideMenu和MMDrawerController。但是项目要求抽屉效果为拉出形式，并且要有黑色透明遮罩层，然后在GitHub发现了一个更好用的库ViewDeck
ViewDeck
- 支持左边和右边侧边栏
- 抽屉拉出效果，带有黑色透明遮罩层
- 支持点击和滑动打开、关闭侧边栏
- 侧边栏显示内容尺寸可以控制
- 省心省力，简洁好用，快速集成
目前侧滑关闭功能仅在示例demo里，作者并未发布到cocoapods issues。通过pods方式导入的并没有侧滑关闭功能，如需侧滑功能，请手动导入本demo或GitHub demo ViewDeck文件夹 —20190105
ViewDeck抽屉效果.gif
1.配置侧边栏
UITabBarController *tarBarCtr=[[UITabBarController alloc]init];
[tarBarCtr setViewControllers:[NSArray arrayWithObjects:centNvi,centSecNvi, nil]];
_rootTabbarCtrV=tarBarCtr;
//左边view 采用xib多种形式研究
LeftSideViewController *leftVC =[[LeftSideViewController alloc]initWithNibName:@"LeftSideViewController" bundle:[NSBundle mainBundle]];
//右边
RightSideViewController *rightView=[[RightSideViewController alloc]init];
UINavigationController *rightNvi=[[UINavigationController alloc]initWithRootViewController:rightView];
//配置侧边栏
IIViewDeckController *viewDeckController =[[IIViewDeckController alloc]initWithCenterViewController:_rootTabbarCtrV leftViewController:leftVC rightViewController:rightNvi];
//只有左侧边栏
// IIViewDeckController *viewDeckController =[[IIViewDeckController alloc]initWithCenterViewController:_rootTabbarCtrV leftViewController:leftVC];
viewDeckController.delegate=self;
self.window.rootViewController=viewDeckController;
2.首页点击侧边栏按钮和跳转下一页
通过openSide:(IIViewDeckSide)方法可以左、右侧边栏; panningEnabled属性仅可以控制滑动打开关闭，但点击关闭和openSide:打开是不在这个属性的控制范围内的
typedef NS_ENUM(NSInteger, IIViewDeckSide) {
IIViewDeckSideNone = 0, /// This identifies no side, basically meaning that neither the left nor the right side is relevant.
IIViewDeckSideLeft, /// This identifies the left view controller of an IIViewDeckController
IIViewDeckSideRight, /// This identifies the right view controller of an IIViewDeckController
IIViewDeckSideUnknown = IIViewDeckSideNone, /// This has the same logic as IIViewDeckSideNone but means that the side is yet unknown.
IIViewDeckLeftSide __deprecated_enum_msg("Use IIViewDeckSideLeft instead.") = IIViewDeckSideLeft,
IIViewDeckRightSide __deprecated_enum_msg("Use IIViewDeckSideRight instead.") = IIViewDeckSideRight,
};
//点击打开左侧侧边栏
-(void)actionOfTapLeftEvent{
[self.viewDeckController openSide:IIViewDeckSideLeft animated:YES];
}
//跳转下一页
-(void)actionOfTapRightEvent{
InfoViewController *infoView=[[InfoViewController alloc]init];
[infoView setHidesBottomBarWhenPushed:YES];
//不需要类似RESideMenu把panGestureEnabled关闭
[self.navigationController pushViewController:infoView animated:YES];
}
3.侧边栏显示内容宽度设置和跳转
通过preferredContentSize属性设置侧边栏的内容宽度尺寸
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view from its nib.
//ViewDeck默认高度始终是视图控制器本身的高度上
self.preferredContentSize = CGSizeMake(ScreenWidth/3*2, ScreenHeight);
self.view.backgroundColor=[UIColor whiteColor];
}
- (IBAction)goNextView:(UIButton *)sender {
/**
关闭侧边栏
*/
[self.viewDeckController closeSide:YES];
UINavigationController *navCtr= ((AppDelegate*)[UIApplication sharedApplication].delegate).rootTabbarCtrV.selectedViewController;
InfoViewController *infoView=[[InfoViewController alloc]init];
[infoView setHidesBottomBarWhenPushed:YES];
[navCtr pushViewController:infoView animated:YES];
}
4.打开关闭IIViewDeckControllerDelegate代理
可以通过代理控制某些情况下才能打开侧边栏等情况，也可以做些打开关闭时的相关操作
//即将打开侧边栏。 return NO 侧滑无法打开，但通过openSide:方法可以强行打开；
- (BOOL)viewDeckController:(IIViewDeckController *)viewDeckController willOpenSide:(IIViewDeckSide)side;
//已经打开侧边栏。可以做一些后续操作
- (void)viewDeckController:(IIViewDeckController *)viewDeckController didOpenSide:(IIViewDeckSide)side;
//即将关闭
- (BOOL)viewDeckController:(IIViewDeckController *)viewDeckController willCloseSide:(IIViewDeckSide)side;
//即将打开
- (void)viewDeckController:(IIViewDeckController *)viewDeckController didCloseSide:(IIViewDeckSide)side;
4.关闭侧边栏时，可滑动关闭
IIViewDeckController.mm 源码文件中，decorationTapGestureRecognizer、dismissGestureRecognizer是关闭侧边栏的手势，其中一个是点击关闭一个是新加的滑动关闭
@property (nonatomic) UIScreenEdgePanGestureRecognizer *leftEdgeGestureRecognizer;
@property (nonatomic) UIScreenEdgePanGestureRecognizer *rightEdgeGestureRecognizer;
@property (nonatomic) UITapGestureRecognizer *decorationTapGestureRecognizer;
//滑动关闭侧边栏
@property (nonatomic) UIPanGestureRecognizer *dismissGestureRecognizer;
下面这个库是个古董级的，不过功能齐全，实际使用除了个别需要注意外也还不错。欢迎体验： REFrostedViewController
REFrostedViewController
- 侧边栏显示内容尺寸可以控制
- 抽屉拉出效果，带有黑色透明遮罩层
- 可以侧滑关闭(重点)
- 缺点：仅支持单边侧边栏(左边或右边)
- 缺点：显示侧边栏时需要手动实现滑动手势，会有隐藏隐患
- 缺点：拉出和关闭时，黑色遮罩并不完美
- 缺点：已经停止维护了三四年了(老古董了)
1.配置侧边栏
//侧边栏
REFMenuViewController *menuView = [[REFMenuViewController alloc]init];
REFrostedViewController *rostedViewController = [[REFrostedViewController alloc] initWithContentViewController:tarBarCtr menuViewController:menuView];
rostedViewController.direction = REFrostedViewControllerDirectionLeft;
rostedViewController.liveBlurBackgroundStyle = REFrostedViewControllerLiveBackgroundStyleDark;
rostedViewController.liveBlur = YES;
rostedViewController.limitMenuViewSize = YES;
rostedViewController.backgroundFadeAmount=0.5;
rostedViewController.delegate = self;
rostedViewController.menuViewSize=CGSizeMake(leftSideMeunWidth, ScreenHeight);
2.首页点击侧边栏按钮和跳转下一页
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
self.navigationItem.title=@"首页";
UIBarButtonItem *leftBarButton = [[UIBarButtonItem alloc]initWithTitle:@"左边栏" style:UIBarButtonItemStylePlain target:self action:@selector(actionOfTapLeftEvent:)];
self.navigationItem.leftBarButtonItem=leftBarButton;
UIBarButtonItem *rightBarButton=[[UIBarButtonItem alloc]initWithTitle:@"下一页" style:UIBarButtonItemStylePlain target:self action:@selector(actionOfTapRightEvent)];
self.navigationItem.rightBarButtonItem=rightBarButton;
/**
如需要侧滑显示侧边栏，则要实现滑动手势
*/
[self.view addGestureRecognizer:[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panGestureRecognized:)]];
[self creatVC];
}
//点击显示侧边栏
-(void)actionOfTapLeftEvent:(UIButton *)sender{
[self.frostedViewController presentMenuViewController];
}
//滑动显示侧边栏
- (void)panGestureRecognized:(UIPanGestureRecognizer *)sender{
[self.frostedViewController panGestureRecognized:sender];
}
3.侧边栏关闭和跳转
//跳转下一页
-(void)actionOfTapRightEvent{
/**
关闭右侧侧边栏
*/
[self.frostedViewController hideMenuViewController];
UINavigationController *navCtr= ((AppDelegate*)[UIApplication sharedApplication].delegate).rootTabbarCtrV.selectedViewController;
REFInfoViewController *infoView=[[REFInfoViewController alloc]init];
[infoView setHidesBottomBarWhenPushed:YES];
[navCtr pushViewController:infoView animated:YES];
}
4.当视图内含有UIScrollView时，会导致侧滑失效，解决方案之一可以继承UIScrollView并实现如下：
/**
* 重写手势，如果是左滑，则禁用掉scrollview自带的；右滑很少出现，此处未实现
*/
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer{
if([gestureRecognizer isKindOfClass:[UIPanGestureRecognizer class]])
{
UIPanGestureRecognizer *pan = (UIPanGestureRecognizer *)gestureRecognizer;
if([pan translationInView:self].x > 0.0f && self.contentOffset.x == 0.0f)
{
return NO;
}
}
return [super gestureRecognizerShouldBegin:gestureRecognizer];
}
最后小demo附上：ViewDeckStudy 内含ViewDeck和REFrostedViewController使用
