这篇文章主要介绍了iOS实现左右拖动抽屉效果,理解ios平台类似于QQ主页面,利用触摸事件滑动touchesMoved实现的效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文实例介绍了iOS实现左右拖动抽屉效果,具体内容如下
利用了触摸事件滑动 touchesMoved: 来触发左右视图的出现和消失 利用loadView方法中添加view 在self.view载入前就把 左右中View都设置好frame 每一个方法都由单独的功能。
#import "DarwViewController.h"
@interface DarwViewController ()
@property (nonatomic, weak) UIView *leftView;
@property (nonatomic, weak) UIView *rightView;
@property (nonatomic, weak) UIView *mainView;
/**
* 动画是否进行
*/
@property (nonatomic ,assign) BOOL animating;
@end
@implementation DarwViewController
- (void)viewDidLoad {
[super viewDidLoad];
}
-(void)loadView
{
self.view = [[UIView alloc]initWithFrame:[UIScreen mainScreen].bounds];
//左边view
UIView *leftView = [[UIView alloc]initWithFrame:self.view.frame];
[self.view addSubview:leftView];
leftView.backgroundColor= [UIColor redColor];
self.leftView = leftView;
//右边View
UIView *rightView = [[UIView alloc]initWithFrame:self.view.frame];
[self.view addSubview:rightView];
rightView.backgroundColor= [UIColor blueColor];
self.rightView = rightView;
//主页面
UIView *mainView = [[UIView alloc]initWithFrame:self.view.frame];
[self.view addSubview:mainView];
mainView.backgroundColor= [UIColor yellowColor];
self.mainView = mainView;
//KVO监听
[self.mainView addObserver:self forKeyPath:@"frame" options:NSKeyValueObservingOptionNew context:nil];
}
/**
* KVO回调方法 当mainView Frame值改变时触发
*
* @param keyPath <#keyPath description#>
* @param object <#object description#>
* @param change <#change description#>
* @param context <#context description#>
*/
-(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSString *,id> *)change context:(void *)context
{
if (self.animating) return; //如果mainView正在动画 就不执行
if (self.mainView.frame.origin.x > 0 )
{
//X > 0 就隐藏右边View 显示左边View
self.rightView.hidden = YES;
self.leftView.hidden = NO;
}
else if (self.mainView.frame.origin.x < 0)
{
//X < 0 就隐藏左边View 显示右边VIew
self.leftView.hidden = YES;
self.rightView.hidden = NO;
}
}
#pragma mark -- 触摸事件
-(void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
//获得触摸对象
UITouch *touch = [touches anyObject];
//获得当前触摸点
CGPoint currentPoint = [touch locationInView:self.view];
//获得上一个触摸点
CGPoint previousPoint = [touch previousLocationInView:self.view];
//计算x方向的偏移量
CGFloat offsetX = currentPoint.x - previousPoint.x;
// 根据x的偏移量计算y的偏移量
self.mainView.frame = [self rectWithOffsetX:offsetX];
}
#define screenW [UIScreen mainScreen].bounds.size.width
#define screenH [UIScreen mainScreen].bounds.size.height
/**
* 计算主视图的frame
*
* @param offsetX x的偏移量
*
* @return 偏移后新的frame
*/
- (CGRect ) rectWithOffsetX:(CGFloat )offsetX
{
//Y轴的偏移量
CGFloat offsetY = (screenH *1/5) * (offsetX/screenW);
//比例 :(用于宽高的缩放)
CGFloat scale = (screenH - offsetY *2) / screenH;
if (self.mainView.frame.origin.x < 0 )
{
//如果x是负数 及左边View要显示
//比例就要设为比1小
scale = 2 - scale;
}
//获取当前mainView的frame
CGRect frame = self.mainView.frame;
//重新设置mainView的frame值
frame.size.width = frame.size.width *scale >screenW ? screenW : frame.size.width *scale;
frame.size.height = frame.size.height *scale >screenH ? screenH :frame.size.height *scale;
frame.origin.x += offsetX;
frame.origin.y =(screenH - frame.size.height)*0.5;
//返回偏移后新的frame
return frame;
}
#define maxRightX (screenW *0.8)
#define maxLeftX (-screenW *0.6)
-(void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
CGFloat targetX = 0;
//如果松手的那一下 当前mainVIew的x大于屏幕的一半
if (self.mainView.frame.origin.x > screenW * 0.5)
{
//向右边定位
targetX = maxRightX;
}
//如果松手的那一下 当前mainVIew的最大X值小于屏幕的一半
else if (CGRectGetMaxX(self.mainView.frame) < screenW *0.5)
{
//向左边定位
targetX = maxLeftX;
}
//计算偏移量
CGFloat offsetX = targetX -self.mainView.frame.origin.x;
self.animating = YES;
[UIView animateWithDuration:0.4 animations:^{
if (targetX == 0)
{
//如果targetX==0 复位
self.mainView.frame = self.view.frame;
}
else
{
//如果targetX != 0 那就到指定位置
self.mainView.frame = [self rectWithOffsetX:offsetX];
}
} completion:^(BOOL finished) {
self.animating = NO;
}];
}
@end
以上就是本文的全部内容,希望对大家的学习有所帮助。
沃梦达教程
本文标题为:iOS实现左右拖动抽屉效果
基础教程推荐
猜你喜欢
- IOS获取系统相册中照片的示例代码 2023-01-03
- Android开发Compose集成高德地图实例 2023-06-15
- iOS Crash常规跟踪方法及Bugly集成运用详细介绍 2023-01-18
- iOS开发 全机型适配解决方法 2023-01-14
- MVVMLight项目Model View结构及全局视图模型注入器 2023-05-07
- Android Compose自定义TextField实现自定义的输入框 2023-05-13
- Android实现短信验证码输入框 2023-04-29
- iOS中如何判断当前网络环境是2G/3G/4G/5G/WiFi 2023-06-18
- Flutter进阶之实现动画效果(三) 2022-10-28
- iOS开发使用XML解析网络数据 2022-11-12