1.添加需要實現(xiàn)抽屜效果的三個視圖着茸,這里需要注意主視圖需要放在最后添加
// 左邊視圖
...
// 右邊視圖
...
// 主視圖
UIView *mainView=[[UIView alloc]initWithFrame:self.view.bounds];
mainView.backgroundColor=[UIColor greenColor];
_mainView=mainView;
[self.view addSubview:mainView];
2.實現(xiàn)左滑顯示左邊視圖,右滑出現(xiàn)右邊視圖
- 添加平移手勢和點擊手勢夕凝,實現(xiàn)左右滑動的監(jiān)聽和點擊復(fù)位的效果
// 添加平移手勢
UIPanGestureRecognizer *panGes=[[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panGes:)];
[self.mainView addGestureRecognizer:panGes];
// 添加點擊返回手勢
UITapGestureRecognizer *tapGes=[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tap)];
[self.view addGestureRecognizer:tapGes];
- 在平移手勢調(diào)用的方法中谈宛,通過偏移量來確定mainView的frame,實現(xiàn)動畫效果
- 首先通過
translationInView:
方法獲取偏移量,通過偏移量的正負(fù)確定拖動的方向 - 當(dāng)手指松開后需要根據(jù)mainView的x值確定其視圖是定位到原始位置還是其縮放的位置
- 要其視圖由當(dāng)前點位移到目標(biāo)位置情妖,可以通過當(dāng)前點到目標(biāo)點的位移睬关,然后調(diào)用
frameWithOffsetX:
方法獲得mainView的frame
- 首先通過
#define targetR 300
#define targetL -300
- (void)panGes:(UIPanGestureRecognizer *)panGes
{
// 獲取偏移量
CGPoint tranP=[panGes translationInView:self.mainView];
// 獲得位移后的視圖
self.mainView.frame=[self frameWithOffsetX:tranP.x];
// 判斷拖動方向
if (self.mainView.frame.origin.x<0) {//向左
self.rightView.hidden=NO;
}else if(self.mainView.frame.origin.x>0)
{// 向右
self.rightView.hidden=YES;
}
// 當(dāng)手指松開時,做自動定位
CGFloat target=0;
if (panGes.state==UIGestureRecognizerStateEnded) {
if (self.mainView.frame.origin.x>0.5*screenW) {
target=targetR;
}else if(CGRectGetMaxX(self.mainView.frame)<0.5*screenW)
{
target=targetL;
}
//offset為當(dāng)前點到其目標(biāo)點的位移
CGFloat offset=target-self.mainView.frame.origin.x;
[UIView animateWithDuration:0.5 animations:^{
self.mainView.frame=[self frameWithOffsetX:offset];
}];
}
// 復(fù)位
[panGes setTranslation:CGPointZero inView:self.mainView];
}
#define maxY 120
// 根據(jù)mainView在X軸方向位移確定mainView的尺寸
- (CGRect)frameWithOffsetX:(CGFloat)offsetX
{
CGRect frame=self.mainView.frame;
frame.origin.x+=offsetX;
frame.origin.y=fabs(frame.origin.x / screenW * maxY);
frame.size.height=screenH - frame.origin.y * 2;
return frame;
}
3.如何讓其他文件也能實現(xiàn)抽屜效果
- 首先拖入文件毡证,然后新建一個新的ViewController电爹,讓其繼承自我們導(dǎo)入的文件
@interface ViewController :AZDrawerController
- 新建要實現(xiàn)抽屜效果的界面,添加其視圖至我們的mainView中料睛,并且讓其控制器也成為界面控制器的子控件丐箩,讓控制器單獨的管理
// 當(dāng)一個控制器的View添加到另一個控制器的View上的時候,那此時View所在的控制器也應(yīng)該成為上一個控制器的子控制器.
AZTableViewController *vc1=[[AZTableViewController alloc]init];
vc1.view.frame=self.mainView.bounds;
[self.mainView addSubview:vc1.view];
[self addChildViewController:vc1];
抽屜效果