iOS 抽屜效果實現(xiàn)

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];
抽屜效果
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市恤煞,隨后出現(xiàn)的幾起案子屎勘,更是在濱河造成了極大的恐慌,老刑警劉巖居扒,帶你破解...
    沈念sama閱讀 222,807評論 6 518
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件概漱,死亡現(xiàn)場離奇詭異,居然都是意外死亡喜喂,警方通過查閱死者的電腦和手機瓤摧,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,284評論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來玉吁,“玉大人照弥,你說我怎么就攤上這事≌┘耄” “怎么了产喉?”我有些...
    開封第一講書人閱讀 169,589評論 0 363
  • 文/不壞的土叔 我叫張陵,是天一觀的道長敢会。 經(jīng)常有香客問我曾沈,道長,這世上最難降的妖魔是什么鸥昏? 我笑而不...
    開封第一講書人閱讀 60,188評論 1 300
  • 正文 為了忘掉前任塞俱,我火速辦了婚禮,結(jié)果婚禮上吏垮,老公的妹妹穿的比我還像新娘障涯。我一直安慰自己罐旗,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 69,185評論 6 398
  • 文/花漫 我一把揭開白布唯蝶。 她就那樣靜靜地躺著九秀,像睡著了一般。 火紅的嫁衣襯著肌膚如雪粘我。 梳的紋絲不亂的頭發(fā)上鼓蜒,一...
    開封第一講書人閱讀 52,785評論 1 314
  • 那天,我揣著相機與錄音征字,去河邊找鬼都弹。 笑死,一個胖子當(dāng)著我的面吹牛匙姜,可吹牛的內(nèi)容都是我干的畅厢。 我是一名探鬼主播,決...
    沈念sama閱讀 41,220評論 3 423
  • 文/蒼蘭香墨 我猛地睜開眼氮昧,長吁一口氣:“原來是場噩夢啊……” “哼框杜!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起袖肥,我...
    開封第一講書人閱讀 40,167評論 0 277
  • 序言:老撾萬榮一對情侶失蹤霸琴,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后昭伸,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,698評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡澎迎,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,767評論 3 343
  • 正文 我和宋清朗相戀三年庐杨,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片夹供。...
    茶點故事閱讀 40,912評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡灵份,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出哮洽,到底是詐尸還是另有隱情填渠,我是刑警寧澤,帶...
    沈念sama閱讀 36,572評論 5 351
  • 正文 年R本政府宣布鸟辅,位于F島的核電站氛什,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏匪凉。R本人自食惡果不足惜枪眉,卻給世界環(huán)境...
    茶點故事閱讀 42,254評論 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望再层。 院中可真熱鬧贸铜,春花似錦堡纬、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,746評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至棍鳖,卻和暖如春炮叶,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背鹊杖。 一陣腳步聲響...
    開封第一講書人閱讀 33,859評論 1 274
  • 我被黑心中介騙來泰國打工悴灵, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人骂蓖。 一個月前我還...
    沈念sama閱讀 49,359評論 3 379
  • 正文 我出身青樓积瞒,卻偏偏與公主長得像,于是被迫代替她去往敵國和親登下。 傳聞我的和親對象是個殘疾皇子茫孔,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,922評論 2 361

推薦閱讀更多精彩內(nèi)容

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件被芳、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,124評論 4 61
  • 我總是在工作太過忙碌缰贝,壓力太大或者工作太無聊,生活沒激情時幻想:我的理想生活應(yīng)該是什么樣的呢畔濒? 1.有一份自己喜歡...
    遙遙愛分享閱讀 904評論 0 0
  • 今天事兒多剩晴,回到家已經(jīng)快10點了。讀了P17-P34兩遍侵状。分享主題:1.最近三年你是勤奮的聰明嗎赞弥? 自己認(rèn)為一直都...
    莫嬌_3dde閱讀 419評論 0 0
  • 你說你好想住進(jìn)那座塔, 就可以看到天空的盡頭趣兄。 你說春城沒有極致的天空绽左, 我在那一刻愛上了英倫。 我說如果這就是世...
    桑野的野閱讀 205評論 0 2
  • 非常的惶恐 覺得時間不夠用 怎么待著也不得勁 非常累 如果我是魚就好了 可以在水里睡覺 不會被水流的聲音影響 想出...
    咸酥閱讀 162評論 0 0