web-dev-qa-db-ja.com

@ 1x、@ 2x、@ 3xのiOSイメージが必要なのはなぜですか？

なぜこれら3つの特定の画像タイプが必要なのですか？

アプリに50ピクセルx 50ピクセルの背景画像などのボタンがある場合、この画像の3つのバージョンが必要なのはなぜですか？たとえば、700x700のように解像度がはるかに高い1つの画像を作成するのを妨げているのは、iPhoneで縮小してもデバイスが必要とする最大解像度に収まらないからです。

私が考えることができる唯一のことは、それがちょうどより多くのスペースを占有することですが、シンプルなアプリ/シンプルなボタンの場合、それは問題を引き起こさないようです。いくつかのデバイスで試してみましたが、シミュレートしてこの方法を実行しても違いは見られません。しかし、私がアプリやものにもっと飛び込むにつれて、私はこのテクニックの背後にある物質があると確信しています。

iosimageresolutionpixels
70
CodeMark22

正確なサイズがない場合は、次の2つのことが起こります。

アップスケーリング

@3xまたは@2xは@1xからアップスケールできますが、通常、視覚的な結果はぼやけており、太い線で見栄えがよくありません。サブピクセルを使用する必要があるため、@3xから@2xをアップスケーリングするとさらに悪化する可能性があります。

ダウンスケーリング

一般に、結果はアップスケーリングよりもはるかに優れていますが、すべての画像に適用されるわけではありません。 1px画像に@3x境界線がある場合、それを@1xにダウンスケールした後、境界線は表示されません（0.33px）。画像内の小さなオブジェクトにも同じことが当てはまります。ダウンスケーリングはすべての詳細を破壊します。

一般的に-画像が完璧に見えるようにするには、ダウンスケーリングとアップスケーリングの両方を避けたいです。常に@2xまたは@3xの画像のみを使用して、視覚的な問題が発生した場合にのみ他のスケールを追加できます。より高い解像度を使用しても、ダウンスケーリングは改善されません。高解像度は、アップスケーリングを回避するためにのみ使用されます。大規模（例：@100x）から@1xへのダウンスケーリングは、@3xからのダウンスケーリングよりも良い結果を生み出しません。

58
Sulthan

スケーリングまたはピクセルに関して、3種類のAppleデバイス（iPhoneおよびiPad）があるため、画像アセットには3種類の画像が必要です。

1 pixel = 1 point @ 1xを指す通常のデバイス（古いiPhoneおよびiPadデバイス）

4 pixels(2 x 2) = 1 point @ 2x（iPhone 4+）に相当するRetinaデバイス

9 pixels (3 x 3) = 1 point @ 3x（iPhone6 +）と呼ばれるRetina iPhone6およびiPad

したがって、3つのスケールで同じ画像を提供するために、iOSはどの画像をどのデバイスに表示するかを決定します。

編集

enter image description here

61
Saheb Roy

高解像度のグラフィックを1つ提供すると、ユーザーのデバイスのスペースが無駄になるためです。アプリのスライスのおかげで、デバイスは実際にデバイスに適合する部分のみを（App Storeから）ダウンロードします（そのため、Retinaデバイスは非Retinaグラフィックをダウンロードしません）。これが、Appleが資産カタログとこの種の規則を作成した理由です。セッションでそれを説明します。

要するに、メモリとディスクの使用量を減らすことで、パフォーマンスとユーザーエクスペリエンスが向上します

7
Julian Król

まず、ポイントとピクセルの動作を知る必要があります。非網膜デバイスでは、ポイントとピクセルの比率は1point = 1pixelです。 Retinaデバイスでは、2つの比率があります：1point = 2x2画面サイズに応じたピクセル、および1point = 3xピクセル。ピクセル密度のため、非網膜で4倍になります。
だからこそ、最高の解像度で表示するには、この3種類の画像が必要です。

5
Stefan

スルタンが言ったことを補完する：

特定のデバイスに適切な画像を提供しなかったため、ダウンスケールまたはアップスケールする必要があります。これらのプロセスwillはメモリと処理を使い果たします。その結果、一度にいくつの画像を処理するか、および画像のサイズに応じて、パフォーマンスが低下する可能性があります。

3
NSPunk

大きな画像を1つだけ提供すると、いくつかの問題が発生します。

  1. ダウンスケーリングは品質の損失につながります（たとえそれが巨大でなくても）
  2. 既に事前にレンダリングされた画像を表示するよりも、画像を縮小するためにより多くの計算能力が必要です
  3. バイナリのサイズが大きくなり、iOS 9で導入されたアプリの間引きの恩恵を受けることができません。

ご覧のとおり、1つの画像のみを作成すると、アプリのパフォーマンスと品質に影響し、古いデバイスを使用している場合に不均衡にヒットします。それの訳は：

  1. 彼らはさらにダウンスケールする必要があります。また、デバイスのパフォーマンスは新しいデバイスのパフォーマンスほど良くないため、アプリの遅延に気付く可能性がはるかに高くなります。
  2. 彼らはそれほど多くのストレージスペースを持っていないので、あなたは本当にあなたがそれらを助けるためにアプリの間引きを使用できるようにしたいです
  3. 品質の低下は彼らにとって最も高く、デバイスの解像度が低いという事実を考慮すると、彼らはそれに気づくでしょう。

このため、ユーザーは不幸になる可能性が高く、これはあなたにとって悪いことです。私の経験から、不幸なユーザーは幸せなユーザーよりもアプリを評価する可能性が10倍高いからです。あなたはそれを望んでいませんか？ :)

2
Andriy Gordiychuk