利用可能なすべてのiPhone解像度で画像スケールを処理するにはどうすればよいですか？

画像に使用するのに最適なサイズ：background.png、background @ 2x.png、background @ 3x.pngこの画像を使用して、たとえば、すべての解像度で画面の全幅と高さ全体をカバーする場合iPhoneポートレートアプリ？

これは私たちが今持っているものです：

Device          Points    Pixels     Scale  Physical Pixels   PPI   Ratio   Size
iPhone XS Max   896x414   2688x1242  3x     2688x1242         458   19.5:9  6.5"
iPhone XR       896x414   1792x828   2x     1792x828          326   19.5:9  6.1"
iPhone X        812x375   2436x1125  3x     2436x1125         458   19.5:9  5.8"
iPhone 6 Plus   736x414   2208x1242  3x     1920x1080         401   16:9    5.5"
iPhone 6        667x375   1334x750   2x     1334x750          326   16:9    4.7"
iPhone 5        568x320   1136x640   2x     1136x640          326   16:9    4.0"
iPhone 4        480x320   960x640    2x     960x640           326   3:2     3.5"
iPhone 3GS      480x320   480x320    1x     480x320           163   3:2     3.5"

一部の人々は、iPhone 6 Plusの端から端までの画像（画面の左から右端の下部にあるバナーのような）では、幅1242のback@3x.pngと、iPhone 6のback@2x.pngを用意すると言います幅750はiPhone 6の画面サイズに一致しますが、1242/3 = 414および750/2 = 375なので、@ 2xおよび@ 3xと名付けても意味がないため、これは良い考えではないと思います。そして、どの幅にback.png-375または414が必要ですか？

グラフィック名は@ 2xと@ 3xのサフィックスを使用しているため、たとえばimage@3x.pngの解像度が30x30の場合、論理的に考えてimage@2x.pngは20x20の解像度であり、image.pngは10x10である必要があります。つまり、各画面にシャープな全幅の画像が必要な場合は、幅414 3 = 1242pxのback@3x.png、幅414 2 = 828pxのback@2x.png、幅414pxのback.pngを作成する必要があります。。ただし、これは、iPhone 6 Plusを除くすべてのiPhoneで、たとえばアスペクトフィットコンテンツモードなどを使用するようにuiimagesをセットアップする必要があり、これらが呼び出されるため、これは適切なソリューションではなく、おそらくアプリケーションが本当に遅くなることを意味します古いデバイスでは多くのスキャリングを使用します。

では、この問題を解決するための最良の解決策は何だと思いますか？

使用しない場合、各画像をすべての縮尺で持つ必要はありません。必要なサイズだけを作り、幅に合わせて名前を付けます。フルデバイス幅の縦長の画像の場合、1xおよび2xで幅320px、2xで幅375px、3x幅414pxが必要です。

4 "デバイスは、起動イメージに名前を付けるために" -568h "サフィックスを使用したので、同様の名前付けスキームをお勧めします。

• ImageName-320w（@ 1x＆@ 2x）
• ImageName-375w（@ 2x）
• ImageName-414w（@ 3x）

次に、実行時に必要なイメージを見つけます。

NSNumber *screenWidth = @([UIScreen mainScreen].bounds.size.width);
NSString *imageName = [NSString stringWithFormat:@"name-%@w", screenWidth];
UIImage *image = [UIImage imageNamed:imageName];

これは他の幅が将来追加されると壊れる可能性がありますが、これまでのところAppleは常に新しいディスプレイをサポートするためにアプリを再構築する必要があるので、私は彼らがそれを続けると仮定するのは少し安全だと思います。

私は個人的にやります：

ImageName @ 2x iPhone 4 / 4s
ImageName-568h @ 2x iPhone 5 / 5s
ImageName-667h @ 2x iPhone 6
ImageName-736h @ 3x iPhone 6Plus

これの背後にある論理は、すべてのデバイス間の違いを示すのに対し、幅はiPhone 5sとiPhone 4sで同じ値を共有することです。

編集：

これは、デバイス全体に依存するリソースに使用している命名規則にすぎません。たとえば、背景画像が画面全体を占めている場合など、たいていの場合は次のとおりです。

ImageName @ 2x iPhone 4 / 4s / 5 / 5s / 6
ImageName @ 3x iPhone 6Plus /ズームモード

@ 2xと@ 3xのディスカッションでは、実際にそれを気にする必要はありません。画面のポイントサイズに注意し、ポイントサイズが2倍の@ 2xアセットと3倍のポイントサイズがピクセルの@ 3xアセットがあることを確認してください。デバイスは自動的に適切なものを選択します。しかし、あなたの投稿を読んで私はあなたがすでにこれを知っていると思います。

端から端までの画像の場合、残念ながら、すべての画面解像度で作成する必要があります。したがって、縦長のiPhoneの場合、320ポイント、375ポイント、414ポイントとなり、414ポイントは@ 3xになります。より良い解決策は、インターフェイスビルダーでスライスを設定することにより、画像をスケーラブルにすることです（画像カタログを使用する場合）。ただし、画像に応じて、画像に繰り返し可能な部分と伸縮可能な部分があるかどうかによって、これがオプションになる場合とそうでない場合があります。このように設定されたスケーラブルなイメージは、パフォーマンスへの影響がほとんどありません。

@ 2と@ 3は実際の画像のスケーリングではありませんが、画面上の1つの仮想ピクセルを表す実際のピクセルの量のみを表します。一部のデバイス画面に使用する画像をシステムに表示するだけです。

したがって、画面全体の画像を使用する必要がある場合は、実際の画面サイズに応じて準備してください。

場合によってはグラフィックに応じて、たとえば、幅414ポイントx高さ100ポイント（可能な最大の幅といくつかの固定された高さ）のサイズのバナーなどの単一の画像のみを使用し、ピン留めされているUIImageViewに配置すると、うまく機能する場合があります画面の左端と右端、高さが100に固定され、そのUIImageViewのアスペクトフィルモードを設定します。次に、小さいデバイスでは、画像の左側と右側がカットされ、画像の中央部分のみが表示されます。

このためのカテゴリを作成しました：

+ (UIImage *)sizedImageWithName:(NSString *)name {
    UIImage *image;
    if (IS_IPHONE_5) {
        image = [UIImage imageNamed:[NSString stringWithFormat:@"%@-568h",name]];
        if (!image) {
            image = [UIImage imageNamed:name];
        }
    }
    else if (IS_IPHONE_6) {
        image = [UIImage imageNamed:[NSString stringWithFormat:@"%@-750w",name]];
    }
    else {
        image = [UIImage imageNamed:name];
    }
    return image;
}

ここで完全なコードを取得できます：https : //gist.github.com/YGeorge/e0a7fbb479f572b64ba5

エッジツーエッジまたはフルスクリーンの画像の最善の解決策は、実際の画面サイズ（ポイントではなく）を気にすることであり、実行時にデバイスのモデルを確認し、適切な画像を選択する必要があります。

image-iphone4-4s.png (640x960/2) for 1/2 screen height、 image-iphone5-5c-5s.png (640x1136/2) for 1/2 screen height、 image-iphone6-6s.png (750x1334/2) for 1/2 screen height、 image-iphone6plus-6splus.png (1242x2208/2) for 1/2 screen height、

質問者のこの状況では@？xは必要ありません。

デバイスごとに異なるサイズの背景画像を使用する必要があると思います。背景には@ 3xスケールの画像を使用してください。

以下の行でデバイスを検出できます。

#define IS_IPAD (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
#define IS_IPHONE (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
#define IS_RETINA ([[UIScreen mainScreen] scale] >= 2.0)

#define SCREEN_WIDTH ([[UIScreen mainScreen] bounds].size.width)
#define SCREEN_HEIGHT ([[UIScreen mainScreen] bounds].size.height)
#define SCREEN_MAX_LENGTH (MAX(SCREEN_WIDTH, SCREEN_HEIGHT))
#define SCREEN_MIN_LENGTH (MIN(SCREEN_WIDTH, SCREEN_HEIGHT))

#define IS_IPHONE_4_OR_LESS (IS_IPHONE && SCREEN_MAX_LENGTH < 568.0)
#define IS_IPHONE_5 (IS_IPHONE && SCREEN_MAX_LENGTH == 568.0)
#define IS_IPHONE_6 (IS_IPHONE && SCREEN_MAX_LENGTH == 667.0)
#define IS_IPHONE_6P (IS_IPHONE && SCREEN_MAX_LENGTH == 736.0)