Meteor : way to specify icon and launch screen of an app?

Flavien Volken picture Flavien Volken · Nov 16, 2014 · Viewed 9.8k times · Source

I would like to set an icon and splash screen to my application made with meteor + cordova without editing the Xcode project itself… how to do so ?

Answer

Flavien Volken picture Flavien Volken · Nov 16, 2014

You can make use of the mobile-config.js file which must be placed at the root of the project . (available from the 0.9.4) To have an example of this file, the simplest way would be to see how the "localmarket" example made it. Just type:

meteor create --example localmarket

Then watch the file:

more localmarket/mobile-config.js

Basically, the file needs to describe the App.icons and App.launchScreens. Here is what it must contain:

App.icons({
  // iOS
  'iphone': 'resources/icons/icon-60x60.png',
  'iphone_2x': 'resources/icons/[email protected]',
  'iphone_3x': 'resources/icons/[email protected]',
  'ipad': 'resources/icons/icon-76x76.png',
  'ipad_2x': 'resources/icons/[email protected]',

  // Android
  'android_ldpi': 'resources/icons/icon-36x36.png',
  'android_mdpi': 'resources/icons/icon-48x48.png',
  'android_hdpi': 'resources/icons/icon-72x72.png',
  'android_xhdpi': 'resources/icons/icon-96x96.png'
});

App.launchScreens({
  // iOS
  'iphone': 'resources/splash/splash-320x480.png',
  'iphone_2x': 'resources/splash/[email protected]',
  'iphone5': 'resources/splash/[email protected]',
  'iphone6': 'resources/splash/[email protected]',
  'iphone6p_portrait': 'resources/splash/[email protected]',
  'iphone6p_landscape': 'resources/splash/[email protected]',

  'ipad_portrait': 'resources/splash/splash-768x1024.png',
  'ipad_portrait_2x': 'resources/splash/[email protected]',
  'ipad_landscape': 'resources/splash/splash-1024x768.png',
  'ipad_landscape_2x': 'resources/splash/[email protected]',

  // Android
  'android_ldpi_portrait': 'resources/splash/splash-200x320.png',
  'android_ldpi_landscape': 'resources/splash/splash-320x200.png',
  'android_mdpi_portrait': 'resources/splash/splash-320x480.png',
  'android_mdpi_landscape': 'resources/splash/splash-480x320.png',
  'android_hdpi_portrait': 'resources/splash/splash-480x800.png',
  'android_hdpi_landscape': 'resources/splash/splash-800x480.png',
  'android_xhdpi_portrait': 'resources/splash/splash-720x1280.png',
  'android_xhdpi_landscape': 'resources/splash/splash-1280x720.png'
});

Moreover as you are providing the path for the files, the files needs to be included into a resources/icons and resources/splash folder you will put in the root of your project.

Documentation for mobile-config.js