Share
Das WatchKit-Framework von Apple für die Entwicklung von Apple Watch-Anwendungen bietet Ihnen als Entwickler verschiedene Möglichkeiten, den Benutzern Ihrer App verschiedene Arten von Schnittstellen zu präsentieren. Dazu gehören seitenbasierte, hierarchische und modale Schnittstellen, die alle Kontexte zum Erstellen dynamischer Inhalte verwenden können.
In diesem Tutorial werde ich Ihnen zeigen, wie Sie die einzelnen Schnittstellentypen einrichten und bearbeiten und für welche Anwendungsfälle sie jeweils entwickelt wurden.
In diesem Lernprogramm müssen Sie Xcode 6.2+ ausführen und sich mit der Erstellung einer einfachen Apple Watch-App vertraut machen. Falls nicht, lesen Sie bitte einige der anderen WatchKit-Tutorials zu Tuts + und kommen Sie dann auf dieses zurück. Sie müssen auch das Starterprojekt von GitHub herunterladen.
Die erste Art von Schnittstelle, die Sie in Ihre Apple Watch-App implementieren, ist eine seitenbasierte. Diese Arten von Schnittstellen funktionieren sehr ähnlich wie der Standard-Startbildschirm auf einem iOS-Gerät, um mehrere Informationsseiten in einer festgelegten Reihenfolge anzuzeigen. Seitenbasierte Schnittstellen eignen sich am besten, wenn Sie mehrere Bildschirme mit Informationen anzeigen möchten, die miteinander in Beziehung stehen.
Öffnen Sie das Starterprojekt in Xcode und navigieren Sie zu Interface.storyboard. Das Storyboard enthält bereits sechs Schnittstellen-Controller, wie Sie unten sehen.
Um eine seitenbasierte Benutzeroberfläche zu erstellen, müssen Sie eine Nächste SeiteBeziehung zwischen den Interface-Controllern, die Sie verknüpfen möchten. Drücken Sie die Steuerung Taste auf Ihrer Tastatur und klicken und ziehen Sie von einem Schnittstellen-Controller zu einem anderen. Steuern und ziehen Sie vom ersten Schnittstellen-Controller zum zweiten Controller und ziehen Sie ihn, wenn er korrekt ausgeführt wird, ein Relationship Segue Popup sollte erscheinen. Wählen Sie aus diesem Einblendmenü die Option Nächste Seite Option wie unten gezeigt.
Führen Sie die gleichen Schritte aus, um den zweiten Schnittstellencontroller mit dem dritten zu verbinden. Das Storyboard sollte jetzt die Segmente zwischen den drei obersten Schnittstellen-Controllern anzeigen. Beachten Sie, dass die Reihenfolge, in der Sie diese Segmente erstellen, die Reihenfolge bestimmt, in der die Schnittstellen in Ihrer WatchKit-App angezeigt werden.
Erstellen und starten Sie Ihre App und öffnen Sie eine Apple Watch als externe Anzeige im iOS-Simulator. Sie werden sehen, dass die App das anzeigt Erste Seite Interface Controller und hat drei Punkte am unteren Rand, die die drei verfügbaren Seiten darstellen. Sie können zwischen den drei Seiten streichen, indem Sie nach links oder rechts streichen, genau wie auf einem iOS-Gerät.
Wenn Sie eine seitenbasierte Schnittstelle verwenden, können Sie angeben, welcher Schnittstellen-Controller beim Start angezeigt werden soll. Dies geschieht mit der comeCurrentPage Methode. Öffnen SecondPageInterfaceController.swift und fügen Sie die folgende Zeile hinzu awakeWithContext (_ :) Methode:
func awakeWithContext (context: AnyObject?) überschreiben super.awakeWithContext (context) self.becomeCurrentPage ()
Erstellen Sie Ihre App erneut, und führen Sie sie erneut aus. Die zweite Seite wird jetzt beim Start angezeigt.
Zur Laufzeit können Sie auch eine explizite Reihenfolge angeben, in der die Seiten Ihrer Schnittstelle angezeigt werden. Dies geschieht mit der reloadRootControllersWithNames (_: Kontexte :) Klassenmethode.
Der erste Parameter dieser Methode ist ein Array von Strings, das die Storyboard-IDs der Schnittstellencontroller enthält, die Sie laden möchten. Die Reihenfolge der Bezeichner in diesem Array bestimmt die Reihenfolge, in der die Seiten angezeigt werden.
Der zweite Parameter ist optional AnyObject Typarray, das die Kontexte für jede der Seiten enthält. Sie werden später in diesem Tutorial mehr über Kontexte erfahren. Im Moment lassen Sie diesen Parameter einfach als Null. Ersetzen Sie die gerade hinzugefügte Zeile awakeWithContext (_ :) Methode mit der folgenden:
func awakeWithContext (context: AnyObject?) überschreiben super.awakeWithContext (context) WKInterfaceController.reloadRootControllersWithNames (["Dritte Seite", "Erste Seite"], Kontexte: nil)
Erstellen Sie Ihre App und führen Sie sie aus. Sie werden sehen, dass nach dem Laden die dritte Seite, gefolgt von der ersten Seite, angezeigt wird.
Neben seitenbasierten Schnittstellen können Sie auch hierarchische Schnittstellen in einer Apple Watch-App implementieren. Wir sprechen von hierarchischen Schnittstellen beim Übergang zwischen Schnittstellensteuerungen mit a drücken Übergang.
Das Verhalten einer hierarchischen Schnittstelle ähnelt dem der UINavigationController Klasse in einer iOS-App. Diese Art von Apple Watch-Schnittstelle eignet sich am besten für die lineare Darstellung mehrerer Schnittstellen nacheinander.
Erneut besuchen Interface.storyboard und ziehen Sie die Haupteinstiegspunkt Pfeil zum TRansition Schnittstellen-Controller wie unten gezeigt. Dadurch wird der angegebene Schnittstellen-Controller beim Start der App zuerst angezeigt.
Als nächstes öffnen TransitionInterfaceController.swift und fügen Sie die folgende Zeile in die pushButtonPressed Methode:
Accentsconagua
@IBAction func pushButtonPressed () self.pushControllerWithName ("Hierarchal Interface", Kontext: nil)Ähnlich wie reloadRootControllersWithNames (_: Kontexte :) Methode, die Sie zuvor verwendet haben, der erste Parameter von pushControllerWithName (_: context :) ist die Storyboard-ID des Schnittstellencontrollers, den Sie pushen möchten. Der zweite Parameter ist der Kontext für diesen neuen Schnittstellencontroller.
App erstellen und ausführen Die folgende Benutzeroberfläche sollte angezeigt werden, wenn der Start der WatchKit-App abgeschlossen ist.
Tippen auf die Hierarchisch Mit der Taste wird die nächste Schnittstelle wie unten gezeigt auf den Bildschirm gedrückt.
Sie werden feststellen, dass sich in der oberen linken Ecke des Bildschirms jetzt ein kleiner Pfeil befindet. Durch Antippen des Pfeils gelangen Sie zurück zur vorherigen Benutzeroberfläche. Es ist auch möglich, den aktuellen Schnittstellencontroller im Code zu platzieren. In dem HierarchalInterfaceController Klasse, aktualisieren Sie die popButtonPressed Methode wie folgt:
@IBAction func popButtonPressed () self.popController ()
Erstellen Sie Ihre App erneut und führen Sie sie erneut aus. Tippen auf die Pop Die Schaltfläche sollte jetzt dieselbe Wirkung haben wie das Drücken des hinteren Pfeils oben links.
Wenn Sie zur ersten Schnittstelle in der Hierarchie zurückkehren möchten, rufen Sie alternativ die popToRootController Methode und nicht die popController Methode. Für Ihre aktuelle App würden diese Methoden dasselbe Ergebnis erzielen, da sich in der Hierarchie derzeit nur zwei Schnittstellen befinden.
Modale Schnittstellen funktionieren ähnlich wie hierarchische Schnittstellen. Der Hauptunterschied zwischen den beiden besteht darin, dass modale Schnittstellen dazu ausgelegt sind, Schnittstellen übereinander darzustellen, anstatt linear zwischen ihnen zu wechseln.
Geh zurück zu TransitionInterfaceController.swift und fügen Sie die folgende Codezeile hinzu modalButtonPressed Methode:
@IBAction func modalButtonPressed () self.presentControllerWithName ("Modal Interface", Kontext: nil)Um die modale Schnittstelle zu schließen, aktualisieren Sie die entlassenButtonPressed Methode wie folgt in der ModalInterfaceController:
@IBAction func dismissButtonPressed () self.dismissController ()
App erstellen und ausführen Tippen Sie auf die Modal Schaltfläche, um eine modale Schnittstelle anzuzeigen.
Ein Vorteil modaler Schnittstellen besteht darin, dass Sie eine seitenbasierte Schnittstelle modal darstellen können. Dies geschieht mit der presentControllersWithNames (_: Kontexte :) Methode. Der erste Parameter ist ein Array von Storyboard-Bezeichnern und der zweite Parameter ist ein Array von Kontextobjekten. Im TransitionInterfaceController.swift, Aktualisieren Sie die Implementierung des modalButtonPressed Methode wie folgt:
@IBAction func modalButtonPressed () self.presentControllerWithNames (["Modal Interface", "Hierarchal Interface"], Kontexte: nil)
Führen Sie Ihre App aus und tippen Sie auf Modal Taste. Eine seitenbasierte Schnittstelle sollte modal mit den folgenden zwei Schnittstellen dargestellt werden:
Wie Sie anhand der verschiedenen in diesem Lernprogramm verwendeten Methoden gesehen haben, können Sie beim Übergang zu einer neuen Schnittstelle in einem Kontext die Konfiguration der Schnittstelle vorgeben, die gerade präsentiert wird. Der Kontext, den Sie an Ihre neue Schnittstelle übergeben, ist optional und kann einen beliebigen Datentyp haben (AnyObject?).
Das bedeutet, dass Sie zwischen den Schnittstellen beliebige Datentypen übergeben können, von einfachen Zahlen bis hin zu komplexen Datenstrukturen. Der Kontext wird an die neue Schnittstelle in übergeben awakeWithContext (_ :) Methode. Die Übergabe eines Kontexts an einen Schnittstellencontroller hat den Vorteil, dass der Inhalt dynamisch konfiguriert wird, dh zur Laufzeit.
Öffnen TransitionInterfaceController.swift und aktualisieren Sie die Implementierung des modalButtonPressed Methode wie folgt:
@IBAction func modalButtonPressed () self.presentControllerWithName ("Modal Interface", Kontext: "Benutzerdefinierter Text")Im ModalInterfaceController.swift, Aktualisieren Sie die Implementierung des awakeWithContext (_ :) wie folgt:
func awakeWithContext (context: AnyObject?) überschreiben super.awakeWithContext (context), wenn text = context als? String button.setTitle (Text)
Wir verwenden die optionale Bindung, um zu sehen, ob der Kontext in einen gegossen werden kann String. Wenn es geht, setzen wir die TasteTitel dieses Wertes.
Erstellen und starten Sie Ihre App und öffnen Sie die modale Benutzeroberfläche. Der Titel der Schaltfläche sollte sich in geändert haben Kundenspezifischer Text.
Wenn Sie daran interessiert sind, Ihre WatchKit-Schulung auf die nächste Stufe zu bringen, können Sie einen Blick auf unseren gesamten Kurs zur Entwicklung von WatchKit werfen.
In diesem Lernprogramm haben Sie gelernt, wie Sie die drei für WatchKit-Anwendungen verfügbaren Hauptschnittstellentypen einrichten und verwenden, seitenbasiert, hierarchisch und modal. Sie haben auch gelernt, Schnittstellenkontroller zur Laufzeit mit Schnittstellenkontexten zu konfigurieren. Sie wissen jetzt auch, wann Sie diese Schnittstellentypen in Ihren WatchKit-Anwendungen am besten verwenden können. Weitere Informationen zur Navigation in der Benutzeroberfläche finden Sie in der Dokumentation von Apple.
