IOS學習之路十（仿人人滑動菜單Slide-out Sidebar Menu）

最近滑動菜單比較流行，像facebook和人人等都在使用滑動菜單，今天做了一個小demo大體效果如下：

這次用了一個開源的項目ECSlidingViewController這個也是一個挺著名的托管在Github上的開源項目:

Github上Project的URL是：https://github.com/edgecase/ECSlidingViewController

大體步驟如下：

建立一個SingleView applicaton:

下面把下載下傳的源碼包含進來：

解壓縮後打開 找到   ECSlidingViewController/Vendor/ECSlidingViewController 下的兩個檔案，我們把整個Vendor檔案夾都導入：

添加一個類庫：

打開StoryBoard另外再建立兩個UIViewController 

建立後大概界面如下：

1.建立兩個檔案分别為：ToDoViewController和MenuViewController都繼承于UIviewController:

2.把建立時自帶的ViewController兩個檔案删除，建立一個檔案為：InitialSlidingViewController，打開stroryBoard并把它設為RootViewController。

3.在stroryBoard中把剛才建立的兩個ToDoViewController和MenuViewController進行設定：

先設定ToDoViewController：把controller類設為：ToDoViewController标示符設為：ToDoView

MenuViewController的設定如上：把controller類設為：MenuViewController标示符設為：MenuView

下面修改代碼：

[html]  view plain copy print ?

1. InitialSlidingViewController.m  

[html]  view plain copy print ?

1. #import "InitialSlidingViewController.h"  
2. #import "ToDoViewController.h"  
3. @interface InitialSlidingViewController ()  
4. @end  
5. @implementation InitialSlidingViewController  
6. - (void)viewDidLoad  
7. {  
8.     [super viewDidLoad];  
9.      self.topViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"ToDoView"];  
10. }  
11. @end  

ToDoViewController.m：中修改如下： [html]  view plain copy print ?

[html]  view plain copy print ?

1. - (void)viewWillAppear:(BOOL)animated  
2. {  
3.     [super viewWillAppear:animated];  
4.     // Add a shadow to the top view so it looks like it is on top of the others  
5.     self.view.layer.shadowOpacity = 0.75f;  
6.     self.view.layer.shadowRadius = 10.0f;  
7.     self.view.layer.shadowColor = [[UIColor blackColor] CGColor];  
8.     // Tell it which view should be created under left  
9.     if (![self.slidingViewController.underLeftViewController isKindOfClass:[MenuViewController class]]) {  
10.         self.slidingViewController.underLeftViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"MenuView"];  
11.     }  
12.     // Add the pan gesture to allow sliding  
13.     [self.view addGestureRecognizer:self.slidingViewController.panGesture];  
14. }  

MenuViewController修改如下：

[html]  view plain copy print ?

1. - (void)viewDidLoad  
2. {  
3.     [super viewDidLoad];  
4.     [self.slidingViewController setAnchorRightRevealAmount:240.0f];  
5.     self.slidingViewController.underLeftWidthLayout = ECFullWidth;  
6. }  

為了美觀你可以設定一下 ToDoViewController和MenuViewController的背景色：

運作一下效果大體如下：

接下來你可以自己添加個性的View和segue了

轉載請注明：

原文轉載自：http://blog.csdn.net/wildcatlele

原文參考：http://kingscocoa.com/tutorials/slide-out-navigation/