CODEWITHSUNDEEP
cordovaionic-frameworkionic3hybrid-mobile-app
Abhee
Abhee

Reputation: 73

ionic 3 resources splash screen is getting cropped

I have generated splash screen using ionic cordova resources. The splash screen has logo at the top and bottom part of it. The logo is getting cropped in most of the devices while launching the app. does anyone face similar kind of issue?

Splash screen image

Upvotes: 0

Views: 736

Answers (1)

MarkD
MarkD

Reputation: 4944

As per the docs, your splash screen image (if using cordova's splash screen generator) should be 2732px x 2732px (to fill the highest res tablet, an iPad pro 12.9"). That square image will be cropped (from the center of the image) to the various aspect ratios of devices you are compiling for.

Thus if you want to use the generator (rather than manually creating images as suggested in the comments to your post) you will need to stick to a safe zone in the center of the screen. Currently the highest aspect ratio mobile devices are ~19.5:9. This leads to a safe zone of 1242px x 1242px in the center of your original 2732px x 2732px image.

If you absolutely must have a header/footer in your image, you'll need to manually create all of the various aspect ratio images.

Upvotes: 1

Related Questions