iOS

Creating a Sidebar Menu Using SWRevealViewController in Swift


As promised, here is the Swift version of the slide out sidebar menu tutorial. Again we will make use of an open source library called SWRevealViewController to build the sidebar menu. Though the library was written in Objective-C, you can easily integrate it into any Swift project. You will see how easy you can access and interact with Objective-C classes using Swift.

Okay, let’s get started.

In this tutorial, I will show you how create a slide-out navigation menu similar to the one you find in the Gmail app. If you’re unfamiliar with slide out navigation menu, take a look at the figure on the right. Ken Yarmost gave a good explanation and defined it as follows:

Slide-out navigation consists of a panel that slides out from underneath the left or the right of the main content area, revealing a vertically independent scroll view that serves as the primary navigation for the application.

From what I know, the slide-out sidebar menu was first introduced by Facebook. Since then it quickly becomes a standard way to implement navigation menu. Nowadays, you can easily find this design pattern in most of the popular content-related apps such as Inbox, Digg, LinkedIn, etc.

The slide-out design pattern lets you build a navigation menu in your apps but without wasting the screen real estate. Normally, the navigation menu is hidden behind the front view. The menu can then be triggered by tapping a list button in the navigation bar. Once the menu is expanded and becomes visible, users can close it by using the list button or simply swiping left on the content area.

You can build the sidebar menu from the ground up. But with so many free pre-built solutions on GitHub, we’re not going to build it from scratch. Instead, we’ll make use of a library called SWRevealViewController. Developed by John Lluch, this excellent library provides a quick and easy way to put up a slide-out navigation menu in your apps. Best of all, the library is available for free.
The library was written in Objective-C. But it is very straightforward to integrate it in your Swift project. You will learn how it can be done in a minute.

A Glance at the Demo App

As usual, we’ll build a demo app to show you how to apply the SWRevealViewController. The app is very simple but not fully functional. The primary purpose of the app is to walk you through the implementation of slide-out navigation menu. The navigation menu will work like this:

  • User triggers the menu by tapping the list button at the top-left of navigation bar.
  • User can also bring up the menu by swiping right on the main content area.
  • Once the menu appears, user can close it by tapping the list button again.
  • User can also close the menu by dragging left on the content area.
Slide out sidebar app

Creating the Xcode Project

The focus of this chapter is on the sidebar implementation. So to save your time from setting up the project, you can download the Xcode project template to start with.
The project already comes with a pre-built storyboard with all the required view controllers. If you’ve downloaded the template, open the storyboard to take a look. To use SWRevealViewController for building a sidebar menu, you create a container view controller, which is actually an empty view controller, to hold both the menu view controller and a set of content view controllers.

Slide out sidebar storyboard

I have already created the menu view controller for you. It is just a static table view with three menu items. There are three content view controllers for displaying news, map and photos. For demo purpose, the content view controllers only shows static data. And I just created three controllers. If you need to have a few more controllers, simply insert them into the storyboard. All icons and images are included in the project template (credit: thanks for the free icon from Pixeden).

Using the SWRevealViewController Library

As mentioned, we’ll use the free SWRevealViewController library to implement the slide-out menu. So, first download the library from GitHub and extract the zipped file. After you extract the file, you should find the SWRevealViewController folder. In that folder, there are two files : SWRevealViewController.h and SWRevealViewController.m. If you do not have any Objective-C background, you may wonder why the file extension is not .swift. As mentioned before, the SWRevealViewController was written in Objective-C. The file extension differs from that of Swift’s source file. Anyway, we will add both files to the project. In the project navigator, right-click SidebarMenu folder and select “New Group”. Name the group “SWRevealViewController”. Drag both files to the SWRevealViewController group. As soon as you confirm to add the files, Xcode prompts you to configure an Objective-C bridging header. By creating the header file, you’ll be able to access the Objective-C code from Swift. So click Yes to proceed.

Import Objective-C to Swift Project

Xcode then generates a header file named SidebarMenu-Bridging-Header.h, along with the SWRevealViewController files. Open the SidebarMenu-Bridging-Header.h and insert the following line:

Associate the Front View and Rear View Controller

SWRevealViewController library provides a built-in support for Storyboard. When implementing a sidebar menu using, all you need to do is associate the SWRevealViewController with a front and a rear view controller using segues. The front view controller is the main controller for displaying content. In our storyboard, it’s the navigation controller which associates with a view controller for presenting news. The rear view controller is the controller that shows the navigation menu. Here it is the Sidebar View Controller.

Go to the storyboard. First, select the empty view controller (i.e. container view controller) and change its class to SWRevealViewController.

SWRevealViewController Class

Next, control-drag from SWRevealViewController to the Menu view controller. After releasing the button, you will see a context menu for segue selection. In this case, select “reveal view controller set segue”.

Sidebar Connect Segue

This defines a custom segue “SWRevealViewControllerSetSegue”. Select the segue and change its identifier to “sw_rear” under the Identity inspector. By setting the identifier, you tell SWRevealViewController that the menu view controller is the rear view controller. In this case, the sidebar menu will be hidden behind a content view controller.

Next, repeat the same procedures to connect SWRevealViewController with the navigation controller of the news view controller. Again, select “reveal view controller set segue” when prompted.

Sidebar Storyboard Segue

Set the identifier of the segue to “sw_front”. This tells the SWRevealViewController that the navigation controller is the front view controller.

Before moving on, you can now compile the app and have a quick test. Your app should display the news view. You couldn’t unhide the sidebar menu when tapping the menu button (or what so called hamburger button) as we haven’t implemented the action method yet.

If your app works properly, let’s continue with the implementation. Open NewsTableViewController.swift, which is the controller class of News Controller. In the viewDidLoad method, insert the following lines of code:

The SWRevealViewController provides a method called revealViewController() to get the parent SWRevealViewController from any child controller. It also provides the revealToggle: method to handle the expansion and contraction of the sidebar menu. As you know, Cocoa uses the target-action mechanism for communication between a control and another object. We set the target of the menu button to the reveal view controller and action to the revealToggle: method. So when the menu button is tapped, it will call the revealToggle: method to display the sidebar menu.

Using Objective-C from Swift: The action property of the menu button accepts an Objective-C selector. An Objective-C selector is a type that refers to the name of an Objective-C method. In Swift, you just need to specify the method name as a string literal to construct a selector.

Lastly, we add a gesture recognizer. Not only you can use the menu button to bring out the sidebar menu, the user can swipe the content area to activate the sidebar as well.
Cool! Let’s compile and run the app in the simulator. Tap the menu button and the sidebar menu should appear. You can hide the sidebar menu by tapping the menu button again. You can also open the menu by using gesture. Try to swipe right on the content area and see what you get.

Sidebar Demo - iPhone

Handling Menu Item Selection

You’ve already built a visually appealing sidebar menu. There is still one thing left. For now, we haven’t defined any segues for the menu items. When you select any of the menu item, it will not transit to the corresponding view.

Okay, go back to storyboard. First, select the map cell. Press and hold the control key and click on the map cell. Drag to the navigation controller of the map view controller and select the “reveal view controller push controller” segue under Selection Segue. Repeat the procedure for the News and Photos items, but connect then with the navigation controllers of the news view controller and photos view controller respectively.

The custom SWRevealViewControllerSeguePushController segue automatically handles the switching of the controllers.

Sidebar Menu Segue

Again insert the following lines of code in the viewDidLoad method of MapViewController.swift and PhotoViewController.swift to toggle the sidebar menu:

That’s it! Hit the Run button and test out the app.

Customizing the Menu

The SWRevealViewController class provides a number of options for configuring the sidebar menu. Say, if you want to change the width of the menu, you can update the value of rearViewRevealWidth property. Try to insert the following line of code in the viewDidLoad method of NewsTableViewController:

If you run the app, you’ll have a sidebar menu like the one on your left. You can look into the SWRevealViewController.h file to explore the customizable options.

Sidebar Menu Demo

Summary

In this tutorial, I walked you through the SWRevealViewController library and showed you how to create a slide-out navigation menu in Swift. This is one of the many approaches to create a sidebar menu. If you like, you can try to build the navigation menu from scratch using custom view animation or explore other open source libraries such as ENSwiftSideMenu.

For your reference, you can download the final project here. What do you think about the tutorial? Leave me comment and share your thoughts.

If you enjoy reading this tutorial, you will probably like our Intermediate Swift book, which covers more than 25 development recipes. The book is now available in the starter/complete package of the Swift bundle. You can check it out here.

SwiftUI
Working with SwiftUI Gestures and @GestureState
iOS
The Complete Guide to PHPicker API in iOS 14
Tutorial
Test Driven Development (TDD) in Swift with Quick and Nimble
  • Michael

    MichaelMichael

    Author Reply

    You said in the letter: “Some said the slide-out sidebar menu is an old-fashioned way for navigation.”, so what is new way for navigation?


  • Converse As

    If you want to create a app then its not a tricky now you can get your desire apps free and can create app. without of any coding so visit now and enjoy: createmyfreeapp.com


  • Carlos Martin

    Hey, great tutorial! I would like to know how to round the corners of a UIImageView in a table of my project, which is very similar to the News view. I have tried to use solutions like this (http://stackoverflow.com/questions/10167266/how-to-set-cornerradius-for-only-top-left-and-top-right-corner-of-a-uiview), but the size of the image is lost and damaged storyboard design. I would greatly appreciate the help, because I’m new to size classes … thanks in advance


    • thefredelement

      set clipstobounds = true and then set a corner radius.


      • Carlos Martin

        that works for all corners, but I am trying to round just top-left and top-right as described in the link. Any suggestion?


    • omid

      omidomid

      Author Reply

      hey guys, how can I change side menu from left to right with swipe right to left?


      • Vitaliy Abramov

        someView.roundCorners([.topLeft, .topRight], radius: 20)


  • LAOMUSIC ARTS

    Houston, we have a problem !:
    “control-drag from SWRevealViewController to the Menu view controller.
    After releasing the button, you will see a context menu for segue
    selection. In this case, select “reveal view controller set segue”. ”
    Instead I have “reveal view controller set controller” or “reveal view controller push controller”.
    Only one segue is possible then.


    • Arian

      ArianArian

      Author Reply

      I’ve this problem too, “reveal view controller set controller” doesn’t work! and “reveal view controller set segue” isn’t there.


      • Swapna Lekshmanan

        I had the same problem too. Make sure you drag from the yellow square at the top of Reveal View Controller. Also note that, when you drag from the Reveal View Controller, its outline shd be “blue” in color ensuring tht it has been selected. I spent hours figuring that out.


        • Thedc

          ThedcThedc

          Author Reply

          Could you tell me how you actually fix it? I keep getting set controller instead of set segue. Moreover, I got an warning which says “targetTransform” not implemented in SWRevealViewController.m


          • steve

            stevesteve

            Author

            Hey Swapna, did you get this figured out? I’m having the same issue.


        • Arian

          ArianArian

          Author Reply

          I did just like what you said, but still I don’t have “reveal view controller set segue”. I’ll be glad if you explain more! thanks


    • Dave

      DaveDave

      Author Reply

      Hi All. If you take a look at the final project you can see that he had the same issue. Solution: set the segue to “Custom” and then set the Segue’s class to “SWRevealViewControllerSegueSetController”.


      • omid

        omidomid

        Author Reply

        thank you thank you I was looking for this solution for a day!


  • Marc

    MarcMarc

    Author Reply

    Awesome tutorial! I checked out other tutorials on this subject and this is by far the most helpful and straight forward. Thanks a lot and keep up the excellent work!


  • antonio081014

    ???


    • Simon Ng

      Simon NgSimon Ng

      Author Reply

      The site was down a couple days ago. That was why you got the message.


  • Marcelo

    MarceloMarcelo

    Author Reply

    Hey there. Thank you for the amazing tutorial!
    I have just a question. I’ve done this in my file original, and for some reason (mainly because I’m new in Swift I assume) the label of the cell in my Menu View Controller is not showing properly. It shows the table view up to the top, and when I click in the “News” tab, the label shows in the cell above like “Ne…”. The Menu button and the gesture recognizer is working properly.. Only the label of the cell.. What do you think it can be? Thank you once again! Cheers


    • Артем Халтурин

      Hello Marcelo. I had this issue too. I fixed it. You should to change menu TableViewController width and height value to wAny hAny.


    • Артем Халтурин

      Hello Marcelo. I had this issue too. I fixed it. You should to change in Menu TableViewContoller width and height to wAny and hAny. After that I became to see labels in my Sidebar navigation.


  • rezwansiddiqui

    Great


  • Rezwan

    RezwanRezwan

    Author Reply

    To know the Best Way to Manage iPad Hard Drive Please visit: http://www.bestiosapps.org/2015/02/best-way-to-manage-ipad-hard-drive-filemaster.html


  • Flip

    FlipFlip

    Author Reply

    Hi! Nice tutorial … But i have a question.
    It is possible to interact with the frontcontroller while menu is open. Is it possible to deactivate this and how can i implement a gesturerecognizer for swiping and for tapping to go back to the frontviewcontroller?


    • Flip

      FlipFlip

      Author Reply

      Has anyone an idea to solve my requirements?


  • Swapna Lekshmanan

    Hi, I am trying to make a blog reader app, and I want different categories of the blog to open in the same NewsTableViewController. And I want these categories to be listed in the navigation menu. pls throw some light on how can i accomplish that coz i dont want to create a new View Controller for each category


  • nagarjuna

    nagarjunanagarjuna

    Author Reply

    i download the project ,when i trying to run the project it is just show the apperiance screen ,then i didnt see any output there ,i am using xcode6.1 in i phone6 similater thanks for help in advance


  • Karol

    KarolKarol

    Author Reply

    When I change the label from “News” to something longer like “Football” the label gets clipped and it only displays “Foo…”. Any ideas?


    • imon

      imonimon

      Author Reply

      Did you find the solution? I run to the same issue.


      • Karol

        KarolKarol

        Author Reply

        Still stuck…


      • Abhinay Kumar

        I Solved it. Add missing constraints for all static cells of table view.


    • Simon Ng

      Simon NgSimon Ng

      Author Reply

      I just tried to change the News label to Football. It works. Could you download the final project and try again?


  • bharned3

    bharned3bharned3

    Author Reply

    Its working but get the waring Method ‘target Transformation’ in protocol UIviewControllerCOntextTransitioning’ not implemented

    Anyone know how to fix this


    • bharned3

      bharned3bharned3

      Author Reply

      I had to add this:

      – (CGAffineTransform)targetTransform {

      return self.targetTransform;

      }

      under

      @implementation SWContextTransitionObject

      {

      __weak SWRevealViewController *_revealVC;

      UIView *_view;

      UIViewController *_toVC;

      UIViewController *_fromVC;

      void (^_completion)(void);

      }


      • Imran Ar

        Imran ArImran Ar

        Author Reply

        It is not working for me it throws an error.

        I did like this:

        @implementation SWContextTransitionObject

        {

        __weak SWRevealViewController *_revealVC;

        UIView *_view;

        UIViewController *_toVC;

        UIViewController *_fromVC;

        void (^_completion)(void);

        – (CGAffineTransform)targetTransform {//Throws error here

        return self.targetTransform;

        }

        }

        Error is:
        “Expected member name or ‘;’ after declaration specifiers”


  • rezwansiddiqui

    Dear iPhone and iPad Lovers, I have created a site for you. please visit: http://www.bestiosapps.org


  • Matt

    MattMatt

    Author Reply

    First off: great tutorial! It really helped me, but I have the problem others are having: when you contpol’drag from the Reveal View Controller to the Menu Controller, the reveal view controller set segue doesn’t show up. Instead I have reveal view controller set controller and reveal view controller push controller. Any help is appreciated!


  • Seymour

    SeymourSeymour

    Author Reply

    Strange… No restoration state?


  • Markel

    MarkelMarkel

    Author Reply

    Hi, Thanks for the tutorial i have just imported the SWRevealViewController.h, .m and SidebarMenu-Bridging-Header.h into my project and also i have added the file path in Objective-C Bridging Header. In my HomeViewController i have implemented the code, but am getting the error “HomeViewController does not have a member named revealViewController”. Help me out to fix this issue


    • Fatih K.

      Fatih K.Fatih K.

      Author Reply

      I’m getting the same error. Can you help? @simonng:disqus


      • Seth

        SethSeth

        Author Reply

        I ran into the same problem. For me the error was that the generated Bridging-Header.h file was empty when created. It should have the default name YourProject-Bridging-Header.h and include the line:

        #import “SWRevealViewController.h”


    • Fatih K.

      Fatih K.Fatih K.

      Author Reply

      Oh, I found the reason finally.. I realized I also have another bridging-header file. So, when I inserted the importing code there, it worked..


  • D. Li

    D. LiD. Li

    Author Reply

    Helpful tutorial but to make it even better for newbies — please add instructions on how to manually create the bridging file and add it to the Build Settings. The bridging file was Not created automatically as described in the tutorial. Thank you.


  • Alok Nair

    Alok NairAlok Nair

    Author Reply

    Hi Simon Ng,

    How to make menu visible on right side?


  • Erfan

    ErfanErfan

    Author Reply

    Hey, I did every thing just like what you said but when I click on menu button nothing happens! would you please explain why ?


  • Imran Ar

    Imran ArImran Ar

    Author Reply

    How do I programmatically do SWRevealViewControllerSeguePushController.
    I have a dynamic menu items (UITableView) when I select a an item from UITableVIew. I want to programmatically do a push controller.. Please let me know how do I achieve it?


  • Imran Ar

    Imran ArImran Ar

    Author Reply

    How do I programmatically toggle from MenuViewController to front controller.

    I tried self.revealVIewController().revealToggle(self)

    It is not working..please let me know


  • Bhadresh Sonani

    Hey i am putting logout item in this menu.when i am logout and then login at that time it’s give error like ‘*** -[__NSArrayM insertObject:atIndex:]: object cannot be nil


  • Mr_Bologna

    Mr_BolognaMr_Bologna

    Author Reply

    Hi all! first off, great tutorial for beginners.

    I Understood the code mechanics behind the SlideOutMenu, but I’m struggling to find a way to make a new ControllerView from scratch with the EXACT same menu toggle button (that hamburger menu icon), from the tutorial isn’t implied that it is automatic or if it should me made by hand. I even tried to read the code to find references to the bar button item and how to “copy/duplicate” it on a new Controller View, but no avail.

    I’m a total beginner on Swift, learning by good tutorials like this one. Would any of you kindly explain how could I make a new custom ControllerView which is in turn linked to a new menu item? (e.g. Contacts under Photos). All I want is to expand the menu and adding new tabs to view with the same toggle button structure.

    Many thanks in advance!


  • Zac Wolff

    Zac WolffZac Wolff

    Author Reply

    Hey man, thanks for all the work you put in to keep this site running. I have really benefited from your articles from Objective C and now Swift.

    Unfortunately I am unable to get the slide menu to show and with no errors if I create a project from scratch and follow your instructions. I however get it to work when I continue from the template you provided.

    I have no error messages and can’t seem to locate where the problem is. Please assist me with any help you can offer. Thank you.


    • Zac Wolff

      Zac WolffZac Wolff

      Author Reply

      Hey thank you. I finally got it to work. Salute!


      • Ken Dolan

        Ken DolanKen Dolan

        Author Reply

        Zac, I’m having the same problem and I don’t see a comment helping you fix it. What did you do?


        • Zac Wolff

          Zac WolffZac Wolff

          Author Reply

          Hi @disqus_MzUtsNDoYF:disqus, I was unable to tell what exactly the problem was. Might be swift version or something else. I combined the tutorial here with another I found on YouTube: http://goo.gl/Gs11KA

          With a little tweaks in in this tutorial from AppCoda plus the approach from the video in that link you can make it look and behave just like you find here.

          NB:
          Some of the things missing in the linked YouTube tutorial is a navigation bar icon, view controllers that are not embedded in a navigation controller and also not pushing to the front view controller when cell is selected from the menu.

          You can solve all of that by applying some of the things Simon taught in this article.


  • simkus

    simkussimkus

    Author Reply

    Hey,

    In my case the SWRevealViewController is not the initial viewController, I face a problem, when user clicks a button it segues to SWRevealViewController, but it also adds its own NavigationBar (i use “Embed In”), How do I remove that original Navigation bar, so the NewsViewController NavigationBar is visible again?


  • Paulius

    PauliusPaulius

    Author Reply

    Hey,

    How Do I dismiss rear (Menu Controller) if the user clicks anywhere on the front (News/Map/Photo Controller) ?
    Now it only dismisses it after user clicks again on hamburger menu.


    • Renan

      RenanRenan

      Author Reply

      Where can I find those icons? =D


  • Raj

    RajRaj

    Author Reply

    You can also try this tutorial on TalkersCode.com Simple and best http://talkerscode.com/webtricks/slide-in-and-slide-out-navigation-menu-using-jquery-css.php


  • Serdar Aylanc

    Hello, great tutorial. I tried to create “Menu View Controller” myself in StoryBoard. But i couldn’t find a way to add a Section. Without adding a section, my labels inside cell were not displayed when I run the project. Any help? … Thanks..


    • Osman

      OsmanOsman

      Author Reply

      Hey Serdar, Did you find the solution to make it work? Because i’m facing with the same problem


  • timbojill

    timbojilltimbojill

    Author Reply

    I need a little help. I downloaded the final project. I already have an app on the app store that I want to incorporate the side bar menu in. I have 7 views total. How do I modify the three views News, Maps, and photos. Add my own stuff and then connect a few more views. I deleted everything in the news view added my own stuff but when I went to run it it gave me an error. It should be that hard. kindly email me at [email protected] with some advise.


  • Niranjan Ravichandran

    Hey thanks for this great tutorial! I have a small problem in my slide menu. Everything works fine but for one thing. When i slide the menu and select a menu and it navigates to the correct view controller but the selected menu item remains selected in the table view controller. I have to unselect it and then select it again to navigate to the respective view controller. I don’t know where i’m going wrong. Please can you help me with this..?


  • Alex

    AlexAlex

    Author Reply

    Hey! Just wanted to know how to go about having the menu on the right hand side of the screen rather than the left? Thanks in advance!! Alex.


  • Rosstin Murphy

    Running this in the most recent Xcode, there is an error in NewsTableViewController.swift on the line here:

    let cell = tableView.dequeueReusableCellWithIdentifier(“Cell”, forIndexPath: indexPath) as! NewsTableViewCell

    I’m not sure what the purpose of the ! is, but changing it to

    let cell = tableView.dequeueReusableCellWithIdentifier(“Cell”, forIndexPath: indexPath) as NewsTableViewCell

    without the ! allowed it to compile


  • Luís Pereira

    Great tutorial!

    I implemented the menu as described in the tutorial and made the respective changes to the application I’m developing.

    One of the menu items is logged, how do I open another view automatically?


  • Fernando torcapio ferreira net

    All right, I’m unable to move the project because the it meets the lock and I’m not accomplishing the changes I’m trying to project, I am in xcode version of iOS 6 and 8.

    thank you


  • Dave

    DaveDave

    Author Reply

    How do you get rid of the Cell Separators?


    • Simon Ng

      Simon NgSimon Ng

      Author Reply

      You can use this line of code:

      tableView.separatorColor = UIColor.clearColor()


  • Artur

    ArturArtur

    Author Reply

    Hi!I faced with this problem: trying to create a new project for this tutorial, but creating the files, rather than your pattern. nothing happens, the menu button does not open the menu area. I think the problem is that I can not create a Table View static content, I get prototip content. Even if you copy from your template of Table View, is not working. why? thanks


  • Robin Delaporte

    Hi! Awesome features, it works perfectly when used on the project template. But I was able to got this work on a custom project.. No errors, the sidebar doesn’t shows.. Was anyone able to make it work on another project?
    Thank youu


    • Robin Delaporte

      Finally worked.. The problem was the table view, I changed it to prototype cells and back to static content.. I don’t understand but it works ^^


      • Joey Chronik

        Did you do anything else? That didn’t work for me. I got no errors just a warning. I also implemented Rosstin Murphy’s fix below dropping the ‘!’ off of

        let cell = tableView.dequeueReusableCellWithIdentifier(“Cell”, forIndexPath: indexPath) as! NewsTableViewCell

        My screen is just white. I can’t get past the first test.


        • Robin Delaporte

          You mean, the news view doesn’t show?

          Did you check your reusable cell identifier?


          • Joey Chronik

            Joey ChronikJoey Chronik

            Author

            Nothing shows. It gets past the splash screen, then it’s just white. No menu bar or anything. All I’ve done was download the package and delete that ‘!’ because it was giving me errors and wouldn’t compile.

            Where is the reusable cell identifier?


          • Robin Delaporte

            To make it it work you should at least:
            – add a view controller and set the class to : SWRevealViewController
            -control-drag from reveal controller to another view and select “SWRevealViewControllerSegueSetController”
            -rename this segue “sw_front”


      • kfuller002

        kfuller002kfuller002

        Author Reply

        I had the same issue, to get this to work i had to create the table view from scratch for some reason, changing to prototype and back to static didn’t work for me.


        • kfuller002

          kfuller002kfuller002

          Author Reply

          Actually i noticed there is a map view element attached to the original table controller, if you remove that it works.


  • Joey Chronik

    I noticed “reveal view controller set segue” is not an option. I tried “SWRevealViewControllerSegueSetController”, and I am unable to get anything but a white screen. Help would be appreciated.


    • gabi doroftei

      I agree, under Xcode 7.2 can’t create that segue


    • Bran-dog

      Bran-dogBran-dog

      Author Reply

      Did you ever find a solution to this?


  • David

    DavidDavid

    Author Reply

    Great tutorial! I thought everything was working but I just encountered a bug I can’t figured out how to fix:

    My sidebar menu works fine and takes me to the pages I need, but the problem is when I go somewhere else back to one of the pages connected to the side bar the side bar stops working.

    For example:

    Sidebar –> Page A –> Page B (sub page of page A) –> Page A

    On the second round back to Page A, the side bar doesnt show up anymore.

    Can anyone help please?


    • stefan

      stefanstefan

      Author Reply

      Hi,
      same problem here – did you find a solution?

      Thanks in advance Stefan


    • aaMilad Yalda

      same problem here!!!


    • Paolo Veggi

      Hi, same problem here…someone found a solution??? Thanks.


  • Deekor

    DeekorDeekor

    Author Reply

    I placed a menu button and made an outlet to it but i am getting the errors:

    UIButton does not have a member named ‘target’
    UIButton does not have a member named ‘action’

    Any ideas?


    • Lim Ding Wen

      Hi Deekor, I had this problem as well. It turns out that while UIButton does not have ‘target’ and ‘action’, UIBarButtonItem has. So either use a UIBarButtonItem, or create a custom IBAction that calls ‘revealToggle:’ on the revealViewController.


  • Ruchi Salvi

    how to give back button to the segue view controller ?


  • Matej

    MatejMatej

    Author Reply

    Hey, great tutorial!

    I want to ask one question. In the given example, it looks like the menu is under/beneath the view controller. How to make it appear above the navigation controller with its view controller? Like the menu covers the navigation controller with its content.

    Thank you for any suggestions.

    Matti


  • Chase Packard

    why does deleting the mapkit take away the functionality of the top left button that bring out the side menu?


  • kfuller002

    kfuller002kfuller002

    Author Reply

    Great tutorial but I have some notes for why people cant get this to work in a separate project.

    The first issue i experienced is the menu wont show, eventually i noticed that there is a map view attached to the menu controller. Removing this will get the menu to work.

    After that the only issue will be that the map view still wont work and that’s because there’s nothing in the tutorial that mentions to add mapkit to the project. To do this just open the project settings and under the general tab at the very bottom is Linked frameworks, click the + and search for MapKit and add this. Then everything should work great.

    Thanks again for the tutorial!


  • http://104.131.120.244/sidebar

    ENSwiftSideMenu for iOS – Cocoa Controls


  • Tomer Ciucran

    Is there a way to prevent any actions on the view controller when the menu is open. I would like the user to automatically go to a view controller when tapped anywhere on it.


  • omid

    omidomid

    Author Reply

    hey guys, how can I change side menu from left to right with swipe right to left?


  • fiestas

    fiestasfiestas

    Author Reply

    Help !!!!!!!!!
    why does deleting the mapkit take away the functionality of the top left button that bring out the side menu?


  • randos100

    randos100randos100

    Author Reply

    I also have the problem that when I delete the mapkit.framework does not work the side bar. How I can fix it?


  • richa pathak

    Hi,
    Thanks for nice tutorial.But i have a issue on new,photos and map kit view where once we click on the menu we move to these page but then the menu button doesnot work on these pages.
    can someone suggest what could be the issue.


  • mxnuelsg

    mxnuelsgmxnuelsg

    Author Reply

    I have a trouble:

    I have 3 menu options in my storyboard:

    1 – Home, 2.- Contacts and 3.- Profile

    What happens if I wanna go to Profile from an UIButton on Home Screen?

    I’m in Home Screen and tap the button ‘My Profile’ and I need to show Profile Screen


    • Summer Ji

      Summer JiSummer Ji

      Author Reply

      I had a same problem. Dose anyone help to solve?


  • Hardik Gupta

    Thanks for great Tutorial,,
    How can i hide the menu, when i click anywhere on controller and when menu shows.


  • snmohanty321

    Hi thanks for the tutorial. It works awesome. But I wanted some changes in my app. He swrevealviewcontroller is the initial viewcontroller. I need to add login screen as the initial viewcontroller and after successful login it redirects to this home page. But as swrevealviewcontroller is in obj-c could not able to achieve the same. Any idea to do the same please reply. Thanks in advance.


  • Divya

    DivyaDivya

    Author Reply

    if self.revealViewController() != nil {
    menuBtn.target = self.revealViewController()
    menuBtn.action = “revealToggle:”
    self.view.addGestureRecognizer(self.revealViewController().panGestureRecognizer())
    }

    In this code, my revealViewController is returning nil,where as according to turorial it should not return nil.
    Can anyone help me please.
    Thanks in advance.


    • Thaneerath Thani

      hiii,
      i stucked with the same problem as you face. please help me


    • Arna Sh.

      Arna Sh.Arna Sh.

      Author Reply

      Hello, Divya!
      Maybe, it is too late)
      In this case you should initialize RevealViewController in AppDelegate, thus it will not return nil. In your case, I suppose, it is not enough to check RevealViewController as “is initial view”


  • Yogesh Kohli

    i am using this in my project. (but in objective c language).
    i have a doubt..i want to implement it in one of my controller (home screen controller basically) which is not root view controller. when my code executes, it always crashes when it executes the line “self.view addgestures: self.revealviewcontroller.pangesturerecognizer;” can anyone help me ??
    basically, i know the problem, actually its not root view controller, but due to this slide out menu, i have added another navigation controller and did attach that to home screen controller via root view controller segue.

    please, anyone help me ?


  • Daisy Ramos

    I’m having an issue where I want to instantiate to a different view controller but the menu button gets disabled.

    I’ve posted it here as well. Any thoughts would be appreciated.

    http://stackoverflow.com/questions/32723300/swrevealviewcontroller-menu-button-disabled-when-switching-view-controllers-swi


  • Barry

    BarryBarry

    Author Reply

    hello,

    Is there a way to use handle the Menu Item Selection so it triggers a function? I have added a “Contact us” table cell and i like to trigger a function which will sent an email.
    regards


  • Patrick

    PatrickPatrick

    Author Reply

    Using Xcode Version 7.1 (7B91b) and OS X 10.11.1 (15B42), I’ve tried this tutorial as well as Sidebar Menu Tutorial Swift 2.0 (Kenechi Learns) and cannot get past the first test on either tutorial. I follow the steps precisely but receive the following exception and have not been able to determine what I’m doing wrong. Would really appreciate some guidance here!

    Receiver () has no segue with identifier ‘sw_right’

    Receiver () has no segue with identifier ‘sw_right’


    • AHM SAJID

      AHM SAJIDAHM SAJID

      Author Reply

      Have you imported the SwReveal files to your project?


  • AHM SAJID

    AHM SAJIDAHM SAJID

    Author Reply

    Great Post. Thanks for the tutorial


  • Alex

    AlexAlex

    Author Reply

    Great tutorial! Thanks for sharing.

    Have a couple of questions:

    1- I have removed the icons from my view controller in the storyboard, however when running the project i still have the space in which the icons used to be, basically i want to move the options (text menu items) closer to the border
    2- How can i change the colour of the selected item?
    3- How can i add a logo on top of the menu items and make he options bigger (height)?

    Thanks in advance!


  • mike

    mikemike

    Author Reply

    Awesome tutorial, just one thing the startup project given includes a SidebarMenuTest target and that creates a lot of problem when adding those two objective-c library file, so please remove the SidebarMenuTest targets in the startup project


  • Max

    MaxMax

    Author Reply

    I’m getting this error in the console: 2016-01-28 07:07:01.164 Vegan Food[73390:6961148] *** Assertion failure in -[UIStoryboardSegueTemplate segueWithDestinationViewController:], /BuildRoot/Library/Caches/com.apple.xbs/Sources/UIKit_Sim/UIKit-3512.29.5/UIStoryboardSegueTemplate.m:90


  • jack

    jackjack

    Author Reply

    How do one go about making a segue from e.g. the news view controller to the photos navigation controller?

    If i use the normal push segue, I seem to lose the reference to the SWrear and if I use the SWRevealViewControllerSeguePushController no animation occours??

    Are you supposed to only use the SWRevealViewControllerSeguePushController from the SWrear?

    – And if so, how do you switch between e.g. news and photos without going through the SWrear?

    Thanks in advance and best regards!


  • brokenkeyboards

    Having a weird problem with segues.

    If I download this sample app and delete the segue between the Photo menu items and the relevant navigation controller, then re-add it exactly as before, the segue no longer occurs.
    Got the same issue on another project.

    Has something changed on the SWRevealController that’s modified the behavior?


  • Spartan Jerry

    Hi, this is great. Thanks for the tutorial.

    That being said, this code has a nasty memory leak issue as we’re always reloading the view and, for whatever reason, dismissViewControllerAnimated and popViewControllerAnimated don’t do anything. Any idea of how to fix this?

    Thanks!


    • Saurabh Jhingan

      Hi Spartan,
      Did you find anything useful on why dismissViewControllerAnimated and popViewControllerAnimated are not working?


      • Spartan Jerry

        Hi Saurabh,

        Yeah, it turns out that it’s not the code. It’s simply a bug of the simulator and there’s no issue while it’s running on the actual device, so there’s no need to worry about it.

        Cheers!


      • Spartan Jerry

        Hi Saurabh,

        Yes, as the matter of fact, I did! It turns out that it’s not a bug of the code, but rather a bug of the simulator. If you run it on an actual iOS device, it is not an issue, so there’s no need to worry about it.

        Cheers!


        • Zafer

          ZaferZafer

          Author Reply

          actually we can prevent to click menu item if its current VC on the right side, mine tableview cells are static is it affect on this issue? any idea?


          • Spartan Jerry

            Spartan JerrySpartan Jerry

            Author

            I’m not sure what you’re asking. If you want to enable tap to dismiss the slide-out view, just add the tapGesture to your reveal controller and you’re all set.


          • Zafer

            ZaferZafer

            Author

            question is we can prevent reload vc again and again if its current vc on the right side. are u sure this reloading is not causing memory leak?


  • doctor

    doctordoctor

    Author Reply

    After Xcode update ( swift 2.2) warnings come up


  • Deck2osuab

    Deck2osuabDeck2osuab

    Author Reply

    I have worked up to doing the first test following along. It does not work. A little help please.


  • Axen

    AxenAxen

    Author Reply

    Hi, great tutorial. I downloaded the final project and changed the name of the project from “SidebarMenu”. I have no idea what that changed within the code, and now it won’t do the reveal sidebar menu (either side) even if pressing the buttons. I did what the tutorial said step by step. Still I can’t get it to work… Any help?? maybe someone knows what xCode changed specifically


    • Axen

      AxenAxen

      Author Reply

      Got it to work now. The problem was I removed MapKit because I didn’t need it. I also deleted all the other view controllers but the new’s. I now need to figure out where it is still needing the mapkit to be able to delete it.


  • David Park

    David ParkDavid Park

    Author Reply

    for a custom UIButton, I’m getting a nil when:

    if self.revealViewController() != nil {

    sideMenuButton.addTarget(self.revealViewController(), action: Selector(“revealToggle:”), forControlEvents: .TouchUpInside)
    view.addGestureRecognizer(self.revealViewController().panGestureRecognizer())
    }

    Can anybody help me?


  • Ben

    BenBen

    Author Reply

    Hi,your tutorial is great! But I’m trying to do something extra like the picture i added.As you can see, when i click “Item”, this table view connected to it will be below this slide out menu, do you know how to fix this? Much obliged!


  • D7

    D7D7

    Author Reply

    How do this with completely no storyboard? I have search the entire internet and found nothing. Thanks


  • Mark Bagnall

    Hi I am trying to change the content of the Controllers, and when I do the menu button and title bar disappear


    • Mark Bagnall

      It happened if I set a different InitialView controller, so with that in mind how can I change the first controller so its not the news one first


  • gaurav negi

    Hey great tutorial ,but i am stuck. If i open keyboard and tries to go in menu(reveal view controller) it does not hide keyboard. i try fail . plz help me


  • Vonn

    VonnVonn

    Author Reply

    Thank you!! It works! However, in the version of my XCODE (7.3.1), I did not use the ‘reveal view controller set segue’ because there was no option for it, rather I used ‘reveal view controller set controller’. Would there be any difference or such?


  • Budhabhooshan Patil

    https://uploads.disquscdn.com/images/62f1f7470fedd0fdef9a72de2ae751497b3d7d243c8624f2cde7e75668ac118a.png

    I am using SWRevealViewController with Google Maps.My rear view controller loads google map. Problem is that first time it loads google map with my current location correctly but when i redirect to different screen from menu and comes back to google map screen from menu again instead of going to my current location it goes to some where in UK.


  • adarsh kc

    adarsh kcadarsh kc

    Author Reply

    this tutorial is useful but when i use the SWRevealViewController in project and write the code i where the menu is needed the back button is not working
    //**************************************** ERROR THAT I HAD FOUND ***************************************//

    2016-11-09 15:57:39.110 menu[3681:90545] *** Terminating app due to uncaught exception ‘NSInvalidArgumentException’, reason: ‘*** -[__NSArrayM insertObject:atIndex:]: object cannot be nil’
    *** First throw call stack:
    (
    0 CoreFoundation 0x00000001035aa34b __exceptionPreprocess + 171
    1 libobjc.A.dylib 0x0000000102bee21e objc_exception_throw + 48
    2 CoreFoundation 0x00000001034db38f -[__NSArrayM insertObject:atIndex:] + 1375
    3 UIKit 0x00000001041a1518 -[UIView(UIViewGestures) addGestureRecognizer:] + 200
    4 menu 0x00000001025f65f6 -[ViewController viewDidLoad] + 374
    5 UIKit 0x000000010427f06d -[UIViewController loadViewIfRequired] + 1258
    6 UIKit 0x000000010427f4a0 -[UIViewController view] + 27
    7 UIKit 0x00000001042cd3ba -[UINavigationController preferredContentSize] + 198
    8 UIKit 0x0000000104261773 -[UIPresentationController preferredContentSizeDidChangeForChildContentContainer:] + 64
    9 UIKit 0x000000010425d5bc __56-[UIPresentationController runTransitionForCurrentState]_block_invoke + 111
    10 UIKit 0x00000001040ea8bb _runAfterCACommitDeferredBlocks + 320
    11 UIKit 0x00000001040d753f _cleanUpAfterCAFlushAndRunDeferredBlocks + 566
    12 UIKit 0x00000001041087ce _afterCACommitHandler + 176
    13 CoreFoundation 0x000000010354ee17 __CFRUNLOOP_IS_CALLING_OUT_TO_AN_OBSERVER_CALLBACK_FUNCTION__ + 23
    14 CoreFoundation 0x000000010354ed87 __CFRunLoopDoObservers + 391
    15 CoreFoundation 0x0000000103533b9e __CFRunLoopRun + 1198
    16 CoreFoundation 0x0000000103533494 CFRunLoopRunSpecific + 420
    17 GraphicsServices 0x0000000108964a6f GSEventRunModal + 161
    18 UIKit 0x00000001040ddf34 UIApplicationMain + 159
    19 menu 0x000000010260319f main + 111
    20 libdyld.dylib 0x0000000106a9568d start + 1
    21 ??? 0x0000000000000001 0x0 + 1
    )
    libc++abi.dylib: terminating with uncaught exception of type NSException
    (lldb)


  • Priya V R

    Priya V RPriya V R

    Author Reply

    hi, I have an issue when self.revealViewController().pushFrontViewController(),it shows a black screen.How can i solve this?Plz help me


  • Harun Işık

    Hi, thanks a lot for your tutorial. It works greatly.


  • Andi Abi Dzar Makkasau

    hi, i like your code guys

    And i want to ask you, could i use that code to build my app then upload it to appstore ?

    thanks, abi


  • frank miller

    has anyone figured out to get the full extension of the menu when you display it!?


  • Bhavin Ramani

    Hello,
    I want to change “SidebarMenu” from left to right when arabic language is selected in my app. In my app when I select Arabic language then barbutton(menuButton) is move to right side. So, I want to open “SidebarMenu” from right side. In english language it should open from left side as usual.

    Here is the code in ViewController:

    override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    let currentLanguageCode = LanguageManager.currentLanguageCode()
    if currentLanguageCode == “ar” {
    // I want to show “SideMenuBar” from right side
    } else {
    // I want to show “SideMenuBar” from left side
    }

    if self.revealViewController() != nil {
    menuButton.target = self.revealViewController()
    menuButton.action = #selector(SWRevealViewController.revealToggle(_:))
    self.view.addGestureRecognizer(self.revealViewController().panGestureRecognizer())
    }
    }


    • Mohammed Elias

      Did you get an answers ?


      • Bhavin Ramani

        Nope.


        • Mohammed Elias

          Do you know how to change the way that SWReveal works, whats I mean is make swReveal cover the main view not push it?


    • Marjan Basiri

      Hi,
      I know it is too late!! but it may be useful for someone…

      It is simple

      1. use “sw_right” instead of “sw_rear” in storyBoard (Segue identifiet).
      2. use the string “rightRevealToggle:” instead of “revealToggle:” in your code.

      Done!


  • Mohammed Elias

    how to make the side-bar menu covers the main view and its’ buttons, for example 70% of main view cover not pushed ?


  • devang bhatt

    I have done same process as your code given but I am getting black screen


  • Mohammed Elias

    Do anyone here know how to change the way that SWReveal works, whats I mean is make swReveal cover the main view not push it?


  • yoshiboarder

    Hi Is there a way to change frontView background color?


  • Sushant Jagtap

    Thanks Simon. it is exactly I’m looking for.. thank you very much


  • elias

    eliaselias

    Author Reply

    Hello
    I have downloaded the Sidebar Menu. but i need to change the app main page to a login screen.
    my problem is that when i login and navigate manually to the news controller for example the menu disappear.
    Can anyone help please


    • faklyasgy

      faklyasgyfaklyasgy

      Author Reply

      Have exactly the same issue and couldn’t find a solution yet, so if you have one, please share with me.


  • David

    DavidDavid

    Author Reply

    Is this going to work with changing viewcontroller in storyboards ?


  • Rees Hopper

    Hey,
    I don’t know if anyone has asked this before, but I downloaded the template and wanted to make it myself with some customization but I couldn’t figure out how to make the actual menu bar that was on the template or how to make an IBOutlet for the menu button so that it can be used to perform the actions.
    Please respond with a solution.

    Thanks,
    Rees Hopper


  • James Hartley

    This is broken in Xcode 9 Swift 4


  • Niket Priyadarshi

    In table view in left menu i am using single cell for multiple rows, how will i open selected left menu option in front view controller, i am using storyboard.
    Thanks i advance.


  • Florian Marcu

    Thank you! I’ve created and open-sourced a Swift 4 version of a sidebar menu, based on this tutorial. Feel free to check it out at https://www.iosapptemplates.com/blog/swift-programming/drawer-menu-swift-4-iphone .


  • Gustavo M. Severo

    Hi Simon!
    I opened the project template, on Xcode and a message appears saying that the project was build in Swift 2 and Xcode 8, but I ignored it. Then I try to run the app and failed. How I can fix it? Since now, thank you for your attention https://uploads.disquscdn.com/images/5ae62973e1d5a29ec61f7aa3da5b39efa307408e91ca878de4b1340bb5bc8810.png


  • Florian Marcu

    Nice tutorial! I’ve created a side menu in Swift 4 using these steps. Thank you!


  • Chhavi krishan kaushik

    working fine with out tabbar . in tabbar project it hide my tabbar when coming back from rear to front


Leave a Reply to Michael
Cancel Reply

Shares