iOS学习笔记-070.手势识别04——抽屉控件使用

手势识别04—抽屉控件使用

一、抽屉控件

我们对前面的抽屉控件进行细微的改变，说白了就是为了，外部能够拿到我们的三个控件

1.1 DragViewController.h

//
//  DragViewController.h
//  03_UIView62_抽屉效果
//
//  Created by 杞文明 on 17/4/2.
//  Copyright © 2017年 杞文明. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface DragViewController : UIViewController
@property(weak,nonatomic,readonly)UIView* leftView;
@property(weak,nonatomic,readonly)UIView* rightView;
@property(weak,nonatomic,readonly)UIView* mainView;
@end

1.2 DragViewController.m

//
//  DragViewController.m
//  03_UIView62_抽屉效果
//
//  Created by 杞文明 on 17/4/2.
//  Copyright © 2017年 杞文明. All rights reserved.
//

#import "DragViewController.h"

#define screenW [UIScreen mainScreen].bounds.size.width

@interface DragViewController ()
@end

@implementation DragViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    //创建布局
    [self createLayout];
    //添加手势
    [self addGesture];
}

-(void)createLayout{
    //创建leftView
    UIView * leftV = [[UIView alloc]initWithFrame:self.view.bounds];
    leftV.backgroundColor = [UIColor blueColor];
    [self.view addSubview:leftV];
    _leftView = leftV;

    //创建rightView
    UIView * rightV = [[UIView alloc]initWithFrame:self.view.bounds];
    rightV.backgroundColor = [UIColor redColor];
    [self.view addSubview:rightV];
    _rightView = rightV;

    //创建mainView
    UIView * mainV = [[UIView alloc]initWithFrame:self.view.bounds];
    mainV.backgroundColor = [UIColor greenColor];
    [self.view addSubview:mainV];
    _mainView = mainV;

}

-(void)addGesture{
    //给mainView添加拖动手势
    UIPanGestureRecognizer * pan = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panGesture:)];
    [self.mainView addGestureRecognizer:pan];
    //给控制器的view添加点击手势，一点击，就回到主界面上来
    UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tapGesture)];
    [self.view addGestureRecognizer:tap];
}

-(void)tapGesture{
    //mainView复位
    [UIView animateWithDuration:0.1 animations:^{
        self.mainView.frame = self.view.bounds;
    }];
}


#define targetR 275
#define targetL -275
-(void)panGesture:(UIPanGestureRecognizer*)pan{
    //获取到偏移量量
    CGPoint panP =[pan translationInView:self.mainView];
    //为什么不使用transform,是因为我们还要去修改高度,使用transform,只能修改,x,y
    //self.mainV.transform = CGAffineTransformTranslate(self.mainV.transform, transP.x, 0);

    self.mainView.frame = [self frameWithOffsetX:panP.x];
    //判断拖动方向
    if (self.mainView.frame.origin.x>0) {//右
        self.rightView.hidden = YES;
    } else if(self.mainView.frame.origin.x<0){//左
        self.rightView.hidden = NO;
    }

    //自动点位计算
    //拖动结束以后做判断
    //1.x值大于一半的屏幕宽度，说明在右侧
    //2.maxX值小于一半的屏幕宽度，说明在左侧
    CGFloat target = 0;
    if(pan.state == UIGestureRecognizerStateEnded){
        if(self.mainView.frame.origin.x > 0.5*screenW){//右侧
            target = targetR;
        }else if(CGRectGetMaxX(self.mainView.frame) < 0.5*screenW){
            //获取最大的x值，判断，当前是小于屏幕的一半
            target = targetL;
        }
        //计算view的frame
        CGFloat offSet = target - self.mainView.frame.origin.x;
        [UIView animateWithDuration:0.1 animations:^{
            self.mainView.frame = [self frameWithOffsetX:offSet];
        }];
    }

    [pan setTranslation:CGPointZero inView:self.mainView];
}

#define maxY 100
//根据偏移量计算MainV的frame
- (CGRect)frameWithOffsetX:(CGFloat)offsetX {
    CGRect frame = self.mainView.frame;
    //x值的计算
    frame.origin.x += offsetX;

    //y值得计算
    //最大值是 maxY ，就是拖动的view的x值等于屏幕的宽度的时候就是这个值
    //拖动最小的时候，就是0
    //所以可以知道 y 的变化为： y = x * maxY/screenW
    CGFloat y = fabs( frame.origin.x * maxY / screenW );
    frame.origin.y = y;
    //计算高度，其实高度就是 屏幕的高度减去两倍计算的y值
    frame.size.height = [UIScreen mainScreen].bounds.size.height - 2*frame.origin.y;

    return frame;
}

@end

二、抽屉控件使用

我们通过继承来使用控件，另外我们创建三控制器，用这个三个控制器的view，来填充的拖拽控件三个view(左、中、右)

2.1 MyDragViewController.h

#import <UIKit/UIKit.h>
#import "DragViewController.h"

@interface MyDragViewController : DragViewController

@end

2.2 MyDragViewController.m

//
//  MyDragViewController.m
//  03_UIView63_抽屉控件使用
//
//  Created by 杞文明 on 17/4/2.
//  Copyright © 2017年 杞文明. All rights reserved.
//

#import "MyDragViewController.h"
#import "LeftViewController.h"
#import "CenterViewController.h"
#import "RightViewController.h"

@interface MyDragViewController ()

@end

@implementation MyDragViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    //当一个控制器的View添加到另一个控制器的View上的时候,那此时View所在的控制器也应该成为上一个控制器的子控制器.
    //左
    LeftViewController * lvc = [[LeftViewController alloc]init];
    lvc.view.frame = self.leftView.bounds;
    [self.leftView addSubview:lvc.view];
    [self addChildViewController:lvc];

    //右
    RightViewController * rvc = [[RightViewController alloc]init];
    rvc.view.frame = self.rightView.bounds;
    [self.rightView addSubview:rvc.view];
    [self addChildViewController:rvc];

    //中间
    CenterViewController * cvc = [[CenterViewController alloc]init];
    cvc.view.frame = self.mainView.bounds;
    [self.mainView addSubview:cvc.view];
    [self addChildViewController:cvc];
}
@end

三、LeftViewController.m

//
//  LeftViewController.m
//  03_UIView63_抽屉控件使用
//
//  Created by 杞文明 on 17/4/2.
//  Copyright © 2017年 杞文明. All rights reserved.
//

#import "LeftViewController.h"

@interface LeftViewController ()

@end

@implementation LeftViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor orangeColor];
    //添加一些控件
    UIImageView * iv = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"image1.png"]];

    [self.view addSubview:iv];
}

@end

四、 RightViewController.m

//
//  RightViewController.m
//  03_UIView63_抽屉控件使用
//
//  Created by 杞文明 on 17/4/2.
//  Copyright © 2017年 杞文明. All rights reserved.
//

#import "RightViewController.h"

@interface RightViewController ()

@end

@implementation RightViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"timg.jpg"]];
}
@end

五、CenterViewController.m

//
//  CenterViewController.m
//  03_UIView63_抽屉控件使用
//
//  Created by 杞文明 on 17/4/2.
//  Copyright © 2017年 杞文明. All rights reserved.
//

#import "CenterViewController.h"

@interface CenterViewController ()<UITableViewDataSource>

@end

@implementation CenterViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self createTableView];
}

-(void)createTableView{
    UITableView * table = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStyleGrouped];
    [table setDataSource:self];
    table.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:table];
}

//有多少条数据
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return 20;
}

//每个条目
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString * identifier = @"UITableCell";
    UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:identifier];
    if(cell==nil){
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
    }
    [cell.textLabel setText:@"测试哦-----"];
    return cell;
}

@end

六、图示