美文网首页iOS技巧学习_JM小知识Xcode常用开发技巧
使用MMDrawerController的侧面抽屉push页面

使用MMDrawerController的侧面抽屉push页面

作者: Yancy_90 | 来源:发表于2016-04-29 13:19 被阅读4481次

最近开发中的一个需求是将以前UITabBarController管理的页面结构,改成抽屉效果,所以我就使用了MMDrawerController这个开源框架,github地址https://github.com/mutualmobile/MMDrawerController
  MMDrawerController具体的用法这里就不详细说了,大家可以参考 这篇文章-iOS-MMDrawerController的使用。我们现在的需求是左侧抽屉打开后点击上面的按钮push出下一个页面,当这个push出来的页面pop回来以后左侧抽屉仍然保持打开的状态。

简单集成后的效果.gif

  上图这样显然不是想要的效果。push出的页面应该从屏幕的边缘出现才对嘛!就像下图这样:

想要的效果.gif
  我想到的思路是当点击PUSH按钮的时候,将当前屏幕截图,然后添加到左边抽屉的View上,同时调整抽屉的maximumLeftDrawerWidth为屏幕的宽度并取消阴影。在左侧控制器的- (void)viewDidAppear:(BOOL)animated方法中移除截屏图片,并且将maximumLeftDrawerWidth恢复为初始宽度并恢复显示阴影,这样pop回来以后页面看起来就跟push前一样了。
/// 添加当前页面的截屏
- (void)addCurrentPageScreenshot {
    
    UIImage *screenImage = [UIImage screenshot];
    UIImageView *imgView = [[UIImageView alloc] initWithImage:screenImage];
    imgView.image = screenImage;
    [self.view addSubview:imgView];
    self.coverImageView = imgView;
    
}

/// 设置抽屉视图pop后的状态
- (void)settingDrawerWhenPop {
    
    self.mm_drawerController.maximumLeftDrawerWidth = [UIScreen mainScreen].bounds.size.width - 50;
    self.mm_drawerController.showsShadow = YES;
    self.mm_drawerController.closeDrawerGestureModeMask = MMCloseDrawerGestureModeAll;
    [self.coverImageView removeFromSuperview];
    self.coverImageView = nil;
    
}

/// 设置抽屉视图push后的状态
- (void)settingDrawerWhenPush {
    
    [self.mm_drawerController setMaximumLeftDrawerWidth:[UIScreen mainScreen].bounds.size.width];
    self.mm_drawerController.showsShadow = NO;
    // 这里一定要关闭手势,否则隐藏在屏幕右侧的drawer可以被拖拽出来
    self.mm_drawerController.closeDrawerGestureModeMask = MMCloseDrawerGestureModeNone;
    
}
- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear:animated];
    
    [self settingDrawerWhenPop];
}

- (void)gotoSetting:(UIButton *)sender {
    
    [self addCurrentPageScreenshot];
    [self settingDrawerWhenPush];
    
    SettingViewController *settingVc = [[SettingViewController alloc] init];
    [self.navigationController pushViewController:settingVc animated:YES];
}

**-- 顺便贴出截屏的方法 -- **

#import "UIImage+Extension.h"

@implementation UIImage (Extension)

/// 截屏
+ (UIImage *)screenshot {
    
    CGSize imageSize = [[UIScreen mainScreen] bounds].size;
    
    UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0);
    
    
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    for (UIWindow *window in [[UIApplication sharedApplication] windows]) {
        if (![window respondsToSelector:@selector(screen)] || [window screen] == [UIScreen mainScreen]) {
            CGContextSaveGState(context);
            
            CGContextTranslateCTM(context, [window center].x, [window center].y);
            
            CGContextConcatCTM(context, [window transform]);
            
            CGContextTranslateCTM(context,
                                  -[window bounds].size.width * [[window layer] anchorPoint].x,
                                  -[window bounds].size.height * [[window layer] anchorPoint].y);
            
            [[window layer] renderInContext:context];
            
            CGContextRestoreGState(context);
        }
    }
    
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    
    UIGraphicsEndImageContext();
    
    return image;
}

@end

如果各位有其他方法或者思路,一起讨论一下吧!
Demo代码在这里https://github.com/yzxcool123/MMDrawerController-Demo.git

相关文章

网友评论

  • bb4cf902bdbc:你好 我想问一下 我做这个抽屉效果,左抽屉的宽度设定为200!!但是在这个左抽屉界面去加控件时候,控件以整个手机屏幕为标准加的 这个如何解决呢
  • Z了个Y:请教下楼主 如何给centerviewController设置遮罩呢
    Yancy_90:@Z了个Y :joy::joy::joy:
    Z了个Y:@风雨彩虹_df4c 没有:cry:
    05b03de73f9f:这个问题 解决了吗?
  • 梁景华Joshua_:博主你这个有很大的bug啊,不知道有没有找到更好的解决方案呢?push过去后,nav是有问题的,手势慢慢返回的时候也是有问题的。
    Yancy_90:@梁景华Joshua_ 你这是用中间控制器push的啊?
    梁景华Joshua_:@Yancy_90 其实我是想问,push后再返回的时候,如何不隐藏侧滑页面。

    - (void)setViewController:(UIViewController *)viewController{
    [self.mm_drawerController closeDrawerAnimated:YES completion:^(BOOL finished) {
    [self.mm_drawerController setOpenDrawerGestureModeMask:MMOpenDrawerGestureModeNone];
    }];
    viewController.hidesBottomBarWhenPushed = YES;
    UITabBarController * nav = (UITabBarController*)self.mm_drawerController.centerViewController;
    UINavigationController *vc = nav.viewControllers[nav.selectedIndex];
    [vc pushViewController:viewController animated:YES];

    }
    我现在是这样进行跳转的
    Yancy_90:我项目中一直用着啊,你可以下载OnFire 看看。
  • 阿拉斯加的狗:楼主 请问 现在我要隐藏抽屉怎么办呢 在一个cenerVc中 隐藏leftVc 我找了没找到这个隐藏的办法. 求解释 感谢了
    Yancy_90:@阿拉斯加的狗 这...初始化的时候左边和中间控制器肯定都创建好了吧, 我觉得你可以在父类里面监听横竖屏的方法里面控制, 如果是横屏的话关闭抽屉并且将它设置为不能打开, 竖屏的话再恢复可打开的状态 :flushed:
    阿拉斯加的狗:@Yancy_90 是这样的 我的需求是横屏跟竖屏两个页面 竖屏的时候才会有抽屉的那种效果 现在打横了 页面还是会有那种效果 怎么做到只要竖屏才会出现抽屉而横屏没有抽屉呢(ps: 横竖屏是两个完全不一样的页面 而且可以随时进行切换)
    Yancy_90:@阿拉斯加的狗 不太明白你的需求,隐藏是去掉还是只是把抽屉关上呢?试一下用通知可以么。
  • 7d0e5c9e8949:Appdelegate中给MMDrawerController加个导航控制器,设置为window的跟控制器,用这个导航控制器push不行么,这样多麻烦
    Yancy_90:@Tdreamy 可能是各自项目的需求不一样吧,我只是把我想到解决方法分享一下,如果有更好的方法那再好不过了,你说的这个我写下试试! :blush:
  • hhgvg:加上底部的tab怎么处理
    Yancy_90:@hhgvg 不用吧 我们的APP里面也是中间是TabbarController没有影响呀?
    hhgvg:@叶忠祥 恩 每一次打开设置新控制器 都要控制tabbart的隐藏
    Yancy_90:@hhgvg 底部的tabbar通常是放在中间的控制器吧?
  • 爱自由鹏:在push出的新页面点击back的时候,centerView的黄色小条区域有明显的刷新卡顿,怎样解决?
    爱自由鹏:@cj2527 我没解决,换了别的样式做
    Yancy_90:@爱自由鹏 在真机上不会卡顿吧?
    cj2527:@爱自由鹏 对啊,同问
  • JackieZeng:学习了。

本文标题:使用MMDrawerController的侧面抽屉push页面

本文链接:https://www.haomeiwen.com/subject/hcnhrttx.html