SlideOut-Navigation mit SWRevealController

Wer eine SlideOut Navigation in Swift einsetzen möchte, der kann auf das Projekt von John Lluch zurückgreifen. Das ist zwar in Objective-C geschrieben, kann allerdings – wie jeder Objective-C Code – via Bridging-Header eingebunden werden. Der Code selbst ist sehr gut dokumentiert und lesbar. Zusätzlich können im Issue-Bereich eigene Frage gestellt werden (die nach eigener Erfahrung sehr schnell beantwortet werden).

Das fertige Menü:

Bevor es los geht, werden die beiden Dateien „SWRevealViewController.h“ und „SWRevealViewController.m“ aus dem Git-Repo benötigt. Kopiert beide Dateien in euer Projekt und legt eine entsprechende Header-Datei an (beim Kopieren der beiden Dateien erkennt Xcode automatisch, dass es sich um Objective-C Dateien handelt und bietet euch an, die Header-Datei automatisch anzulegen):

Damit man final auf die Klasse SWRevealViewController zugreifen kann, muss in der Header-Datei folgender Import definiert werden:

#import "SWRevealViewController.h"

Für das Beispiel werden insgesamt drei ViewController benötigt:

• Ein ViewController, der das Menü steuert (diesem wird die Klasse SWRevealViewController zugewiesen)
• Ein ViewContoller, der die Hauptview darstellt (eingebettet in einen NavigationController)
• Ein ViewController, der das Menü selbst darstellt (in unserem Fall ein TableViewController)

Die ViewController fertig verbunden im Storyboard:

Schritt 1 – Einbinden der SWRevealViewController-Klasse:
Erstellt eine Klasse MyRevealViewController.swift die von der Klasse SWRevealViewController erbt. Theoretisch könnte man SWRevealViewController auch direkt der View zuordnen. Für eine bessere Wartbarkeit (z.B. wenn bestimmte Parameter für das SlideOut-Menü gesetzt werden sollen) kapseln wir diese in eine extra Datei.
Weist anschließend dem bereits initial vorhandenem ViewController die Klasse MyRevealViewController zu.

Schritt 2 – Erstellen und Einbinden des Menüs:
Erstellt einen TableViewController (aka „Menü“). Der Einfachheit halber wählt für den Content „Static Cells“ aus, dann sparen wir uns das Erstellen einer separaten ViewController-Datei für dieses Beispiel.
Erstellt einen Segue vom MyRevealViewController Controller hin zum Menü (via „ctrl+drag“). Wählt dabei die Option „reveal view controller set controller“ aus und weist dem entstandenem Segue den Identifier „sw_rear“ zu. Damit wird definiert, dass das Menü „hinter“ der eigentlichen View platziert wird.

Schritt 3 – Erstellen und Einbinden der Front-View:
Erstellt einen neuen ViewController und bettet diesen in einen NavigationController ein (ViewController markieren, „Editor“ -> „Embed in“ -> „Navigation Controller“). Dadurch bekommen wir die Möglichkeit, den Menü-Button platzieren zu können.
Erstellt einen Segue von MyRevealViewController zum NavigationsController und weist diesem den Identifier „sw_front“ zu.
Erstellt ein „Bar Button Item“ auf der Navigationsleiste und nennt diesen „Menü“.
Erstellt ein Outlet für den Menü-Button innerhalb des ViewController-Codes und nennt diesen „menu“.
In der viewDidLoad Methode wird dann folgender Code benötigt:
self.menu.target = self.revealViewController()
self.menu.action = #selector(SWRevealViewController.revealToggle(_:))

Voilà!