Custom Right Side Slide Out Menu in iOS

In this tutorial , i will tell you about how to implement Custom right side menu in Objective c . Slide out menu is similar to what you see in popular apps like Facebook , Gmail .

Step 1 :   Create a new project and save it to the desired location.

New project

Step 2:   Add MFSideMenu to the project.

1.    Close the project which you have created.

2.    Go to  MFSideMenu to add it to your project.

3.    For installing pods , Open terminal in your mac.

       i) Open your project by writing `cd name of the project`  .

       ii) Write pod init.

       iii) Write open -a Xcode PodFile. 

       iv) Add pod to your pod file     pod 'MFSideMenu' 

       v)  Close the pod file and write pod install to install pod in terminal.

Step 3:  Open Workspace

      i) After pod installation , close the terminal window. A new workspace is created for your project.

     ii) Open the workspace. 

Step 4:  Open Main.storyboard and embed a new navigation controller in it .

        

         i) Add the title to your viewController and drag a UIBarButton to the right side of the                    navigation controller (name it as MENU) 

       

       ii)   Make its connection (as action) with the Viewcontroller .

Step 5 :  Create a helper class which will contain the elements of the slide out menu .

      i)     On Xcode,  hit cmd + n and add a new tableViewController to your project .   

     ii)     Add the following code in your tableviewController 

	#import "SideMenuViewController.h"
	#import "MFSideMenu.h"
	#import "ViewController.h"
	@implementation SideMenuViewController
	{
	UITableView *tableView;
	}
	//
	#pragma mark - Did Load
	#pragma mark -
	-(void) viewDidLoad
	{
	[super viewDidLoad];
	MenuArray =[NSArray arrayWithObjects:@"Profile",@"Friends",@"Status",@"Settings",@"Logout",nil];
	self.tableView.backgroundColor = [UIColor whiteColor];
	self.tableView.alwaysBounceVertical = NO;
	[self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];
	}
	//
	#pragma mark - UITableViewDataSource
	#pragma mark -
	- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
	return 1;
	}
	- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
	{
	return MenuArray.count;
	}
	- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
	static NSString *CellIdentifier = @"Cell";
	UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
	if (cell == nil) {
	cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
	cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
	cell.backgroundColor=[UIColor clearColor];
	cell.textLabel.textColor=[UIColor blackColor];
	UIView *lineView=[[UIView alloc]initWithFrame:CGRectMake(30, 0, 270, 1)];
	lineView.backgroundColor=[UIColor whiteColor];
	[cell.contentView addSubview:lineView];
	}
	cell.textLabel.text = [MenuArray objectAtIndex:indexPath.row];
	return cell;
	}
	- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
	{
	return 40;
	}
	@end

view raw SlideOutMenuNEW hosted with ❤ by GitHub

Step 6 : Open AppDelagate.h and add the following code :

	#import <UIKit/UIKit.h>
	#import "MFSideMenu.h"
	#import "SideMenuViewController.h"
	#import "ViewController.h"
	@interface AppDelegate : UIResponder <UIApplicationDelegate>
	@property (strong, nonatomic) UIWindow *window;
	@end

view raw appDelegate.h hosted with ❤ by GitHub

     i)     Open Main.StoryBoard and app the identifier to it . (e.g. : myStory).

Add caption

   ii)     In appDelegate.m add the following code :

	@interface AppDelegate ()
	@end
	@implementation AppDelegate
	- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
	// Override point for customization after application launch.
	// UIStoryboard *sb = [UIStoryboard storyboardWithName:@"Main" bundle:nil];
	ViewController *viewCtrl= [[UIStoryboard storyboardWithName:@"Main" bundle:NULL]instantiateViewControllerWithIdentifier:@"mainStory"];
	UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:viewCtrl];
	SideMenuViewController *rightMenuViewController = [[SideMenuViewController alloc] init];
	MFSideMenuContainerViewController *container = [MFSideMenuContainerViewController
	containerWithCenterViewController:nav
	leftMenuViewController:nil
	rightMenuViewController:rightMenuViewController];
	self.window.rootViewController=container;
	return YES;
	}

view raw AppDelegate.m hosted with ❤ by GitHub

  iii)     Now , open ViewController.m and the following code :

	#import "ViewController.h"
	#import "MFSideMenu.h"
	@interface ViewController ()
	@end
	@implementation ViewController
	- (void)viewDidLoad {
	[super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
	self.view.backgroundColor = [UIColor whiteColor];
	self.view.frame = [[UIScreen mainScreen] bounds];
	}
	- (void)didReceiveMemoryWarning {
	[super didReceiveMemoryWarning];
	// Dispose of any resources that can be recreated.
	}
	- (IBAction)menuBarBtn:(id)sender {
	NSLog(@"Menu");
	[self.menuContainerViewController toggleRightSideMenuCompletion:^{}];
	}
	@end

view raw ViewController.m hosted with ❤ by GitHub

For MFSideMenu Action :

	{
	UINavigationController *navigationController = self.menuContainerViewController.centerViewController;
	KnectsViewController *knectsVc = [[KnectsViewController alloc]init];
	NSArray *controllers = [NSArray arrayWithObject:knectsVc];
	navigationController.viewControllers = controllers;
	[self.menuContainerViewController setMenuState:MFSideMenuStateClosed];
	}

view raw gistfile1.txt hosted with ❤ by GitHub

Thats all about Slide Out Menu in iOS .

Thank you .:) 

Read about APNS (Apple Push Notification Service)

Read about POST data using NSURLSession