Share
Denne opplæringen vil gjennomgå trinnene som er nødvendige for å sikre at iOS-appene dine fortsetter å se bra ut når de vises på den nye iPhone 5-skjermen.
For å kunne lage apper som er kompatible med iOS 6 og iPhone 5, må du sørge for at du har Xcode 4.5 (eller nyere) og iOS 6 SDK installert på utviklingsmaskinen din. Med Xcode åpen, velg Xcode> Om Xcode fra menylinjen for å sjekke den installerte versjonen som er installert.
For å få de nyeste verktøyene, må du gå til Apple Developer Center etter å ha registrert deg som en Apple-utvikler.
Jeg vil anbefale å ta det ekstra trinnet med å installere både iOS 5.1- og iOS 5.0-simulatorene og "kommandolinjeverktøyene" etter at du har installert den nyeste versjonen av Xcode. For å gjøre dette, velg Xcode> Innstillinger og deretter gå til Nedlastinger fane. Installer tilleggsalternativene som er oppført. Når du har gjort det, bør vinduet se slik ut:
Du må ta med et bilde som heter [email protected] i prosjektet ditt for å få full nytte av iPhone 5-skjermen. Det kan virke vilkårlig, men eksistensen av denne filen er hva som vil avgjøre om søknaden din kjører i brevboksmodus (dvs. med svarte bånd over og under innholdet) eller i fullskjermmodus.
Selvfølgelig, den [email protected] filen har også en annen hensikt: det vil være standardbildet som vises når søknaden din laster på en iPhone 5. Dette tjener samme funksjon som Default.png fil for iPhone / iPod touch-enheter og ikke-netthinnen [email protected] fil for iPhone 4 / 4S.
Når du kjører et prosjekt i Xcode 4.5 uten [email protected] fil, kan du få en automatisk popup som denne:
Hvis ja, gå videre og klikk på "Legg til" for å få Xcode til å lage en solid svart lansering for deg, bare husk å endre det senere til noe mer passende for søknaden din.
Hvis du ikke ser Xcode-popup-vinduet, kan du lagre dette bildet på datamaskinen og deretter dra det inn i Xcode-prosjektnavigeringsområdet for å legge det til i prosjektet. Et vanlig svart lanseringsbilde er ikke ideelt, men det vil tilfredsstille kravet og plassere appen din i fullskjermmodus.
Bygg og kjør prosjektet på en iPhone 5. Ideelt sett bør du være god til å gå uten ytterligere justeringer! Det er imidlertid en rekke grunner til at appen din kanskje ikke ser rett ved den nye oppløsningen. Den andre halvdelen av denne opplæringen vil dekke feilsøkingsprogrammer som ikke vises riktig etter at du har fulgt dette trinnet.
IOS-utviklere har blitt litt bortskjemt i forhold til deres Android jevnaldrende når det gjelder å se layout programmering. Til å begynne med hadde alle de første iPhone- og iPod touch-skjermene samme skjermoppløsning: 320x480 piksler. Når netthinnen som ble brukt av iPhone 4 og 4S ble introdusert i 2010, ble skjermoppløsningen doblet til 640x960 piksler, men utviklere var fortsatt kunne referere til skjermstørrelsen i kode som 320x480. Hvorfor? Fordi med iOS 4 Apple introduserte begrepet "logiske poeng" i UIKit. Disse punktene kan kartlegge til fysiske piksler dynamisk via contentScaleFactor eiendom av UIView klasse. De contentScaleFactor ble deretter satt til å logisk speile oppløsningsendringen ved å standardisere til 1.0 på iPhone 3G / 3GS og 2.0 på 4 / 4S.
For å sitere fra Apples tegning og utskrift guide for iOS:
Systemet karter automatisk poeng i synspunktets koordinatrom til piksler i enhetens koordinatrom, men denne kartleggingen er ikke alltid en-til-en. Denne oppførselen fører til et viktig faktum at du alltid bør huske:
Ett punkt samsvarer ikke nødvendigvis med en fysisk piksel.
Hensikten med å bruke poeng (og det logiske koordinatsystemet) er å gi en konsistent størrelse på utdata som er enhet uavhengig. For de fleste formål er den faktiske størrelsen på et punkt irrelevant. Målet med poeng er å gi en relativt konsistent skala som du kan bruke i koden din for å angi størrelsen og plasseringen av visninger og gjengitt innhold. Hvordan poeng er faktisk kartlagt til piksler er en detalj som håndteres av systemrammer. For eksempel, på en enhet med en høyoppløselig skjerm, kan en linje som er en punkt bred, faktisk resultere i en linje som er to fysiske piksler brede. Resultatet er at hvis du tegner det samme innholdet på to lignende enheter, med bare en av dem som har en høyoppløselig skjerm, ser innholdet ut til å være omtrent samme størrelse på begge enhetene.
Så som iOS-utviklere har vi hatt det ganske enkelt takket være denne innovasjonen. Men med introduksjonen av 640x1136px oppløsningen til iPhone 5, vil en vertikal størrelse på 480 poeng ikke lenger fylle all tilgjengelig vertikal plass.
For å se dette i handling, anta at en programmør prøver å legge til en tilpasset bakgrunnsvisning programmatisk til roten vise kontrolleren av deres søknad. Foreløpig at programmereren skrev denne koden for å gjøre det:
UIView * customBackgroundView = [[UIView alloc] initWithFrame: CGRectMake (0.0f, 0.0f, 320.0f, 480.0f)]; customBackgroundView.backgroundColor = [UIColor redColor]; customBackgroundView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth; [self.view addSubview: customBackgroundView];
Før iPhone 5, ville den ovennevnte kodeblokken ha virket helt fint. De 320x480 logiske punktene vil kartlegge til 640x960 med standard 2,0-skalaen på iPhone 4 / 4S. Men på iPhone 5 vil høyden fortsatt bli kartlagt til 960 piksler og vil komme opp kort:
Å løse dette problemet er ganske enkelt:
UIView * customBackgroundView = [[UIView alloc] initWithFrame: CGRectMake (0.0f, 0.0f, self.view.frame.size.width, self.view.frame.size.height)]; customBackgroundView.backgroundColor = [UIColor redColor]; customBackgroundView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth; [self.view addSubview: customBackgroundView];
I dette scenariet måtte vi bare trekke størrelsen på dagens rotvisning dynamisk for å plassere den nye, tilpassede bakgrunnsvisningen over hele området.
For et annet eksempel, la oss anta at programmøren ønsket å lage en ny visning programmatisk i loadView: metode:
- (ugyldig) loadView CGRect applicationFrame = [[UIScreen mainScreen] applicationFrame]; UIView * customView = [[UIView alloc] initWithFrame: applicationFrame]; customView.backgroundColor = [UIColor redColor]; customView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth; self.view = customView;
De applicationFrame tilhører UIScreen vil returnere ramme rektangelgrenser brukt for vinduet i gjeldende applikasjon, minus området okkupert av statuslinjen (hvis synlig). Du kan alternativt få bare det grense rektangel på skjermen med [[UIScreen mainScreen] grenser]. Begge verdiene vil bli returnert i logiske punkter, ikke piksler.
Selv om de ovennevnte kodeeksempler er nyttige, er de også noe begrenset. I praksis kan det hende du må håndtere mer komplekse scenarier som involverer dynamisk størrelser på mange undervisninger, avhengig av enhetens skjermhøyde.
Heldigvis er det minst tre forskjellige tilnærminger du kan bruke til å gjøre det.
De UIView eiendom autoresizingMask er en enkel, men likevel effektiv måte å sikre at undervisningsobjekter justeres dynamisk i forhold til overvåking. I den ovennevnte kodebiten brukte jeg dette for å sikre at både bredden og høyden til det egendefinerte bakgrunnsbildeobjektet skal skaleres på riktig måte med orienteringsendringer:
customBackgroundView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
Legg merke til at autoresizingMask Egenskapen kan styres visuelt fra Xcode / Interface Builder også.
De fleste applikasjoner som bruker UIKit-kontroller og standardbeholdere, skal kunne fungere fint på iPhone 5 ved å kombinere variable verdier for rammeopprettelse (som vist tidligere) og sette inn intelligente autoresaliseringsegenskaper på undervisninger.
Se den offisielle Apple-dokumentasjonen og visningsprogrammeringsguiden for mer informasjon.
Det nye Auto Layout-systemet som ble introdusert med iOS 6, gir en avansert metode for å kontrollere visningsplassering. Auto Layout bruker et system med begrensninger for å forklare og håndheve vise relasjoner. Den eneste ulempen med å bruke Auto Layout er at den ikke er kompatibel med iOS 5 og tidligere.
Ytterligere dekning av Auto Layout er utenfor omfanget av denne opplæringen. De som vil lære mer, bør konsultere Apples Cocoa Auto Layout Guide og WWDC 2012 Introduksjon til Auto Layout-økten.
En annen tilnærming blir vedtatt av noen, er å forsøke å sjekke om den nåværende enheten er en iPhone 5 på kjøretid. Den mest avanserte versjonen av dette jeg har funnet er fra dette svaret på StackOverflow.
Følgende er en litt endret versjon av makroene som er opprettet i StackOverflow-innlegget:
#define IS_IPHONE ([[[UIDevice currentDevice] -modell] isEqualToString: @ "iPhone"]) #define IS_IPOD ([[[UIDevice currentDevice] modell] isEqualToString: @ "iPod touch"]) #definer IS_HEIGHT_GTE_568 [[UIScreen mainScreen] ] .size.height> = 568.0f #define IS_IPHONE_5 (IS_IPHONE && IS_HEIGHT_GTE_568)
Den første og andre makroen kontrollerer om den nåværende enheten er en iPhone eller iPod touch ved å bruke UIDevice klasse.
Den tredje makrokontrollen kontrollerer om skjermhøyden er større enn eller lik flytpunktsverdien 568. Husk fra oven over at [[UIScreen mainScreen] grenser] meldingen vil returnere programvinduets begrensingsboks i logiske punkter, og at 568 logiske poeng vil kartlegge til 1136 piksler med standardvisningen contentScaleFactor av 1,0.
Til slutt kombinerer den fjerde makro to av de tidligere makroene til en IS_IPHONE_5 makro som (for øyeblikket) bare skal returnere TRUE hvis koden kjører på en iPhone 5. Du kan bruke den endelige versjonen i din egen kode som dette:
hvis (IS_IPHONE_5) NSLog (@ "Hei, dette er en iPhone 5! Vel, kanskje ... hvilket år er det?"); else NSLog (@ "Bummer, dette er ikke en iPhone 5 ...");
Selv om den ovenfor angitte tilnærmingen er potensielt nyttig, er den også feilaktig. For eksempel, hva skjer hvis iPhone 6 er utgitt med helt nye dimensjoner? Jeg vil råde over å bruke denne tilnærmingen hvis det er mulig. I stedet hold deg til Autoresizing Masks eller Auto Layout hvis du kan gjøre en av disse tilnærmingene arbeid.
Denne opplæringen har forklart de forskjellige metodene som er tilgjengelige for å ta imot det utvidede iPhone 5-skjermbildet. Hvis du har slitt med å justere til den nye skjermstørrelsen, har du forhåpentligvis funnet innholdet nyttig!
Du er velkommen til å legge igjen noen tilbakemelding du har i kommentarfeltet nedenfor. Du kan også koble til meg på Twitter, Google Plus eller LinkedIN. Jubel!
Accentsconagua