web-dev-qa-db-ja.com

Ionic 3-スプラッシュ画面のサイズ

ionic 3アプリケーション用のスプラッシュスクリーンを生成する必要があります。スプラッシュスクリーン画像の正しいサイズは2732 * 2732であると述べているサイトもあれば、スプラッシュスクリーンサイズは2208 * 2208.どちらが正しいですか？しかし、2732 * 2732で試しましたが、スプラッシュスクリーンを生成した後、画像がデバイスに適合せず、デバイスでの表示中にスプラッシュスクリーンが大きすぎます。これについて誰かが考えていますか？

アプリのアイコンサイズは1024 * 1024で、正常に機能しています。

次のコマンドを実行して、AndroidおよびiOSデバイスのさまざまなサイズのデバイスのアイコンとスプラッシュ画面を生成します。

ionic cordova resources

ありがとう

ionic3splash-screenappicon
3
Anannthakrrishnan

スプラッシュ画像を変更し、新しい画像（2732 * 2732）のアイコンが中央に配置されました。そのため、画像をトリミングしている間、中央のアイコンはカットされず、すべてのデバイスで正常に機能しています。

一部のサイトでは、サイズを2208 * 2208と記載しています。それが混乱したことです。

そのため、スプラッシュ画像の問題が修正されました。

スプラッシュ画面の唯一の問題は、スプラッシュ画面のアイコンを中央に配置する必要があることです。そうしないと、スプラッシュ画面の生成中に画像がトリミングされます。

ありがとう

2
Anantha krishnan

Ionic 3）には、スプラッシュ画面とアイコンジェネレーターを使用するのが最善の方法だと思います。

これは私にとってはうまくいきます：

[〜＃〜]アイコン[〜＃〜]

  1. アイコンを作成しますicon.pngまたはicon.psdまたはicon.ai。私の場合、png拡張子の付いた1024x1024のアイコンを作成しました
  2. アイコンをresourcesディレクトリに保存します（example：your-project/resources/icon.png）
  3. そして、ionic cordova resources --iconを使用するだけです。

[〜＃〜]スプラッシュ[〜＃〜]

  1. スプラッシュを作成しますsplash.pngまたはsplash.psdまたはsplash.ai。私の場合、png拡張子の付いたスプラッシュ4816x4816を作成しました
  2. スプラッシュをresourcesディレクトリに保存します（example：your-project/resources/splash.png）
  3. そして、ionic cordova resources --splashを使用するだけです。

Config.xmlファイルには、次のように生成されたコードが表示されます。

<platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
    <icon height="57" src="resources/ios/icon/icon.png" width="57" />
    <icon height="114" src="resources/ios/icon/[email protected]" width="114" />
    <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
    <icon height="80" src="resources/ios/icon/[email protected]" width="80" />
    <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
    <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
    <icon height="100" src="resources/ios/icon/[email protected]" width="100" />
    <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
    <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
    <icon height="180" src="resources/ios/icon/[email protected]" width="180" />
    <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
    <icon height="144" src="resources/ios/icon/[email protected]" width="144" />
    <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
    <icon height="152" src="resources/ios/icon/[email protected]" width="152" />
    <icon height="167" src="resources/ios/icon/[email protected]" width="167" />
    <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
    <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
    <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
    <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
    <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
    <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
    <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
    <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
    <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
    <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
    <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
    <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
    <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
    <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
    <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
</platform>

これが機能しない場合は、おそらく前にプラットフォームを生成する必要があります。

0
XenoX

ionic cordova platform addを使用してプラットフォームを追加すると、ルートフォルダー内にresourcesという名前のフォルダーが生成されます。 resources内には、生成されたicon.pngファイルとsplash.pngファイルが正しいサイズであり、1024x1024と2732x2732になります。私が懸念しているように、あなたはその正確な寸法を使用するべきであり、小さくも大きくもありません。

0
Rob

スプラッシュ画面のソース画像は、理想的には少なくとも2732×2732pxである必要があります。ただし、アイコンの位置が一元化された、このサイズの背景の白い画面のみを使用してください。このサイズのアイコンは使用しないでください。

0
Mangesh Daundkar