Daily coding tips and tricks, C#, ASP.NET, .NET, SQL - Programming Tips and Tricks: iPhone

Here is the detailed documentation on how to add a splash screen to your web app.

1) For Start-Up Screen

while your home page loads in the background, iOS will display a startup screen.

iOS comes with a built-in function called "launch image".

iPhone 4/4S supports a higher screen resolution (what so called Retina Display). In order to support both screen resolution of older iPhone models and latest models, you have to prepare two versions of splash screen images of these sizes:

320 x 480 (for iPhone 2G / 3G / 3GS)
640 x 960 (for iPhone 4 / 4S)

The splash screen image should be in PNG format. By default, you should name the image file for lower screen resolution as “Default.png”.

Below is the code to enable splash screen:

<link rel="apple-touch-startup-image" href="images/boot.png" />

Start-up Image will only work if it has this line:

Below are the different sizes you will need for iPad/iPhone/iPod etc.

This is the link for detailed information: Home screen icons and startup screens

The output will be:

2) For Home Screen Icon :

Put this tag in between <head></head> tags.

<link rel="apple-touch-icon" href="/timentry2.jpg" />

The Image size must be of (57 x 57)

You can also put multiple Images for different resolution of Iphone as below:

Then

Daily coding tips and tricks, C#, ASP.NET, .NET, SQL - Programming Tips and Tricks

Pages

Friday 7 June 2013

Adding Splash Screen and a Start-up Icon in Your iOS Web App