抽屉效果
添加子视图
* 简单的滑动效果
* 监听控制器处理事件方法
* 获取x轴偏移量
* 改变主视图的frame
* 利用KVO做视图切换
往左移动,显示右边,隐藏左边
往右移动,显示左边,隐藏右边
* 复杂的滑动效果,PPT讲解(根据手指每移动一点,x轴的偏移量算出当前视图的frame)
假设x移到320时,y移动到60,算出没移动一点x,移动多少y
offsetY = offsetX * 60 / 320 手指每移动一点,x轴偏移量多少,y偏移多少
为了好看,x移动到320,距离上下的高度需要保持一致,而且有一定的比例去缩放他的尺寸。
怎么根据之前的frame,算出当前的frame,touchMove只能拿到之前的frame.
当前的高度 = 之前的高度 * 这个比例
缩放比例:当前的高度/之前的高度 (screenH - 2 * offsetY) / screenH
当前的宽度也一样求。
y值,计算比较特殊,不能直接用之前的y,加上offsetY,往左滑动,主视图应该往下走,但是offsetX是负数,导致主视图会往上走。
y = (screenH - 当前的高度)* 0.5
getCurrentFrameWithOffsetX
* 定位(滑动松开手指的时候,移动到目标点)
移动到左右目标点,根据偏移量 = 当前目标点的x - 之前视图的x,计算移动到目标点的frame
还原:当没有移动到目标点,就把主视图还原。
* 复位(当主视图不在原始的位置,点击屏幕,恢复原来位置)
判断手指是否移动,移动的时候就自动定位,不需要手动复位。
代码实现:
// // ViewController.m // 抽屉效果 // // Created by wtw on 15/7/20. // Copyright (c) 2015年 wtw. All rights reserved. // #import "ViewController.h" @interface ViewController () @property (nonatomic,weak) UIView *leftView; @property (nonatomic,weak) UIView *rightView; @property (nonatomic,weak) UIView *mainView; //复位,定位后点击后会复位 @property (nonatomic,assign) BOOL isDraging; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //添加子控件 [self addchildview]; //时刻监听主视图frame的改变 /** * 以后如果需要时刻监听对象的某个属性的改变,就用KVO * 给mainView添加一个观察者 * addObserver:观察者 * forKeyPath:需要监听的属性 * options:监听新值的改变 */ [self.mainView addObserver:self forKeyPath:@"frame" options:NSKeyValueObservingOptionNew context:nil]; } //只要监听的属性以改变就会调用 -(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context { //NSLog(@"%@",NSStringFromCGRect(self.mainView.frame)); if (self.mainView.frame.origin.x < 0) { //显示右边,隐藏左边 self.rightView.hidden = NO; self.leftView.hidden = YES; }else if (self.mainView.frame.origin.x >0) { //显示左边,隐藏右边 self.leftView.hidden = NO; self.rightView.hidden = YES; } } - (void)addchildview { //left UIView *leftView = [[UIView alloc]initWithFrame:self.view.bounds]; leftView.backgroundColor = [UIColor greenColor]; [self.view addSubview:leftView]; _leftView = leftView; //right UIView *rightView = [[UIView alloc]initWithFrame:self.view.bounds]; rightView.backgroundColor = [UIColor yellowColor]; [self.view addSubview:rightView]; self.rightView = rightView; //main UIView *mainView = [[UIView alloc]initWithFrame:self.view.bounds]; mainView.backgroundColor = [UIColor redColor]; [self.view addSubview:mainView]; self.mainView = mainView; } - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { //获取手指 UITouch *touch = [touches anyObject]; //当前点 CGPoint curP = [touch locationInView:self.view]; //上一个点 CGPoint preP = [touch previousLocationInView:self.view]; //获取手指每移动一下,x轴的偏移量 CGFloat offsetX = curP.x - preP.x; //设置当前视图的frame self.mainView.frame = [self frameWithOffsetX:offsetX]; //记录下当前正在拖拽 self.isDraging = YES; } # pragma mark - y反向最大的偏移量 #define MaxY 60 - (CGRect)frameWithOffsetX:(CGFloat)offsetX { CGFloat screenW = [UIScreen mainScreen].bounds.size.width; CGFloat screenH = [UIScreen mainScreen].bounds.size.height; CGFloat offsetY = offsetX * MaxY / screenW; //获取缩放比例 CGFloat scale = (screenH - 2 * offsetY) / screenH; //右边移动的时候的缩放比例 if (self.mainView.frame.origin.x < 0) { scale = (screenH + 2 * offsetY) / screenH; } CGRect frame = self.mainView.frame; frame.origin.x += offsetX; frame.size.height = frame.size.height * scale; frame.size.width = frame.size.width * scale; frame.origin.y = (screenH - frame.size.height) * 0.5; return frame; } #pragma mark - 定位功能 #define targetRX 300 #define TargetLx -250 - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { if (_isDraging == NO && _mainView.frame.origin.x != 0) { //复位 [UIView animateWithDuration:0.25 animations:^{ self.mainView.frame = self.view.bounds; }]; //下面不需要定位 return; } //定位功能 CGFloat screenW = [UIScreen mainScreen].bounds.size.width; //获取当前主视图的frame CGRect frame = self.mainView.frame; CGFloat target = 0; if (frame.origin.x > screenW * 0.5) { //当主视图的x大于屏幕一半,定位到右边 target = targetRX; }else if (CGRectGetMaxX(self.mainView.frame) < screenW * 0.5) { //定位左边 target = TargetLx; } if(target == 0) { //还原 [UIView animateWithDuration:0.25 animations:^{ self.mainView.frame = self.view.bounds; }]; }else { [UIView animateWithDuration:0.25 animations:^{ //获取x轴偏移量 CGFloat offsetX = target - frame.origin.x; self.mainView.frame = [self frameWithOffsetX:offsetX]; }]; } //记录下当前正在拖拽 self.isDraging = NO; } @end