首先，效果图
qq侧边栏滑动.gif
实现思路：
基本布局： 左边自定义一个View，右边的主视图是TabBarVc，然后这两个添加在根视图上，并且设置TabBarVC成为根视图控制器的子视图（方便TabBarVC接受事件，并处理事件）
具体操作： 给根视图控制器添加一个拖拽手势，通过判断手势是否结束和拖拽的偏移量是否大于屏幕宽的一半（这个自己定义界限）来决定怎么改变左右view的形变属性
思路图.png
具体代码
//
// RootViewController.m
// QQ侧边栏效果
//
// Created by liyang on 16/8/8.
// Copyright © 2016年 liyang. All rights reserved.
//
#import "RootViewController.h"
#import "MainViewController.h"
#import "LeftView.h"
#define kAnimateDuration 0.5
#define kOffset_x self.view.frame.size.width * 3 / 4 // 偏移量
@interface RootViewController ()
@property (nonatomic, strong) LeftView *leftView;
@property (nonatomic, strong) UIButton *coverView;
@end
@implementation RootViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
[self setupUI];
}
- (void)setupUI
{
LeftView *leftView = [LeftView leftView];
leftView.frame = CGRectMake(-kOffset_x, 0, kOffset_x, self.view.frame.size.height);
[self.view addSubview:leftView];
self.leftView = leftView;
MainViewController *mainVc = [[MainViewController alloc] init];
UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:mainVc];
mainVc.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"左侧按钮" style:UIBarButtonItemStylePlain target:self action:@selector(leftBarBtn:)];
UITabBarController *barVc = [[UITabBarController alloc] init];
[barVc addChildViewController:nav];
[self addChildViewController:barVc];
[self.view addSubview:barVc.view];
nav.tabBarItem.title = @"首页";
UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panTheView:)];
[self.view addGestureRecognizer:pan];
}
/**
* 给主视图添加一个按钮挡板
*
* @param view 视图
*/
- (void)addCoverToView:(UIView *)view
{
UIButton *cover = [[UIButton alloc] initWithFrame:view.bounds];
[cover addTarget:self action:@selector(coverPressed:) forControlEvents:UIControlEventTouchUpInside];
[view addSubview:cover];
self.coverView = cover;
}
// 点击了coverView
- (void)coverPressed:(UIButton *)sender
{
[sender removeFromSuperview];
UINavigationController *nav = [self.childViewControllers firstObject];
[UIView animateWithDuration:kAnimateDuration animations:^{
// clear transform
nav.view.transform = CGAffineTransformIdentity;
self.leftView.transform = CGAffineTransformIdentity;
}];
}
// navBar上的左侧按钮
- (void)leftBarBtn:(UIBarButtonItem *)sender
{
UINavigationController *nav = [self.childViewControllers firstObject];
[UIView animateWithDuration:kAnimateDuration animations:^{
// animation of View controller
UIView *view = nav.view;
// add cover
[self addCoverToView:view];
view.transform = CGAffineTransformMakeTranslation(kOffset_x, 0);
// animation of left menu
self.leftView.transform = CGAffineTransformMakeTranslation(kOffset_x, 0);
}];
}
// 主视图上的拖拽手势
- (void)panTheView:(UIPanGestureRecognizer *)sender
{
UINavigationController *nav = [self.childViewControllers firstObject];
UIView *view = nav.view;
CGPoint translation = [sender translationInView:self.view];
CGFloat width = self.view.frame.size.width;
// 判断此时手势是否结束了
if (sender.state == UIGestureRecognizerStateEnded) {
// 结束
// 判断偏移量是否大于屏幕宽度的一半
if (translation.x > width/2) {
// 大于的话，改变左右的偏移量到指定位置
[UIView animateWithDuration:kAnimateDuration animations:^{
NSLog(@"动画进行中");
view.transform = CGAffineTransformMakeTranslation(kOffset_x, 0);
// animation of left menu
self.leftView.transform = CGAffineTransformMakeTranslation(kOffset_x, 0);
} completion:^(BOOL finished) {
NSLog(@"动画完成");
[self addCoverToView:view];
}];
}else{
// 没有大于，清除偏移量
[UIView animateWithDuration:kAnimateDuration animations:^{
// clear transform
nav.view.transform = CGAffineTransformIdentity;
self.leftView.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished) {
// 移除coverView
if (self.coverView) {
[self.coverView removeFromSuperview];
}
}];
}
}else{
// 手势动作还没有结束
// 判断 偏移量有没有大于kOffset_x
if (translation.x <= kOffset_x && translation.x > 0){
// 不大于kOffset_x,并且偏移量是正的，左右偏移量随着拖拽改变
self.leftView.transform = CGAffineTransformMakeTranslation(translation.x, 0);
view.transform = CGAffineTransformMakeTranslation(translation.x, 0);
}else if (translation.x < 0){
// 此时小于0,说明往左滑动，用户是要关闭leftView，我们清空形变
[UIView animateWithDuration:kAnimateDuration animations:^{
self.leftView.transform = CGAffineTransformIdentity;
view.transform = CGAffineTransformIdentity;
}];
}
}
}
@end
demo地址