Share
Apples WatchKit-ram för att utveckla Apples Watch-applikationer erbjuder flera sätt för dig som utvecklare att presentera olika typer av gränssnitt till användare av din app. Detta inkluderar sidbaserade, hierarkiska och modala gränssnitt, som alla kan använda kontext för att skapa dynamiskt innehåll.
I den här handledningen ska jag visa dig hur du konfigurerar och hanterar varje gränssnittstyp, och vilka användningsfall de är utformade för.
Denna handledning kräver att du kör Xcode 6.2+ och är bekväm med att skapa en grundläggande Apple Watch-app. Om inte, läs några av de andra WatchKit-handledningarna på Tuts + och kom tillbaka till den här. Du måste också ladda ner startprojektet från GitHub.
Den första typen av gränssnitt som du ska implementera i din Apple Watch-app kommer att vara en sidbaserad. Dessa typer av gränssnitt fungerar mycket lik standardskärmen på en iOS-enhet för att visa flera sidor med information i en bestämd ordning. Sidbaserade gränssnitt passar bäst för när du behöver visa flera skärmar med information som är relaterade till varandra.
Öppna startprojektet i Xcode och navigera till Interface.storyboard. Berättelsen innehåller redan sex gränssnittsregulatorer som du ser nedan.
För att skapa ett sidbaserat gränssnitt måste du skapa en nästa sidarelativ segue mellan gränssnittskontrollerna du vill länka. tryck på Kontrollera knappen på ditt tangentbord och klicka och dra från en gränssnittskontroller till en annan. Styr och dra från den första gränssnittsstyrenheten till den andra och, om det görs korrekt, a Relationship Segue popup ska visas. Välj den här popup-menyn nästa sida alternativet som visas nedan.
Följ samma steg för att länka den andra gränssnittskontrollen till den tredje. Storyboardet ska nu visa segerna mellan de tre tre gränssnittsregulatorerna. Observera att den ordning i vilken du skapar dessa seglar bestämmer vilken ordning gränssnitten kommer att visas i din WatchKit-app.
Bygg och kör din app och öppna en Apple Watch som en extern bildskärm i iOS-simulatorn. Du kommer att se att appen visar Första sidan gränssnittskontrollen och har tre punkter längst ner, som representerar de tre tillgängliga sidorna. Du kan svepa mellan de tre sidorna genom att dra åt vänster eller höger, precis som du skulle på en iOS-enhet.
När du använder ett sidbaserat gränssnitt kan du ange vilken gränssnittsregulator du vill visas vid start. Detta görs genom att använda becomeCurrentPage metod. Öppna SecondPageInterfaceController.swift och lägg till följande rad till awakeWithContext (_ :) metod:
åsidosätta func awakeWithContext (context: AnyObject?) super.awakeWithContext (context) self.becomeCurrentPage ()
Bygg och kör din app igen, och du kommer se att den andra sidan presenteras nu under lanseringen.
Vid körtid kan du också ange en explicit ordning för att visa sidorna i ditt gränssnitt. Detta görs genom att använda reloadRootControllersWithNames (_: sammanhang :) klassmetod.
Den första parametern för den här metoden är en rad strängar som innehåller storyboard-identifierarna för gränssnittsregulatorerna du vill ladda. Ordningen med identifierare i denna array bestämmer den ordning som sidorna visas i.
Den andra parametern är en valfri AnyObject skriv array som innehåller kontexten för var och en av sidorna. Du lär dig mer om sammanhang senare i denna handledning. För nu kommer du bara lämna denna parameter som noll. Byt ut den linje du just har lagt till din awakeWithContext (_ :) metod med följande:
åsidosätta func awakeWithContext (context: AnyObject?) super.awakeWithContext (context) WKInterfaceController.reloadRootControllersWithNames (["Tredje sidan", "Första sidan"], kontext: noll)
Bygg och kör din app och du kommer se att efter att laddningen har slutförts visas din app på den tredje sidan följt av den första sidan.
Förutom sidbaserade gränssnitt kan du också implementera hierarkiska gränssnitt i en Apple Watch-app. Vi talar om hierarkiska gränssnitt när övergången mellan gränssnittsregulatorer använder en tryck övergång.
Beteendet hos ett hierarkiskt gränssnitt liknar det i UINavigationController klass i en iOS-app. Denna typ av Apple Watch-gränssnitt passar bäst för att presentera flera gränssnitt en efter en på ett linjärt sätt.
Återbesök Interface.storyboard och dra den Huvudadressen pil till Transition gränssnittskontrollen som visas nedan. Detta gör att den angivna gränssnittsstyrenheten visas först när appen startas.
Nästa, öppna TransitionInterfaceController.swift och lägg till följande rad i pushButtonPressed metod:
Accentsconagua
@IBAction func pushButtonPressed () self.pushControllerWithName ("Hierarchal Interface", kontext: noll)Liknande till reloadRootControllersWithNames (_: sammanhang :) metod som du använde tidigare, den första parametern för pushControllerWithName (_: sammanhang :) är storyboard-identifieraren för gränssnittskontrollen du vill trycka. Den andra parametern är kontexten för den här nya gränssnittsregulatorn.
Bygg och kör din app. Du bör se följande gränssnitt när din WatchKit-app är klar att starta.
Knacka på hierarkiska knappen ska trycka på nästa gränssnitt på skärmen som visas nedan.
Du kommer märka att det nu finns en liten pil i skärmens övre vänstra hörn. Genom att trycka på pilen kommer du tillbaka till föregående gränssnitt. Det är också möjligt att popa den nuvarande gränssnittsregulatorn i kod. I HierarchalInterfaceController klass, uppdatera popButtonPressed metod enligt följande:
@IBAction func popButtonPressed () self.popController ()
Bygg och kör din app igen. Knacka på Pop knappen ska nu ha samma effekt som att trycka på bakpilen längst upp till vänster.
Alternativt, om du vill återgå till det allra första gränssnittet i hierarkin, ringer du på popToRootController metod snarare än popController metod. För din nuvarande app, skulle dessa metoder båda ge samma resultat eftersom det bara finns två gränssnitt i hierarkin för tillfället.
Modala gränssnitt fungerar på samma sätt som hierarkiska gränssnitt. Den stora skillnaden mellan de två är att modala gränssnitt är utformade för att visa gränssnitt ovanpå varandra istället för att överföra dem på ett linjärt sätt.
Gå tillbaka till TransitionInterfaceController.swift och lägg till följande rad kod till modalButtonPressed metod:
@IBAction func modalButtonPressed () self.presentControllerWithName ("Modal Interface", kontext: noll)För att avvisa det modala gränssnittet, uppdatera dismissButtonPressed metod enligt följande i ModalInterfaceController:
@IBAction func dismissButtonPressed () self.dismissController ()
Bygg och kör din app. Tryck på Modal knappen för att presentera ett modalt gränssnitt.
En fördel med modala gränssnitt är att du modellt kan presentera ett sidbaserat gränssnitt. Detta görs genom att använda presentControllersWithNames (_: sammanhang :) metod. Den första parametern är en rad storyboard-identifierare och den andra parametern är en rad kontextobjekt. I TransitionInterfaceController.swift, uppdatera genomförandet av modalButtonPressed metod enligt följande:
@IBAction func modalButtonPressed () self.presentControllerWithNames (["Modal Interface", "Hierarchal Interface"], kontext: noll)
Kör din app och tryck på Modal knapp. Ett sidbaserat gränssnitt ska presenteras modellt med följande två gränssnitt:
Som du har sett från de olika metoderna som använts i denna handledning hittills, när du övergår till ett nytt gränssnitt kan du skicka i ett sammanhang för att konfigurera gränssnittet som håller på att presenteras. Kontextet du skickar till ditt nya gränssnitt är valfritt och kan vara vilken datatyp som helst (AnyObject?).
Det betyder att du kan överföra alla typer av data mellan gränssnitt, från enkla nummer till komplexa datastrukturer. Kontexten överlämnas till det nya gränssnittet i awakeWithContext (_ :) metod. Fördelen med att överföra ett sammanhang till en gränssnittskontroller är att konfigurera innehållet dynamiskt, det vill säga vid körning.
Öppna TransitionInterfaceController.swift och uppdatera genomförandet av modalButtonPressed metod enligt följande:
@IBAction func modalButtonPressed () self.presentControllerWithName ("Modal Interface", sammanhang: "Anpassad text")I ModalInterfaceController.swift, uppdatera genomförandet av awakeWithContext (_ :) som följer:
åsidosätta func awakeWithContext (context: AnyObject?) super.awakeWithContext (context) om låt text = sammanhang som? String button.setTitle (text)
Vi använder valfri bindning för att se om det angivna sammanhanget kan kastas i en Sträng. Om det kan, ställer vi in knapps titel till det värdet.
Bygg och kör din app och öppna det modala gränssnittet. Knappens titel borde ha ändrats till Anpassad text.
Om du är intresserad av att ta din WatchKit-utbildning till nästa nivå kan du titta på vår fullständiga kurs om WatchKit-utveckling.
I denna handledning lärde du dig hur du konfigurerar och använder de tre huvudgränssnittstyperna som är tillgängliga för WatchKit-applikationer, sidbaserade, hierarkiska och modala. Du lärde dig också hur du använder gränssnittskontext för att konfigurera gränssnittsregulatorer vid körning. Nu vet du också när det är bäst att använda var och en av dessa gränssnittstyper i dina WatchKit-applikationer. Du kan läsa mer om gränssnittsnavigering i Apples dokumentation.
