更新しました。 iPhone の解像度に関する新しい究極のガイドをお読みください!
数日前、Apple は iPhone 6 Plus を発表しました。 この新しい iPhone は、スクリーン上でのグラフィックのレンダリング方法を大幅に変更しました。 我々はこれを解明するためにインフォグラフィックを作りました。
320 × 480 375 × 667 414 × 736 320 × 480 750 × 1334 1242 × 2208 1080 × 1920 3.5″ 4.7″ 5.5″ iPhone 6 Plusは前のステップでレンダリングした画像よりも低いピクセル解像度で画面を持っています.画像が画面に表示できる前に、それは低いピクセル分解能にダウンサンプル(再サイズ)されなければなりません. 物理的なピクセル はじめに、すべてのドローイングの座標は次のように指定されます。 ポイントは抽象的な単位で、この数学的座標空間でのみ意味を持ちます。初代iPhoneでは、ポイントは画面上の実際のピクセルに完全に対応していましたが、これはもはや真実ではありません。 初代iPhoneでは、ポイントは画面上の実際のピクセルに完全に対応していましたが、現在はそうではありません。ポイントベースの描画は、ピクセルにレンダリングされます。 点座標にスケールファクターを掛けてピクセル座標とする。 一般的な倍率は1倍、2倍、3倍で、倍率が高いほど精細度が高くなる。 レンダリングピクセル 最後のステップは、計算されたピクセルを物理的なスクリーン上に表示することです。すべてのスクリーンはピクセルパーインチ(PPI)特性を持っています。 この数値は、1インチに収まる画素数、つまり現実世界での画素の大きさを示しています。 物理デバイス 1×ダウンサンプリングでレンダリング / 1.15 デバイスで表示 デバイスで表示 (ピクセル) (ピクセル) (ポイント) (デバイスピクセル) (ポイント) 元のiPhone iPhone 6 iPhone 6 Plus 3.5″ 4.7″ 5.5″ 163 PPI 326 PPI 401 PPI ポイント 3×レンダリング 2×で表示 iPhone 6 Plusはレンダーイメージを画面に表示する前にダウンサンプリングしています。 物理ピクセル コンテンツは、点座標を使って数学的に定義されます。 ポイント コンテンツは、スケールファクターを使用してピクセルにレンダリングされます。 この処理をラスタライズと呼ぶ。 レンダリングされたピクセル ラスター化された描画は物理デバイスに表示される。 物理デバイス レンダー 2× ダウンサンプリング / 1.15 show on device show on device show on device Original iPhone iPhone 6 iPhone 6 Plus 3.5″ 4.7″ 5.5″ render 3× render 1× a a
Line rendering
To demonstrate different rendering of pixels on various devices, how 1-point wide line is render on
- オリジナル iPhone – without retina displayを比較してみましょう。 スケーリングファクターは 1.
- iPhone 5 – Retinaディスプレイ搭載、スケーリングファクターは 2.
- iPhone 6 Plus – Retinaディスプレイ HD搭載です。 スケーリングファクターは3で、画像はその後、レンダリングされた2208×1242ピクセルから1920×1080ピクセルにダウンスケールされます。
ダウンスケール比率は、1920 / 2208 = 1080 / 1242 = 20 / 23です。 つまり、元のレンダリングから 23 ピクセルごとに、20 個の物理ピクセルにマッピングする必要があります。 言い換えると、画像は元のサイズの約 87% に縮小されます。
23 ピクセル 20 ピクセル 元の iPhone 3.5″ iPhone 5 4″ iPhone 6 Plus 5.5″ HypotheticalPerfect 3×Display ?