Application Icon and Splash Screen

• Application Name
• Application Icons
• Loading screen

Application Name

In the build.yml in your application folder there is an entry “name”. This is the display name that the user will see on the device. Example:

name: My Own App

Application Icons

Place your image to use as an icon into the folder called icon in your application. If you created an app called testapp then the folder would be testapp/icon.

• Windows Mobile and Windows: You can add an icon in two formats: icon.png and icon.ico.

• iOS 4.0: Apple require three icons for application: 57x57, 72x72 and 114x114 pixels. Prepare such files, name them as icon57.png, icon72.png and icon114.png and place into icon folder

  testapp/ build.yml Rakefile rhoconfig.txt app/ public/ icon/ icon.png icon.ico

iOS

• Target->info->General->Name
• Target->info->Build->Product Name (for all configurations)
• rhodes\platform\iphone\icon.png, icon57.png, icon72.png, icon114.png - change to your icons
• check rhodes\platform\iphone\Info.plist it should contain BundleName=${PRODUCT_NAME}

Android

You can change the icon for your Android application by replacing icon.png, which is in your application icon folder, with a new icon.png.

Windows Mobile

Windows Mobile Shell program caches program icons. This cache is cleared only when the device or the simulator is restarted. If you change the icon of your application, you have to restart the device or simulator: uninstall/install is not enough.

Loading screen

Rhodes supports the display of a custom “Loading” screen while your application is launching. This screen’s source is the file loading.html, located at /app/loading.html.

Alternatively, you can replace loading.html with an image named loading.png if you just want a simple image to be displayed.

You can control how image presented by modifying splash_screen options in rhoconfig.txt:

• delay - how long splash screen should be displayed (in seconds)
• center,vcenter,hcenter - picture alignment
• zoom,vzoom,hzoom - scaling options

Examples:

Place the splash screen in the center and show it for 5 seconds: :::ruby splash_screen=‘delay=5;center’

Center the splash screen horizontally, scale it vertically to file all available space, and show it for 5 seconds: :::ruby splash_screen=‘delay=5;hcenter;vzoom’

You can customize you loading image (showed on start of application) for each platform by platform suffix:

• Android loading.android.png
• iPhone loading.iPhone.png
• WM loading.wm.png

If application doesn’t have platform specific loading.png, then Rhodes will try to load default loading.png.

For iPhone you may define a set of loading images. See Apple documentation about these images, section Application Launch Images in Build-Time Configuration Details.

If you are building for iPhone using rake commands, place loading.png to your applications “app” folder. If you created an app called testapp then the folder would be testapp/app. Also you can add some additional images for so loading screen look better on different devices:

• loading.png; size 320x480 - for iPhone/iPod/iPhone4/iPad and other non iOS devices
• loading@2x.png; size 640x960 - for iPhone4/iPod4; if not defined then loading.png will be used
• loading-Portrait.png; size 768x1024 - for iPad in Portrait orientation on start; if not defined then loading@2x.png will be used
• loading-PortraitUpsideDown.png; size 768x1024 - for iPad in Portrait orientation on start, if not defined then loading-Portrait.png will be used
• loading-Landscape.png; size 1024x768 - for iPad in Landscape orientation on start, if not defined then use loading@2x.png
• loading-LandscapeLeft.png; size 1024x768 - for iPad in LandscapeLeft orientation on start; if not defined then loading-Landscape.png will be used
• loading-LandscapeRight.png; size 1024x768 - for iPad in LandscapeRight orientation on start; if not defined then loading-Landscape.png will be used

If you are using xCode to build for iPhone, you should add to your project Default.png image. You can also add some additional images for better work on different devices:

• Default.png; siz 320x480 - for iPhone/iPod/iPhone4/iPad
• Default@2x.png; size 640x960 - for iPhone4/iPod4, if not defined then use Default.png
• Default-Portrait.png; size 768x1024 - for iPad in Portrait orientation on start, if not defined then Default@2x.png will be used
• Default-PortraitUpsideDown.png; size 768x1024 - for iPad in Portrait orientation on start, if not defined then Default-Portrait.png will be used
• Default-Landscape.png; size 1024x768 - for iPad in Landscape orientation on start, if not defined then Default@2x.png will be used
• Default-LandscapeLeft.png; size 1024x768 - for iPad in LandscapeLeft orientation on start, if not defined then Default-Landscape.png will be used
• Default-LandscapeRight.png; size 1024x768 - for iPad in LandscapeRight orientation on start, if not defined then Default-Landscape.png will be used