[側(cè)拉功能][ios]

本文是我的處女篇啦礼烈,全文參考官方文檔,基于自己公司項(xiàng)目所寫勋篓。在這里實(shí)現(xiàn)側(cè)拉功能吧享,使用的是MMDrawerController第三方庫如,有不正確的地方譬嚣,還請留下一筆耙蔑,以做參考


Mutual Mobile Drawer Controller

https://github.com/mutualmobile/MMDrawerController

MMDrawerControlleris側(cè)抽屜導(dǎo)航容器視圖控制器設(shè)計(jì)用于支持應(yīng)用程序利用側(cè)抽屜方式越來越多。這個庫的目的是完全支持側(cè)抽屜式導(dǎo)航在一個輕量級的孤荣、集中的方法甸陌,在呈現(xiàn)和解聘抽屜提供自定義動畫的能力。

Documentation

Official appledoc documentation can be found atCocoaDocs.

安裝 MMDrawerController

在項(xiàng)目中安裝 MMDrawerController通過CocoaPods:

pod'MMDrawerController','~> 0.5.7'

創(chuàng)建a drawer controller

AppDelegate.m ->- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(nullable NSDictionary *)launchOptions

self.sideViewController = [[SideViewController alloc] init];

self.homeViewController = [[HomeViewController alloc] init];

UINavigationController *navigationControllerHome = [[UINavigationController alloc] initWithRootViewController:self.homeViewController];

UINavigationController *navigationControllerLeft = [[UINavigationController alloc]initWithRootViewController:self.sideViewController];

self.drawerController = [[MMDrawerController alloc]

initWithCenterViewController:navigationControllerHome

leftDrawerViewController:navigationControllerLeft

rightDrawerViewController:nil];

[self.drawerController setRestorationIdentifier:@"MMDrawer"];

[navigationController setRestorationIdentifier:@"MMExampleCenterNavigationControllerRestorationKey"];

[self.sideViewController setRestorationIdentifier:@"MMExampleLeftSideDrawerController"];

[self.drawerController setMaximumLeftDrawerWidth:SIDE_OFFSET];

self.drawerController.showsShadow = NO;

self.drawerController.shouldStretchDrawer = NO;

[self.drawerController setOpenDrawerGestureModeMask:MMOpenDrawerGestureModeAll];

[self.drawerController setCloseDrawerGestureModeMask:MMCloseDrawerGestureModeAll];

[self.drawerController

setDrawerVisualStateBlock:^(MMDrawerController *drawerController, MMDrawerSide drawerSide, CGFloat percentVisible) {

MMDrawerControllerDrawerVisualStateBlock block;

block = [MMDrawerVisualState parallaxVisualStateBlockWithParallaxFactor:2.0f];

if(block){

block(drawerController, drawerSide, percentVisible);

}

}];

實(shí)現(xiàn)側(cè)拉效果

UIGestureRecognizer Support

MMOpenDrawerGestureMode

MMOpenDrawerGestureModePanningNavigationBar: 用戶清掃導(dǎo)航欄打開側(cè)邊欄盐股;

MMOpenDrawerGestureModePanningCenterView: 用戶清掃中間的屏幕打開側(cè)邊欄钱豁;

MMOpenDrawerGestureModeBezelPanningCenterView: 用戶清掃底部20個地方打開側(cè)邊欄;

MMOpenDrawerGestureModeCustom:開發(fā)者可以提供一個回調(diào)塊來確定該手勢是否應(yīng)該被識別疯汁。

MMCloseDrawerGestureMode

MMCloseDrawerGestureModePanningNavigationBar:用戶清掃頂部導(dǎo)航欄關(guān)閉側(cè)邊欄牲尺;

MMCloseDrawerGestureModePanningCenterView: 用戶清掃中間的視圖關(guān)閉側(cè)邊欄;

MMCloseDrawerGestureModeBezelPanningCenterView:用戶清掃底部中間視圖關(guān)閉側(cè)邊欄幌蚊;?

MMCloseDrawerGestureModeTapNavigationBar:用戶點(diǎn)擊頂部導(dǎo)航欄關(guān)閉側(cè)邊欄谤碳;?

MMCloseDrawerGestureModeTapCenterView: 用戶點(diǎn)擊中間的視圖關(guān)閉側(cè)邊欄;

MMCloseDrawerGestureModePanningDrawerView:用戶清掃側(cè)邊欄關(guān)閉側(cè)邊欄溢豆;

MMCloseDrawerGestureModeCustom: 開發(fā)者可以提供一個回調(diào)塊來確定該手勢是否應(yīng)該被識別蜒简。

Custom Gesture Recognizer Support

從版本0.3.0┊,你現(xiàn)在可以自定義一個手勢使用setGestureShouldRecognizeTouchBlock提供一個回調(diào)方法漩仙。該方法提供了三個參數(shù)-抽屜控制器搓茬,手勢和觸摸。作為開發(fā)人員队他,您負(fù)責(zé)檢查這些元素卷仑,并確定該手勢是否應(yīng)該被確認(rèn)。注塊僅供參考如果你設(shè)置了openDrawerGestureModeMask 包含了 MMOpenDrawerGestureModeCustom麸折,你可以設(shè)置代碼塊如下锡凝。

[myDrawerController

setGestureShouldRecognizeTouchBlock:^BOOL(MMDrawerController *drawerController, UIGestureRecognizer *gesture, UITouch *touch) {

BOOL shouldRecognizeTouch = NO;

if(drawerController.openSide == MMDrawerSideNone &&

[gesture isKindOfClass:[UIPanGestureRecognizer class]]){

UIView * customView = [drawerController.centerViewController myCustomSubview];

CGPoint location = [touch locationInView:customView];

shouldRecognizeTouch = (CGRectContainsPoint(customView.bounds, location));

}

return shouldRecognizeTouch;

}];

方法drawerVisualStateBlock的含義

當(dāng)一個抽屜狀態(tài)更新時,設(shè)置一個回調(diào)函數(shù)垢啼。

這一塊是負(fù)責(zé)更新抽屜狀態(tài)窜锯,和抽屜控制器動畫處理狀態(tài)轉(zhuǎn)變〔布校回調(diào)函數(shù)將被調(diào)用當(dāng)抽屜被打開或關(guān)閉衬浑,以及當(dāng)用戶打開抽屜。這一塊是不負(fù)責(zé)直接做動畫放刨,而只是更新的視圖屬性(alpha, anchor point, transform,等)工秩。注意,如果`shouldStretchDrawer`是yes进统,`percentVisible`要大于1助币。如果` shouldStretchDrawer`設(shè)置為no,` percentVisible `不大于1

`shouldStretchDrawer` is set to YES, it is possible for `percentVisible` to be greater than 1.0. If `shouldStretchDrawer` is set to NO, `percentVisible` will never be greater than 1.0.

注意螟碎,當(dāng)抽屜完成開啟或關(guān)閉眉菱,側(cè)抽屜控制器視圖將具有以下性能復(fù)位:

- alpha: 1.0

- transform: CATransform3DIdentity

- anchorPoint: (0.5,0.5)

@param drawerVisualStateBlock block塊被調(diào)用執(zhí)行更新抽屜的視覺特性。` percentVisible`表示當(dāng)前可見的抽屜與抽屜空間的大小掉分,空間被定義為屏幕上的maxmimum抽屜寬度的邊緣俭缓。注意克伊,你已經(jīng)進(jìn)入drawercontroller,這將允許您更新像側(cè)抽屜層定位點(diǎn)华坦。

視圖恢復(fù)的實(shí)現(xiàn)

- (UIViewController *)application:(UIApplication *)application viewControllerWithRestorationIdentifierPath:(NSArray *)identifierComponents coder:(NSCoder *)coder

{

NSString * key = [identifierComponents lastObject];

if([key isEqualToString:@"MMDrawer"]){

return self.window.rootViewController;

}

else if ([key isEqualToString:@"MMExampleCenterNavigationControllerRestorationKey"]) {

return ((MMDrawerController *)self.window.rootViewController).centerViewController;

}

else if ([key isEqualToString:@"MMExampleLeftNavigationControllerRestorationKey"]) {

return ((MMDrawerController *)self.window.rootViewController).leftDrawerViewController;

}

else if ([key isEqualToString:@"MMExampleLeftSideDrawerController"]){

UIViewController * leftVC = ((MMDrawerController *)self.window.rootViewController).leftDrawerViewController;

if([leftVC isKindOfClass:[UINavigationController class]]){

return [(UINavigationController*)leftVC topViewController];

}

else {

return leftVC;

}

}

return nil;

}

二級頁面滑動返回到一級界面

SideViewController.h

實(shí)現(xiàn)主界面向左滑動時進(jìn)入側(cè)邊欄愿吹,二級頁面返回進(jìn)入主頁面,在

- (void)pushViewController:(UIViewController *)viewController

{

if ([viewController isKindOfClass:[HomeViewController class]]) {

[User currentUser].isHome = YES;

[self.mm_drawerController closeDrawerAnimated:YES completion:nil];

return;

}

[User currentUser].isHome = NO;

AppDelegate *delegate = (AppDelegate *)[UIApplication sharedApplication].delegate;

[self.mm_drawerController toggleDrawerSide:MMDrawerSideLeft animated:YES completion:nil];

UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:delegate.homeViewController];

[self.mm_drawerController setCenterViewController:nav withCloseAnimation:NO completion:^(BOOL finished) {

AppDelegate *delegate = (AppDelegate *)[UIApplication sharedApplication].delegate;

[delegate.homeViewController.navigationController pushViewController:viewController animated:YES];

}];

self.seletedIndex = 0;

}

方法toggleDrawerSide的含義

調(diào)用這個方法基于進(jìn)入`drawer`惜姐。

請注意犁跪,如果您試圖切換抽屜關(guān)閉,而另一個是開放的歹袁,沒有什么會發(fā)生坷衍。例如,如果你進(jìn)入MMDrawerSideLeft頁面条舔,但正確的抽屜是開著的枫耳,什么都不會發(fā)生。此外逞刷,完成塊將被稱為完成標(biāo)志設(shè)置為不嘉涌。

@param ?切換drawerSide The `MMDrawerSide` . 它的值不能是 `MMDrawerSideNone`.

@param 動畫決定`drawer`是否應(yīng)該切換動畫。

@param 當(dāng)切換完成的時候調(diào)用這個block塊夸浅,或者如果沒有切換發(fā)生仑最。

demo:在首頁點(diǎn)擊導(dǎo)航欄最左側(cè)的按鈕,進(jìn)入左側(cè)邊欄帆喇,實(shí)現(xiàn)如下:

[self.mm_drawerController toggleDrawerSide:MMDrawerSideLeft animated:YES completion:nil];

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末警医,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子坯钦,更是在濱河造成了極大的恐慌预皇,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,294評論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件婉刀,死亡現(xiàn)場離奇詭異吟温,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)突颊,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,493評論 3 385
  • 文/潘曉璐 我一進(jìn)店門鲁豪,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人律秃,你說我怎么就攤上這事爬橡。” “怎么了棒动?”我有些...
    開封第一講書人閱讀 157,790評論 0 348
  • 文/不壞的土叔 我叫張陵糙申,是天一觀的道長。 經(jīng)常有香客問我船惨,道長柜裸,這世上最難降的妖魔是什么缕陕? 我笑而不...
    開封第一講書人閱讀 56,595評論 1 284
  • 正文 為了忘掉前任,我火速辦了婚禮疙挺,結(jié)果婚禮上榄檬,老公的妹妹穿的比我還像新娘。我一直安慰自己衔统,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,718評論 6 386
  • 文/花漫 我一把揭開白布海雪。 她就那樣靜靜地躺著锦爵,像睡著了一般。 火紅的嫁衣襯著肌膚如雪奥裸。 梳的紋絲不亂的頭發(fā)上险掀,一...
    開封第一講書人閱讀 49,906評論 1 290
  • 那天,我揣著相機(jī)與錄音湾宙,去河邊找鬼樟氢。 笑死,一個胖子當(dāng)著我的面吹牛侠鳄,可吹牛的內(nèi)容都是我干的埠啃。 我是一名探鬼主播,決...
    沈念sama閱讀 39,053評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼伟恶,長吁一口氣:“原來是場噩夢啊……” “哼碴开!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起博秫,我...
    開封第一講書人閱讀 37,797評論 0 268
  • 序言:老撾萬榮一對情侶失蹤潦牛,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后挡育,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體巴碗,經(jīng)...
    沈念sama閱讀 44,250評論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,570評論 2 327
  • 正文 我和宋清朗相戀三年即寒,在試婚紗的時候發(fā)現(xiàn)自己被綠了橡淆。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,711評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡蒿叠,死狀恐怖明垢,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情市咽,我是刑警寧澤痊银,帶...
    沈念sama閱讀 34,388評論 4 332
  • 正文 年R本政府宣布,位于F島的核電站施绎,受9級特大地震影響溯革,放射性物質(zhì)發(fā)生泄漏贞绳。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,018評論 3 316
  • 文/蒙蒙 一致稀、第九天 我趴在偏房一處隱蔽的房頂上張望冈闭。 院中可真熱鬧,春花似錦抖单、人聲如沸萎攒。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,796評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽耍休。三九已至,卻和暖如春货矮,著一層夾襖步出監(jiān)牢的瞬間羊精,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,023評論 1 266
  • 我被黑心中介騙來泰國打工囚玫, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留喧锦,地道東北人。 一個月前我還...
    沈念sama閱讀 46,461評論 2 360
  • 正文 我出身青樓抓督,卻偏偏與公主長得像燃少,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子本昏,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,595評論 2 350

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