iPhone 6-skærme afmystificeret

Opdatering: Læs vores nye ultimative guide til iPhone-opløsninger!

For få dage siden introducerede Apple iPhone 6 Plus. Den nye iPhone ændrer i væsentlig grad den måde, hvorpå grafik gengives på skærmen. Vi har lavet en infografik for at afmystificere dette.

320 × 480 375 × 667 414 × 736 320 × 480 750 × 1334 1242 × 2208 1080 × 1920 3,5″ 4,7″ 5,5″ iPhone 6 Plus har en skærm med lavere pixelopløsning end det billede, der blev gengivet i det foregående trin. Før billedet kan vises på skærmen, skal det nedjusteres (resized) til en lavere pixelopløsning. Fysiske pixels I begyndelsen er koordinaterne for alle tegninger angivet i Punkter er abstrakte enheder, de giver kun mening i dette matematiske koordinatrum. i den oprindelige iPhone svarede punkterne perfekt til de faktiske pixels på skærmen, men det er ikke længere tilfældet. Punkter Punktbaserede tegninger gengives til pixels. Denne proces er kendt som rasterisering.Punktkoordinater ganges med en skalafaktor for at få pixelkoordinater. Højere skalafaktorer resulterer i et højere detaljeringsniveau. typiske skalafaktorer er 1×, 2× og 3×. Renderede pixels Det sidste trin er at vise de beregnede pixels på den fysiske skærm.Alle skærme har en PPI-karakteristik (pixels pr. tomme). Dette tal fortæller dig, hvor mange pixels der passer ind i en tomme, og dermed hvor store pixels der vises i den virkelige verden. Fysisk enhed render ved 1× downsampling / 1,15 vis på enhed vis på enhed vis på enhed vis på enhed vis på enhed (pixel) (pixel) (pixel) (pixel) (point) (enhedspixel) (point) (point) (point) Original iPhone iPhone iPhone 6 iPhone 6 Plus 3,5″ 4,7″ 5,5″ 163 PPI 326 PPI 401 PPI point. render ved 3× render ved 2× en iPhone 6 Plus downsampler det renderede billede, før det vises på skærmen. Fysiske pixler Indholdet er defineret matematisk ved hjælp af punktkoordinater. Punkter Indholdet renderes til pixels ved hjælp af en skaleringsfaktor. Denne proces kaldes rasterisering. Renderede pixels Rasteriserede tegninger vises på de fysiske enheder. Fysisk enhed render 2× downsampling / 1,15 vis på enhed vis på enhed vis på enhed vis på enhed vis på enhed Original iPhone iPhone iPhone 6 iPhone 6 iPhone 6 Plus 3,5″ 4,7″ 5,5″ render 3× render 1× a a a

Line rendering

For at demonstrere forskellig rendering af pixels på forskellige enheder sammenligner vi, hvordan en 1-punkts bred linje renderes på

  • Original iPhone – uden retina-skærm. Skaleringsfaktoren er 1.
  • iPhone 5 – med Retina-skærm, skaleringsfaktoren er 2.
  • iPhone 6 Plus – med Retina-skærm HD. Skaleringsfaktoren er 3, og billedet nedskaleres efterfølgende fra gengivne 2208 × 1242 pixel til 1920 × 1080 pixel.

Det nedskaleringsforhold er 1920 / 2208 = 1080 / 1242 = 20 / 23. Det betyder, at hver 23 pixel fra den oprindelige rendering skal afbildes til 20 fysiske pixels. Med andre ord er billedet nedskaleret til ca. 87 % af dets oprindelige størrelse.

23 pixels 20 pixels Original iPhone 3,5″ iPhone 5 4″ iPhone 6 Plus 5,5″ HypotetiskPerfekt 3× Display ?????

Introduktion af PaintCode 3. Den næste generation af vores værktøj til at skabe opløsningsuafhængige tegninger.

Skriv et svar

Din e-mailadresse vil ikke blive publiceret.