En introduksjon til tvOS Development

An Introduksjon til tvOS Development
33
Del
20
Del
Dette Cyber ​​mandag Envato Tuts + kurs vil bli redusert til bare $ 3. Ikke gå glipp av.

Innledning

På sitt årlige september hendelsen i 2015, i tillegg til nye iPhone- og iPad-modeller, annonserte Apple sin etterlengtede oppdatering til Apple TV set-top eske. Denne nye, fjerde generasjon Apple TV har en kraftig A8 prosessor, en Siri-aktivert fjernkontroll, en fornyet brukergrensesnitt og, viktigst av alt, en helt ny plattform for tredjeparts programmer og spill, som Apple har kalt tvOS.

I denne opplæringen, jeg kommer til å introdusere deg til tvOS utvikling ved å skape en grunnleggende tvOS søknad. Denne opplæringen forutsetter at du kjører Xcode 7.1 eller nyere, som inkluderer støtte for tvOS. Jeg er også forutsatt at du allerede er kjent med iOS utvikling.

1. Prosjektet Setup

Åpne opp Xcode og opprette et nytt prosjekt. Du vil umiddelbart legge merke til at listen over maler inkluderer en seksjon for tvOS applikasjoner. Fra de tilgjengelige malene, velger tvOS > Application > Enkel visning Application.

Klikk på Neste og konfigurere prosjektet som vist nedenfor. Jeg har valgt for Swift som prosjektets språk, men du kan også bruke Objective-C for å utvikle tvOS applikasjoner.

For å avslutte redigeringen av prosjektet, forteller Xcode hvor du ønsker å lagre prosjektet. Det første du vil legge merke til er at prosjektet er strukturert nesten identisk til en vanlig iOS søknad. I skjermbildet under, kan du se at vi har AppDelegate.swift, ViewController.swift, og Main.storyboard.

2. Bygging av Interface

Den første store forskjellen du vil merke når du arbeider med tvOS bygger brukergrensesnittet i programmet ditt. Når du åpner Main.storyboard, vil du se en stor, blank Apple TV-skjermen. Hvis du ikke kan se hele skjermen i editoren, og trykk deretter Command-- å zoome ut.

Denne skjermen er betydelig større på grunn av måten tvOS apps er skalert. I moderne iOS utvikling, er grensesnittet layout håndteres ved bruk av punkter i stedet for piksler for å gjøre utviklingen enklere på enheter med Retina-displayer.

For eksempel iPhone 6 og iPhone-6s har en skjermoppløsning på 1334x750 , men bare en skjermstørrelse, i poeng, fra 667x375. Dette betyr at alle apps på enheten kjøre på en 2x skala. Alle Apples iOS-enheter som har en Retina Display kjøre på en 2x skala, med unntak av iPhone 6 Plus og iPhone 6s Plus, som kjøres på en 3x skala.

Den nye Apple TV, men kjører apps på en standard 1920x1080 oppløsning på en 1x skala. Dette betyr at når du bygger tvOS apps, skjermstørrelsen, i poeng, som du må bruke når du bygger din grensesnittet er også 1920x1080.

Nå som du vet hvordan tvOS apps skaleres og vises på skjermen, vi kan begynne å bygge vår første grensesnitt. Fra objektbiblioteket på høyre, dra i en knapp til høyre på blank skjerm. Med knappen valgt, nederst på storyboardet redigereren klikker du på Pin-knappen og legge til følgende begrensninger.

Neste, dra i en tabellvisning til venstre for knappen og legge til følgende begrensninger. Pass også på at oppdateringen Rammer alternativet ned bunnen er satt til alle rammer i Container. Ta en titt på skjermbildet under for avklaring.

Velg tabellvisning, åpne Size Inspector, og angi Row Høyde eiendommen til 88, som vist nedenfor.

Neste, dra i en tabell Vis Cell fra objektbiblioteket og legge den til tabellvisningen. Med tabellvisningen celle valgt, åpner attributter Inspector og endre stil eiendom til teksting.

Til slutt trykker du på Kontroll på tastaturet og dra fra tabellen utsikt til visningen kontrolleren for å angi visningen kontrolleren som tabellen utsikts datakilde og delegat. Du kan også gjøre dette ved hjelp av tilkoblinger inspektør på høyre side.

Ved å bygge denne tvOS grensesnittet, vil du se at det er nesten identisk med å bygge en iOS-grensesnittet med den store forskjellen er betydelig større skala av elementer.

3. Forstå Focus

La oss nå fokusere på noen kode. Åpne ViewController.swift og erstatte gjennomføringen av ViewController klasse med følgende
klassen ViewController. UIViewController, UITableViewDataSource, UITableViewDelegate {overstyring func viewDidLoad () {super.viewDidLoad () //Gjør noe ekstra oppsett etter lasting utsikten, typisk fra en spiss. } Overstyring func didReceiveMemoryWarning () {super.didReceiveMemoryWarning () //Kast noen ressurser som kan gjenskapes. } Func Tableview (Tableview: UITableView, numberOfRowsInSection seksjon: Int) - > Int {return 3} func numberOfSectionsInTableView (Tableview: UITableView) - > Int {return 1} func Tableview (Tableview: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) - > UITableViewCell {la celle = UITableViewCell (stil: .Subtitle, reuseIdentifier: null)? Cell.textLabel .text = "Sak \\ (indexPath.row + 1)" cell.detailTextLabel .text = "Subtitle \\ (indexPath.row + 1? ) "return celle}}

Hvis du er kjent med iOS utvikling, deretter over gjennomføringen bør se veldig kjent. Du er nå klar til å kjøre din første tvOS søknad. Trykk på Kommando-R eller klikk på Kjør-knappen øverst til venstre. Sørg for at din test enheten er satt til Apple TV 1080p

Når Apple TV Simulator har startet opp, og søknaden er lansert, bør du se følgende skjermbilde.

Gratulerer! Du har nå din aller første tvOS app oppe og går. For å kontrollere app, må du bruke den nye Apple TV-fjernkontrollen. Å bringe opp fjernkontrollen i simulatoren, velger Hardware > Vis Apple TV Remote fra menyen eller trykk ⌘Command + Shift + R.

En liten ekstern vindu skal åpne opp ved siden av din simulator vinduet. Lek litt med fjern ved å holde nede Tilvalg-tasten på tastaturet og bevege musepekeren over fjernkontrollen. Du vil se at når du beveger musepekeren opp og ned, utvalget i endringene tabellen vise.

På samme måte når du dra fingeren mot høyre, blir knappen til høyre valgt.
< p> I tvOS utvikling, dette kalles å endre dagens fokus element. I motsetning til iOS apps der brukere kan trykke hvor som helst på skjermen til enhver tid, tvOS apps bruke et pek-og-klikk-stil for interaksjon.

Du trenger ikke å gjøre noe ekstra arbeid som utvikler for å har grensesnittet elementene dine være fokuserbar i en logisk rekkefølge. Fokuset motor bygget inn i UIKit rammeverket på tvOS ser på utformingen av grensesnittet og håndterer alt arbeidet i å flytte fokus fra ett element til et annet.

Det er imidlertid mange nye metoder og egenskaper gjort tilgjengelig for deg å programma kontrollere hvordan fokuset blir håndtert i din app. Mange av disse er definert av UIFocusEnvironment protokollen, som de UIViewController, UIView, UIWindow, og UIPresentationController klasser automatisk tilpasse seg. Det finnes også flere metoder som finnes i tvOS versjoner av UITableViewDelegate og UICollectionViewDelegate protokoller som kan brukes til å styre fokus i din app.

Som et eksempel, vi kommer til å gjøre knappen på høyre standard fokus element. Hvis du kjører app nå, vil du se at det første elementet i tabellen er først i fokus. Vi kommer også til å deaktivere det andre elementet i tabellen utsikten fra å være fokuserbar. Legg inn følgende kode til gjennomføringen av ViewController klasse:
styre Var preferredFocusedView: UIView? {Return self.view.subviews [0]} func Tableview (Tableview: UITableView, canFocusRowAtIndexPath indexPath: NSIndexPath) - > Bool {if indexPath.row == 1 {return false} return true}

Vi først overstyre preferredFocusedView eiendom og returnere den første subview, som i dag er den knappen til høyre. Den preferredFocusedView Eiendommen er skrivebeskyttet og kan bare stilles ved å overstyre gjennomføringen som vi har gjort. Når visningen kontrolleren er lastet, vil fokuset motoren finner visningen returnert av denne eiendommen og setter den automatisk i fokus

Vi har også implementert Tableview (_:. CanFocusRowAtIndexPath :) metode og returnere false når indexPath .row er lik 1. Ellers vi returnere true. Som du forventer, bestemmer dette delegat metode hvorvidt en bestemt rad kan være i fokus.

Når du bygge og drive din app igjen, vil du se at knappen på høyre mottar automatisk fokusere på lansering. Hvis knappen på høyre ikke automatisk få fokus, så din app syn hierarki kan være litt annerledes, det er, er ikke lik den knappen til høyre i første subview av utsikten kontrollerens syn.

Du vil også legge merke til at når du prøver å navigere radene i tabellvisningen, er den midterste raden hoppet som diktert av gjennomføringen av Tableview (_: canFocusRowAtIndexPath :) metode

4.. tvOS App Komponenter og begrensninger

Selv om vi ikke vil lage noen bilder i denne opplæringen, er det viktig at du forstår de ulike komponentene som kreves for tvOS apps, samt noen av begrensningene. Anmeldelser
appikoner

Hver tvOS app må gi to app ikoner:

Stor: 1280px x 768px

Små: 400px x 240px

Den største forskjellen med iOS er at tvOS appikoner kan bestå av opptil tre lag. Dette er slik at en parallax effekt kan oppnås på hjem-skjermen og noe annet din app ikonet vises. Hvis du vil se denne effekten for deg selv, kan du gå til Apple TV-Simulator, trykker du på Hjem-knappen på fjernkontrollen (den lille TV-ikonet). Fokus Innstillinger app ikonet og hold nede Tilvalg-tasten mens du flytter musepekeren rundt litt på fjernkontrollen. Du vil se at app ikonet reagerer på bevegelse og de forskjellige lag av ikonet produsere en fin effekt.

Launch Bilde

Akkurat som en vanlig iOS program, må du gi et statisk bilde skal vises når programmet ditt har blitt åpnet og laster. Den største forskjellen er at du bare trenger å gi et enkelt 1920px x 1080px bilde.

øverste hylle Images

Hvis programmet ditt har blitt plassert i øverste hylle av en bruker, når fokusert, du kan vise innhold rett på startskjermen for Apple TV. Det er tre hovedtyper av innhold du kan vise:

Statisk Bilde: Dette er bare en 1920px x 720px bilde som du oppgir i din søknad bunt

dynamisk innhold utforminger. Dette er der du vise en serie bilder i et grensesnitt som ligner på en samling visning. Disse bildene kan velges med programmet ditt når som helst og trenger ikke å bli inkludert i søknaden bunt. De tre bildestørrelser du kan bruke er 404px x 608px, 608px x 608px og 908px x 512px. Kan brukes en kombinasjon av disse tre størrelser

Scrolling Banner:. Det er her du gi et sett med bredt sideforhold bildene skal vises ved siden av hverandre med en tar opp mesteparten av skjermen. Denne innholdstypen ligner på hjemmesiden til iOS App Store. Disse bildene må være 1940px x 624px i størrelse.

Begrensninger

Til tross for den nye Apple TV pakking mer lagringsplass enn de fleste iPhone-enheter med en minimumskapasitet på 32 GB, er det er noen viktige begrensninger for tvOS applikasjoner. For det første kan apps ikke være mer enn 200MB i størrelse. Alt innhold du trenger utenom dette 200MB buffer må lastes ned ved hjelp av On-Demand Resources API introdusert med iOS 9 og nå tvOS.

En annen ting du må også være klar over er at tvOS apps har ingen vedvarende lokal lagring. Dette betyr at alle data som du trenger for å beholde mellom app lanseringer, slik som spillet sparer, bilder og videoer, må lagres i iCloud og hentes ved behov.

Konklusjon

Mens vi har ikke skrevet mye kode i denne opplæringen, jeg håper at det fungerte som en god introduksjon til tvOS plattformen. Du vet nå de viktigste likheter og forskjeller mellom å utvikle apps for iOS og tvOS samt begrensningene på utviklere.

I fremtidige tutorials, vi vil være dykking dypere inn tvOS og oppdage hva som er mulig med tvOS og nye Apple TV.

Som alltid, legge inn kommentarer og tilbakemeldinger i kommentarfeltet nedenfor.



Previous:
Next Page: