Every platform utilizes a splash screen, an image that shows briefly while the application is loading. Since different devices have different display resolutions, the only attributes that should necessarily change with each splash screen are the dimensions. However, you can customize your splash screens as much as you'd like for different platforms and devices.
- Create a standard portrait orientation splash screen in your graphic editor. It's probably easier to start with the biggest size, so if you're supporting iPad, you'll create a 768 x 1004 graphic (1004 instead of 1024 because of the status bar).
- Save as <project-root>/Resources/iphone/Default-Portrait.png (This should always be the name of the file for iPad)
- Rotate the image 90 degrees and change the size to 1024 x 748, re-arrange elements as necessary
- Save as Resources/iphone/Default-Landscape.png (now both iPad splash screens are complete)
- The process will need to be repeated for several more resolutions, listed below.
When saving your different resolutions of splash screens, you'll be overwriting default splash screens created by Titanium when you created your project. For Android, these defaults are located in Resources/android/images/ and in several folders named like "res-long-land-hdpi"
Matrix of Splash Screen Resolutions
Platform |
Resolution |
Orientation |
Long? |
Width |
Height |
Path |
|---|---|---|---|---|---|---|
iPad |
|
Portrait |
|
768 |
1004 |
/iphone/Default-Portrait.png |
iPad |
|
Landscape |
|
748 |
1024 |
/iphone/Default-Landscape.png |
iPhone |
Med |
Portrait |
|
320 |
480 |
/iphone/Default.png |
iPhone |
Retina |
Portrait |
|
640 |
960 |
/iphone/Default@2x.png |
Android |
High |
Portrait |
True |
480 |
800 |
/android/images/res-long-port-hdpi/default.png |
Android |
High |
Landscape |
True |
800 |
480 |
/android/images/res-long-land-hdpi/default.png |
Android |
High |
Portrait |
|
480 |
800 |
/android/images/res-notlong-port-hdpi/default.png |
Android |
High |
Landscape |
|
800 |
480 |
/android/images/res-notlong-land-hdpi/default.png |
Android |
Med |
Portrait |
|
320 |
480 |
/android/images/res-notlong-port-mdpi/default.png |
Android |
Med |
Landscape |
|
480 |
320 |
/android/images/res-notlong-land-mdpi/default.png |
Android |
Low |
Portrait |
True |
240 |
400 |
/android/images/res-long-port-ldpi/default.png |
Android |
Low |
Landscape |
True |
400 |
240 |
/android/images/res-long-land-ldpi/default.png |
Android |
Low |
Portrait |
|
240 |
320 |
/android/images/res-notlong-port-ldpi/default.png |
Android |
Low |
Landscape |
|
320 |
240 |
/android/images/res-notlong-land-ldpi/default.png |
Since a splash screen is likely to change, and there are so many versions of the image, it would be a good idea to create a macro (or Photoshop Actions) to automatically generate all the different sizes.
