iOS实现左右拖动抽屉效果
程序员文章站
2023-11-27 19:36:16
本文实例介绍了ios实现左右拖动抽屉效果,具体内容如下
利用了触摸事件滑动 touchesmoved: 来触发左右视图的出现和消失 利用loadview方法中添加view...
本文实例介绍了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
以上就是本文的全部内容,希望对大家的学习有所帮助。
上一篇: JavaScript中的prototype原型学习指南
下一篇: IOS实现点击滑动抽屉效果