CODEWITHSUNDEEP
meteorsplash-screenangular-meteor
Dani
Dani

Reputation: 4187

Meteor mobile-config.js launchScreens

I'm creating the splash images for my app but I've got some questions:

Thanks in advance!

Upvotes: 1

Views: 501

Answers (1)

ghybs
ghybs

Reputation: 53225

Next time you should consider splitting your questions into independent posts.

  • Creating splash images: if your image is simple enough, indeed you have many scripts that can generate the different sizes automatically. I am sure you can customize them to fit your sizes.

  • Use the same image for different sizes: in general, that would mean your image will be stretched by the device to fill the screen. On Android, you can define a 9-patch PNG that will tell the device which pixels can be stretched, so that some part(s) of your image is not deformed.

  • Deformed image for 1920x1080 screen: depending on the pixel density, there should very probably be a placeholder for that.

  • Storage of image versions: by default, all versions (i.e. sizes) are packaged within your APK / APP, so that whatever the device needs will be available once user has downloaded the app.

  • Using an HTML+CSS page for splash screen: in general, no, but it depends on what you want to do with your splash screen. Meteor calls it "launch screen", because it is the first thing it displays while the app is loading / "launching". In particular, the WebView and local server may not be ready yet, and cannot serve any HTML/CSS. That is why you have to use a plain image, which is passed to a very simple activity while the app is loading. But some people also use a "waiting screen" between some parts of their app. In that case, your WebView and local server are already loaded, and you can simply use whatever you want.

Update:

For Android, if 9-patch PNG does not fit your need, you can also try to request Cordova's splashscreen plugin to maintain the aspect ratio of your image:

https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/#preferences

<preference name="SplashMaintainAspectRatio" value="true" />

"SplashMaintainAspectRatio" preference is optional. If set to true, splash screen drawable is not stretched to fit screen, but instead simply "covers" the screen, like CSS "background-size:cover". This is very useful when splash screen images cannot be distorted in any way, for example when they contain scenery or text. This setting works best with images that have large margins (safe areas) that can be safely cropped on screens with different aspect ratios.

In Meteor, you would use App.setPreference in mobile-config.js:

App.setPreference("SplashMaintainAspectRatio", true, "android");

Upvotes: 4

Related Questions