Share
Apples WatchKit-rammeverk for å utvikle Apple Watch-applikasjoner gir flere måter for deg som utvikler å presentere ulike typer grensesnitt til brukere av appen din. Dette inkluderer sidebaserte, hierarkiske og modale grensesnitt, som alle kan bruke kontekster for å lage dynamisk innhold.
I denne opplæringen skal jeg vise deg hvordan du konfigurerer og manipulerer hver grensesnitttype, og hvilke bruksområder de er designet for.
Denne opplæringen krever at du kjører Xcode 6.2+ og er komfortabel med å lage en grunnleggende Apple Watch-app. Hvis ikke, vennligst les noen av de andre WatchKit-veiledningene på Tuts + og kom tilbake til denne. Du må også laste ned startprosjektet fra GitHub.
Den første typen grensesnitt du skal implementere i Apple Watch-appen din, vil være en sidebasert. Disse typer grensesnitt fungerer veldig likt det vanlige hjemmeskjermen på en iOS-enhet for å vise flere sider med informasjon i en bestemt rekkefølge. Sidebaserte grensesnitt passer best til når du må vise flere skjermbilder av informasjon som er relatert til hverandre.
Åpne startprosjektet i Xcode og naviger til Interface.storyboard. Fortellingsbrettet inneholder allerede seks grensesnittkontrollere som du ser nedenfor.
For å opprette et sidebasert grensesnitt må du opprette en neste sideforholdssegment mellom grensesnittkontrollene du vil koble sammen. trykk Styre knappen på tastaturet ditt og klikk og dra fra en grensesnittkontroll til en annen. Kontroller og dra fra den første grensesnittkontrollen til den andre, og hvis det gjøres riktig, a Forholdssegment popup-vinduet skal vises. Fra denne hurtigmenyen velger du neste side alternativet som vist nedenfor.
Følg disse trinnene for å koble den andre grensesnittkontrolleren til den tredje. Fortellingsbrettet skal nå vise segiene mellom de tre øverste grensesnittkontrollene. Legg merke til at rekkefølgen der du oppretter disse segmentene, bestemmer rekkefølgen grensesnittene vil vises i WatchKit-appen din.
Bygg og kjør appen din, og åpne en Apple Watch som et eksternt skjermbilde i iOS-simulatoren. Du vil se at appen viser Første side grensesnittkontrollen og har tre prikker nederst, som representerer de tre tilgjengelige sidene. Du kan sveipe mellom de tre sidene ved å sveipe til venstre eller høyre, akkurat som du ville på en iOS-enhet.
Når du bruker et sidebasert grensesnitt, kan du angi hvilken grensesnittkontroller du vil se ved lansering. Dette gjøres ved å bruke becomeCurrentPage metode. Åpen SecondPageInterfaceController.swift og legg til følgende linje til awakeWithContext (_ :) metode:
overstyre func awakeWithContext (kontekst: AnyObject?) super.awakeWithContext (kontekst) self.becomeCurrentPage ()
Bygg og kjør appen din på nytt, og du vil se at den andre siden nå presenteres ved lansering.
Ved kjøring kan du også spesifisere en eksplisitt ordre for å vise sidene i grensesnittet. Dette gjøres ved å bruke reloadRootControllersWithNames (_: sammenhenger :) klassemetode.
Den første parameteren for denne metoden er en rekke strenger som inneholder storyboard-identifikatorene til grensesnittkontrollene du vil laste. Ordren av identifikatorer i denne gruppen bestemmer rekkefølgen som sidene vises i.
Den andre parameteren er en valgfri AnyObject skriv array som inneholder sammenhenger for hver av sidene. Du lærer om sammenhenger senere i denne opplæringen. For nå vil du bare forlate denne parameteren som nil. Erstatt linjen du nettopp har lagt til i awakeWithContext (_ :) metode med følgende:
overstyre func awakeWithContext (kontekst: AnyObject?) super.awakeWithContext (kontekst) WKInterfaceController.reloadRootControllersWithNames (["Tredje side", "Første side"], kontekster: null)
Bygg og kjør appen din, og du vil se at etter at lastingen er fullført, viser appen din den tredje siden etterfulgt av den første siden.
I tillegg til sidebaserte grensesnitt kan du også implementere hierarkiske grensesnitt i en Apple Watch-app. Vi snakker om hierarkiske grensesnitt når overgangen mellom grensesnittkontrollere bruker en trykk overgang.
Oppførselen til et hierarkisk grensesnitt ligner det av UINavigationController klassen i en iOS-app. Denne typen Apple Watch-grensesnitt passer best for å presentere flere grensesnitt en etter en på en lineær måte.
revidere Interface.storyboard og dra Hovedinngangspunkt pil til TOvergang grensesnittkontrolleren som vist nedenfor. Dette gjør at den angitte grensesnittkontrolleren vises først når appen startes.
Deretter åpne TransitionInterfaceController.swift og legg til følgende linje i pushButtonPressed metode:
Accentsconagua
@IBAction func pushButtonPressed () self.pushControllerWithName ("Hierarchal Interface", kontekst: null)Ligner på reloadRootControllersWithNames (_: sammenhenger :) metode som du brukte tidligere, den første parameteren til pushControllerWithName (_: kontekst :) er storyboardidentifikatoren for grensesnittkontrolleren du vil presse. Den andre parameteren er konteksten for denne nye grensesnittkontrolleren.
Bygg og kjør appen din. Du bør se følgende grensesnitt når WatchKit-appen din er ferdig med å starte.
Tapping på hierarkisk knappen skal trykke neste grensesnitt på skjermen som vist nedenfor.
Du vil legge merke til at det nå er en liten pil i øverste venstre hjørne av skjermen. Ved å trykke på pilen kommer du tilbake til forrige grensesnitt. Det er også mulig å pope gjeldende grensesnittkontrolleren i kode. I HierarchalInterfaceController klasse, oppdater popButtonPressed metode som følger:
@IBAction func popButtonPressed () self.popController ()
Bygg og kjør appen din på nytt. Tapping på Pop knappen skal nå ha samme effekt som å trykke på bakpilen øverst til venstre.
Alternativt, hvis du vil gå tilbake til det aller første grensesnittet i hierarkiet, påkaller du popToRootController metode i stedet for popController metode. For din nåværende app, ville disse metodene begge gi det samme resultatet som det bare er to grensesnitt i hierarkiet for øyeblikket.
Modale grensesnitt fungerer på samme måte som hierarkiske grensesnitt. Den store forskjellen mellom de to er at de modale grensesnittene er utformet for å vise grensesnitt ovenpå hverandre, i stedet for å overføre mellom dem på en lineær måte.
Gå tilbake til TransitionInterfaceController.swift og legg til følgende linje med kode til modalButtonPressed metode:
@IBAction func modalButtonPressed () self.presentControllerWithName ("Modal Interface", kontekst: null)For å avvise det modale grensesnittet, oppdater dismissButtonPressed metode som følger i ModalInterfaceController:
@IBAction func dismissButtonPressed () self.dismissController ()
Bygg og kjør appen din. Trykk på modal knappen for å presentere et modalt grensesnitt.
En fordel ved modale grensesnitt er at du kan modalt presentere et sidebasert grensesnitt. Dette gjøres ved å bruke presentControllersWithNames (_: sammenhenger :) metode. Den første parameteren er en rekke storyboardidentifikatorer, og den andre parameteren er en rekke kontekstavobjekter. I TransitionInterfaceController.swift, oppdater implementeringen av modalButtonPressed metode som følger:
@IBAction func modalButtonPressed () self.presentControllerWithNames (["Modal Interface", "Hierarchal Interface"], kontekster: null)
Kjør appen din og trykk på modal knapp. Et sidebasert grensesnitt skal presenteres modelt med følgende to grensesnitt:
Som du har sett fra de ulike metodene som brukes i denne opplæringen så langt, når du overfører til et nytt grensesnitt, kan du passere i en kontekst for å konfigurere grensesnittet som skal presenteres. Konteksten du sender til ditt nye grensesnitt er valgfritt og kan være hvilken som helst datatype (AnyObject?).
Dette betyr at du kan overføre alle typer data mellom grensesnitt, fra enkle tall til komplekse datastrukturer. Konteksten er levert til det nye grensesnittet i awakeWithContext (_ :) metode. Fordelen ved å sende en kontekst til en grensesnittkontroller er å konfigurere innholdet dynamisk, det vil si ved kjøring.
Åpen TransitionInterfaceController.swift og oppdater implementeringen av modalButtonPressed metode som følger:
@IBAction func modalButtonPressed () self.presentControllerWithName ("Modal Interface", kontekst: "Custom Text")I ModalInterfaceController.swift, oppdater implementeringen av awakeWithContext (_ :) som følger:
overstyre func awakeWithContext (kontekst: AnyObject?) super.awakeWithContext (kontekst) hvis la tekst = kontekst som? String button.setTitle (text)
Vi bruker valgfri binding for å se om sammenhengen som er gitt kan kastes i en string. Hvis det er mulig, setter vi inn knapps tittel til den verdien.
Bygg og kjør appen din, og åpne det modale grensesnittet. Tittelen på knappen skal ha endret seg til Tilpasset tekst.
Hvis du er interessert i å ta WatchKit utdanningen til neste nivå, kan du se på hele kurset på WatchKit utvikling.
I denne opplæringen lærte du hvordan du konfigurerer og bruker de tre hovedgrensesnitttyper som er tilgjengelige for WatchKit-applikasjoner, sidebasert, hierarkisk og modal. Du lærte også hvordan du bruker grensesnittkontekster til å konfigurere grensesnittkontrollere ved kjøring. Nå vet du også når det er best å bruke hver av disse grensesnitttyper i WatchKit-applikasjonene dine. Du kan lese mer om grensesnittnavigering i Apples dokumentasjon.
