1. ホーム
  2. ios

[解決済み] なぜ@1x、@2x、@3xのiOS画像が必要なのですか?

2023-07-18 10:51:49

質問

なぜこれら3つの画像タイプが必要なのでしょうか?

たとえば、50 ピクセル x 50 ピクセルの背景画像を持つボタンがアプリにある場合、なぜこの画像の 3 つのバージョンが必要なのでしょうか。 たとえば、700x700 のような高解像度の画像を 1 つ作成するだけで、iPhone で縮小したときに、デバイスが求める最大解像度を下回らないようにできるのに、なぜそれをしないのでしょうか?

考えられるのは、より多くのスペースを取るということだけですが、単純なアプリ/単純なボタンの場合は、何の問題も発生しないように思われます。 いくつかのデバイスで試してみましたが、シミュレートしてこの方法を実行しても、デバイス間の差は見られません。 しかし、アプリやその他のものにもっと潜ると、このテクニックの背後にある実体があることを確信しています。

どのように解決するのですか?

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

アップスケール

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

ダウンスケーリング

一般に、アップスケーリングよりもはるかに良い結果が得られますが、すべての画像に適用されるわけではありません。もしあなたが 1px のボーダーが @3x にダウンスケールした後 @1x に縮小すると、境界線が見えなくなります(0.33px)。画像内の小さなオブジェクトについても同じことが言えます。ダウンスケールすると、すべての詳細が破壊されます。

一般的に - 画像を完璧に見せるには、ダウンスケーリングとアップスケーリングの両方を避けたいものです。常に @2x または @3x の画像を使用し、視覚的に問題がある場合のみ他のスケールを追加してください。高い解像度を使用しても、ダウンスケーリングは改善されません。高解像度はアップスケーリングを避けるためにのみ使用されます。高スケールからのダウンスケーリング(例えば @100x ) から @1x からダウンスケールするよりも良い結果は得られないでしょう。 @3x .