SideMenu in Xamarin iOS
Tags: navigationdrawerin, sidemenu, sidemenuinxamarin, xamarin
Published: 2020-02-24 10:50:25

---
title: SideMenu in Xamarin iOS
published: true
date: 2020-02-15 14:21:00 UTC
tags: Navigation Drawer in,Sidemenu,SideMenu in Xamarin ,Xamarin
canonical_url: https://logeshpalani.blogspot.com/2020/02/sidemenu-in-xamarin-ios.html
---

  

[![](https://1.bp.blogspot.com/-yz9AKpU51To/Xkf96GivkrI/AAAAAAAAP5Q/21F_0aVMwo8wnh1MEdhX8juljvsBcUs8wCLcBGAsYHQ/s320/Side%2BMenu%2Bin%2BXamarin%2BiOS.png)](https://1.bp.blogspot.com/-yz9AKpU51To/Xkf96GivkrI/AAAAAAAAP5Q/21F_0aVMwo8wnh1MEdhX8juljvsBcUs8wCLcBGAsYHQ/s1600/Side%2BMenu%2Bin%2BXamarin%2BiOS.png)

  

  

**Introduction**  
   

This blog demonstrates how to use a sidemenu or navigation drawer in _Xamarin iOS_. since there is no default future for the sidemenu or navigation drawer view. We can archive this view using _Xamarin.Sidemenu _NuGet with putting a lot of effort.

  

**Let's start**

  

Create a new Xamarin iOS _Single View Application_ in Visual Studio for Mac.

  

After the project creation, install _Xamarin.Sidemenu_ Nuget package by going to Solution Explorer >> right-click and select _Manage NuGet Package_ and search Xamarin.Sidemenu and select install the plugin.

  

[![](https://1.bp.blogspot.com/-lybYzuRqxJw/Xkf9346AN-I/AAAAAAAAP5M/Ll7pfwODfL8zffJvJtU_c1tbohU3rN1XQCEwYBhgL/s320/Nuget%2BSlide%2BMenu.PNG)](https://1.bp.blogspot.com/-lybYzuRqxJw/Xkf9346AN-I/AAAAAAAAP5M/Ll7pfwODfL8zffJvJtU_c1tbohU3rN1XQCEwYBhgL/s1600/Nuget%2BSlide%2BMenu.PNG)
  
  

Now, open your Main.Storyboard and design two scenes for the right and left navigation drawer as per your required design and one more _ViewController_ for the Main or Root _ViewController_. Here, I don't want any more design, just gave background color for these scenes and Create two _ViewController_ classes for these scenes and this controller should be inherited from _UIViewController_.

  

[![](https://1.bp.blogspot.com/-zjt40cz3zQ0/XkWTg6rTqeI/AAAAAAAAP4I/mV2iHA5EN1Qniy_2JxKbqOupq9RisfdewCEwYBhgL/s1600/Screenshot%2B2020-02-07%2Bat%2B4.49.41%2BPM.png)](https://1.bp.blogspot.com/-zjt40cz3zQ0/XkWTg6rTqeI/AAAAAAAAP4I/mV2iHA5EN1Qniy_2JxKbqOupq9RisfdewCEwYBhgL/s1600/Screenshot%2B2020-02-07%2Bat%2B4.49.41%2BPM.png)

  

  

Next, open your View Controller and create SideMenuManager instance and configure right and left side _ViewController_. Here, I created the _ViewController_ instance and configure these _ViewController_ with _SideMenuManager_.  Now, we can add gestures for these sidemenu controllers. Here, I wrote _PanGesture_ and _EdgePanGesture _and added these gestures to the direct added into _NavigationController_, incase you want to add for a specific scene you can. Next, we can set this instance to the toolbar left and right button.  By default, the left, and right drawer _ViewController_ scene Navigation bar _TitleView_ is enabled. if you want to disable the _NavigationBar_ title view. First, create an instance for that _ViewController _and set false for _NavigationBarHidden_ property true. Some cool effects based properties are available for use as a blur, background image. These effects code is given in the _SetDefault_ method. Yah! we have one more useful and lovely effect is available, which is the Sidemenu Navigation Animation type and Its types are Slide In, Slide Out, Dissolve, SlideInOut.

  
   
  

<script src="https://gist.github.com/logeshpalani98/5d890b7963e845460e2e9305ca14b1f8.js"></script>  

  
Now, run your application, you will get output like below.

  

[![](https://1.bp.blogspot.com/-_o4gv5NptnQ/XkWThJqtvtI/AAAAAAAAP4M/78lxj62Tf0wZm09_fg4lOx95O7MRfB8iACEwYBhgL/s320/Screenshot%2B2020-02-07%2Bat%2B4.50.51%2BPM.png)](https://1.bp.blogspot.com/-_o4gv5NptnQ/XkWThJqtvtI/AAAAAAAAP4M/78lxj62Tf0wZm09_fg4lOx95O7MRfB8iACEwYBhgL/s1600/Screenshot%2B2020-02-07%2Bat%2B4.50.51%2BPM.png)[![](https://1.bp.blogspot.com/-4q5hJXjew04/XkWThKwqliI/AAAAAAAAP4Q/lhv8NnfOfsISi7xcxpFLpc1a_Gs0EJLkgCEwYBhgL/s320/Screenshot%2B2020-02-07%2Bat%2B4.50.11%2BPM.png)](https://1.bp.blogspot.com/-4q5hJXjew04/XkWThKwqliI/AAAAAAAAP4Q/lhv8NnfOfsISi7xcxpFLpc1a_Gs0EJLkgCEwYBhgL/s1600/Screenshot%2B2020-02-07%2Bat%2B4.50.11%2BPM.png)[![](https://1.bp.blogspot.com/-NOlcWCxG2wo/XkWTiPeKGBI/AAAAAAAAP4U/6mqlU8IhUZUdU3yiYvgn2kMZXh9Ml6XZACEwYBhgL/s320/Screenshot%2B2020-02-07%2Bat%2B4.51.05%2BPM.png)](https://1.bp.blogspot.com/-NOlcWCxG2wo/XkWTiPeKGBI/AAAAAAAAP4U/6mqlU8IhUZUdU3yiYvgn2kMZXh9Ml6XZACEwYBhgL/s1600/Screenshot%2B2020-02-07%2Bat%2B4.51.05%2BPM.png)

  

  

  

Source code in [Github](https://github.com/logeshpalani98/Xamarin.iOS-Samples)  
  

Summary

- Install Xamarin.SideMenu plugin
- Configure the left and right view controller scene to SideMenu Manager
- Add Gestures 

Thanks for reading !!!