iOS中 超簡單抽屜效果(MMDrawerController)的實現

來源:互聯網
上載者:User

iOS中 超簡單抽屜效果(MMDrawerController)的實現

ios開發中,展示類應用通常要用到抽屜效果,由於項目需要,本人找到一個demo,縮減掉一些不常用的功能,整理出一個較短的執行個體。
首先需要給工程添加第三方類庫

MMDrawerController:
這裡講的執行個體只加入了左滑抽屜。右滑和左滑只是初始化時多添加一個右視圖控制器,其他方法基本相同。

下面是用手勢實現抽屜的拉出和收回

1.初始化跟視圖控制器時,在AppDelegate中匯入標頭檔

#import MMDrawerController.h

2.初始化方法先初始化左視圖和中心視圖,也就是圖中的

BoutiqueCollectionViewController

LeftDrawerTableViewController

3.初始化完兩個子視圖控制器後,初始化抽屜根視圖控制器MMDrawerController,初始化抽屜控制器時需要將左視圖控制器和中心視圖控制器添加到抽屜視圖控制器上。

//CollectionView的樣式
UICollectionViewFlowLayout * flowLayout = [[UICollectionViewFlowLayout alloc] init];

//初始化中心視圖
BoutiqueCollectionViewController * boutiqueCVC = [[BoutiqueCollectionViewController alloc] initWithCollectionViewLayout:flowLayout];
boutiqueCVC.collectionView.backgroundColor = [UIColor whiteColor];
UINavigationController * boutiqueNC = [[UINavigationController alloc] initWithRootViewController:boutiqueCVC];

//初始化左視圖
LeftDrawerTableViewController * leftTVC = [[LeftDrawerTableViewController alloc] init];
UINavigationController * leftNC = [[UINavigationController alloc] initWithRootViewController:leftTVC];

//初始化抽屜視圖控制器
MMDrawerController * drawerController = [[MMDrawerController alloc] initWithCenterViewController:boutiqueNC leftDrawerViewController:leftNC];

//設定抽屜抽出的寬度
drawerController.maximumLeftDrawerWidth = 200;

4.初始化完成之後添加滑動手勢,通過滑動手勢拉出和收回抽屜。手勢封裝在第三方類庫中,程式如下。

//滑動手勢快關抽屜
[drawerController setOpenDrawerGestureModeMask:MMOpenDrawerGestureModeAll];
[drawerController setCloseDrawerGestureModeMask:MMCloseDrawerGestureModeAll];

self.window.rootViewController = drawerController;

到此,將抽屜根視圖控制器添加到window的根視圖控制器上,運行程式,就可以實現用手勢來控制抽屜的拉出和收回。



如果需要用按鈕控制拉出和收回抽屜,需要加上下面的部分。

1.在中心視圖控制器中添加標頭檔

#import UIViewController+MMDrawerController.h//第三方封裝的標頭檔
#import MMDrawerBarButtonItem.h//第三方封裝的標頭檔
#import LeftDrawerTableViewController.h、、左視圖標頭檔

2.在viewDidLoad中實現添加左抽屜控制按鈕的方法

[self setupLeftMenuButton];//在viewDidLoad中實現添加左抽屜控制按鈕的方法

3.在下面實現添加按鈕的方法

-(void)setupLeftMenuButton
{
//建立按鈕
MMDrawerBarButtonItem * leftDrawerButton = [[MMDrawerBarButtonItem alloc] initWithTarget:self action:@selector(leftDrawerButtonPress:)];

//為navigationItem添加LeftBarButtonItem
[self.navigationItem setLeftBarButtonItem:leftDrawerButton animated:YES];
}

4.在下面實現抽屜按鈕的動作方法。

//抽屜按鈕動作
-(void)leftDrawerButtonPress:(id)sender
{
//開關左抽屜
[self.mm_drawerController toggleDrawerSide:MMDrawerSideLeft animated:YES completion:nil];
} 效果展示:


 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.