簡單實(shí)現(xiàn)側(cè)滑功能

話不多說，先來個(gè)效果圖：

sideView.gif

側(cè)滑這個(gè)功能大家應(yīng)該很熟悉吧，只要你用QQ，那么肯定就會(huì)接觸到側(cè)滑了，我今天主要是講實(shí)現(xiàn)側(cè)滑的思路，當(dāng)然也寫了個(gè)簡單的demo，但是有很多細(xì)節(jié)我并沒有去處理，關(guān)鍵在于思路，好了，下面開始講解思路了：
1.很明顯我們可以看到點(diǎn)擊導(dǎo)航欄左側(cè)按鈕最上層的視圖是往右移動(dòng)的，而且一開始上面的藍(lán)色視圖是蓋在綠色視圖上方的，這里可以看出來 他們之間是有層級(jí)關(guān)系的，也就是藍(lán)色視圖是蓋在綠色視圖上方的，
2.了解了這一個(gè)關(guān)系，咱們再接著說第二點(diǎn)，那就是怎么讓藍(lán)色視圖往右側(cè)移動(dòng)并且縮小呢，改變藍(lán)色視圖的frame或者是transform不就行了嗎

了解了上面的這兩點(diǎn)，還有一點(diǎn)很重要，那就是綠色視圖還有藍(lán)色視圖是添加在哪里的呢？
剛開始我的思路是直接添加在keyWindow上面，這樣確實(shí)是可以的，但是如果是添加在keywindow上會(huì)出現(xiàn)一個(gè)問題，那就是UIApplication這個(gè)代理對(duì)象持有這個(gè)View了，這就違背了原則了，代理就只干代理的事才對(duì)，所以后面我的思路就變成了將這個(gè)綠色的view添加在根控制器的View上面，這里主要，從圖上雖然看到了有導(dǎo)航欄，但是我們這里的根控制器卻并不是UINavgationController，而是一個(gè)普通的UIViewController，具體你可以通過看我的demo，說完了綠色視圖我覺得還有必要說一下藍(lán)色視圖，藍(lán)色視圖的View很明顯是有導(dǎo)航欄的，聰明的你肯定想到了，沒錯(cuò)，我是將一個(gè)導(dǎo)航控制器的View添加在了這個(gè)綠色的view上面，這樣就會(huì)有導(dǎo)航欄了，這里有一點(diǎn)一定要注意的，那就是這個(gè)導(dǎo)航控制器必須是根控制器的子控制器;
說了這么多估計(jì)還是有很多人有點(diǎn)蒙，那我還是把層次給比劃一下吧：
UIWindow-->RootViewController.View-->greenView-->navigationController.View

通俗的講就是：跟控制器的view上首先添加了綠色的View 然后再新建了一個(gè)導(dǎo)航控制器，將導(dǎo)航控制器的View添加到根控制器的View上，具體的我覺得還是用代碼來說比較實(shí)在：

根控制器中代碼：

//
//  ViewController.m
//  YJYYSideViewController
//
//  Created by 遇見遠(yuǎn)洋 on 16/9/1.
//  Copyright ? 2016年 遇見遠(yuǎn)洋. All rights reserved.
//

#import "ViewController.h"
#import "YJYYSideView.h"
#import "YJYYNavViewController.h"
#import "YJYYViewController.h"
#define topValue 64
#define leftMenuW 150

@interface ViewController ()<YJYYLeftMenuDelegate>

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    YJYYNavViewController * navController = [[YJYYNavViewController alloc]initWithRootViewController:[[YJYYViewController alloc]init]];
    [self addChildViewController:navController];
    self.view.backgroundColor = [UIColor greenColor];
    //添加左右兩側(cè)欄
    YJYYSideView * sideView = [[YJYYSideView alloc]initWithFrame:CGRectMake(0, topValue, leftMenuW, self.view.bounds.size.height - topValue * 2)];
    sideView.delegate = self;

    [self.view addSubview:sideView];
    [self.view addSubview:navController.view];
}

#pragma mark - HMLeftMenuDelegate
- (void)leftMenu:(YJYYSideView *)menu didSelectedButtonFromIndex:(NSInteger)fromIndex toIndex:(NSInteger)toIndex
{
    NSLog(@"點(diǎn)擊了FromIndex %ld-----toIndex %ld",fromIndex,toIndex);
}

@end

綠色view中的代碼（5個(gè)按鈕）

//
//  YJYYSideView.m
//  YJYYSideViewController
//
//  Created by 遇見遠(yuǎn)洋 on 16/9/1.
//  Copyright ? 2016年 遇見遠(yuǎn)洋. All rights reserved.
//
#import "YJYYSideView.h"
@interface YJYYSideView ()
@property (copy,nonatomic)NSArray * titles;/**<標(biāo)題數(shù)組*/
@property (copy,nonatomic)NSMutableArray * btnsArray;/**<按鈕數(shù)組*/
@end

@implementation
- (instancetype)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        self.backgroundColor = [UIColor cyanColor];
        [self addLeftButtons];
    }
    return self;
}

- (void)addLeftButtons {
    for (int i = 0 ; i < 5; i++) {
        UIButton * btn = [UIButton new];
        [btn setTitle:self.titles[i] forState:UIControlStateNormal];
        [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        btn.backgroundColor = [UIColor greenColor];
        btn.tag = i;
        [self addSubview:btn];
        [self.btnsArray addObject:btn];
    }
}

- (void)layoutSubviews {
    [super layoutSubviews];
    [self.btnsArray enumerateObjectsUsingBlock:^(UIButton  * btn, NSUInteger idx, BOOL * _Nonnull stop) {
        CGFloat height = self.bounds.size.height / 5.0;
        btn.frame = CGRectMake(0, idx * height, self.bounds.size.width, height);
    }];
}

- (NSMutableArray *)btnsArray {
    if (!_btnsArray) {
        _btnsArray = [NSMutableArray array];
    }
    return _btnsArray;
}

- (NSArray *)titles {
    if (!_titles) {
        _titles = @[@"剛哥",@"佳哥",@"老司機(jī)",@"超哥",@"軒哥"];
    }
    return _titles;
}

@end

導(dǎo)航控制器的子控制器中代碼

//
//  YJYYViewController.m
//  YJYYSideViewController
//
//  Created by 遇見遠(yuǎn)洋 on 16/9/1.
//  Copyright ? 2016年 遇見遠(yuǎn)洋. All rights reserved.
//

#import "YJYYViewController.h"
#define topValue 64
#define leftValue 150

@interface YJYYViewController ()

@end

@implementation YJYYViewController

- (void)viewDidLoad {
   [super viewDidLoad];
   
   self.view.backgroundColor = [UIColor blueColor];
   
   [self setupNavigationTools];
   
   [self addGesture];
}

/**
*  設(shè)置導(dǎo)航欄左右按鈕
*/
- (void)setupNavigationTools {
   // 返回按鈕
   UIButton *backButton = [UIButton buttonWithType:UIButtonTypeCustom];
   [backButton setImage:[UIImage imageNamed:@"debunk_arrow_back_img"] forState:UIControlStateNormal];
   [backButton sizeToFit];
   [backButton addTarget:self action:@selector(backbarbuttonDidClickEvent:) forControlEvents:UIControlEventTouchUpInside];
   UIBarButtonItem *backBarButton = [[UIBarButtonItem alloc] initWithCustomView:backButton];
   self.navigationItem.leftBarButtonItem = backBarButton;
   self.title = @"導(dǎo)航";
   self.navigationController.navigationBar.tintColor = [UIColor whiteColor];
}

- (void)addGesture {
   UITapGestureRecognizer * tapGes = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tap:)];
   
   UIPanGestureRecognizer * panGes = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(pan:)];
   
   [self.view addGestureRecognizer:tapGes];
   [self.view addGestureRecognizer:panGes];
}

- (void)tap:(UITapGestureRecognizer *)tapGes {
   
   [UIView animateWithDuration:0.25 animations:^{
       self.navigationController.view.transform = CGAffineTransformIdentity;
   } completion:^(BOOL finished) {
   }];
}

- (void)pan:(UIPanGestureRecognizer *)panGes {
   
   [self backbarbuttonDidClickEvent:nil];
}

/** 返回操作 */
- (void)backbarbuttonDidClickEvent:(UIButton *)sender {

   [UIView animateWithDuration:0.25 animations:^{
       // 縮放比例
       CGFloat navH = [UIScreen mainScreen].bounds.size.height - 2 * topValue;
       CGFloat scale = navH / [UIScreen mainScreen].bounds.size.height;
       
       // 菜單左邊的間距
       CGFloat leftMenuMargin = [UIScreen mainScreen].bounds.size.width * (1 - scale) * 0.5;
       CGFloat translateX = leftValue - leftMenuMargin;
       
       CGFloat topMargin = [UIScreen mainScreen].bounds.size.height * (1 - scale) * 0.5;
       CGFloat translateY = topValue - topMargin;
       
       // 縮放
       CGAffineTransform scaleForm = CGAffineTransformMakeScale(scale, scale);
       // 平移
       CGAffineTransform translateForm = CGAffineTransformTranslate(scaleForm, translateX / scale, translateY / scale);
       
       self.navigationController.view.transform = translateForm;
       
   }];
}
@end

總共就這幾個(gè)文件，其實(shí)也不難，但是里面還有很多細(xì)節(jié)需要完善，我就不做了，下面給個(gè)demo，主要是講個(gè)思路 這個(gè)demo有啥問題可以留言：
https://github.com/wxh794708907/YJYYLeftSideSlide.git

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,636評(píng)論 4贊 61
  • 關(guān)于彌達(dá)斯的神話中最有名的是點(diǎn)石成金的故事。 一次，酒神狄俄倪索斯發(fā)現(xiàn)他的老師西勒諾斯不見了。原來這個(gè)老精靈醉酒之...
    樂行樂知閱讀 14,906評(píng)論 0贊 1
  • 《心靈故事》傳統(tǒng)帝國只有超人和狗們，現(xiàn)代社會(huì)卻有公務(wù)員，老板和打工的。選擇創(chuàng)業(yè)就是選擇挑戰(zhàn)自我。洪嶸博士學(xué)養(yǎng)深厚，...
    石高宏閱讀 567評(píng)論 0贊 1

友情鏈接更多精彩內(nèi)容