Studio for iPhone has built-in support for displaying startup images. Startup images are essentially splash screens for Web sites; they appear on the iPhone’s screen while a Web site is loading. To specify a startup image, set the C1ViewPort control’s or the C1LaunchPad control’s StartupImageUrl property.
This feature is only available when your Web site is launched in full-screen mode. For more information about launching the Web site in full-screen mode on an iPad or iPhone device, see Hiding Safari UI Elements.
Note: The image used must be 1) 320x460 pixels and 2) a PNG file. The iPhone will ignore the image if this criteria isn’t met.
Also, the startup image feature is only available when your Web site is launched in full-screen mode. For more information about launching the Web site in full-screen mode on an iPad or iPhone device, see Hiding Safari UI Elements.
In Design View
Complete the following steps:
1. Select the C1ViewPort or C1LaunchPad control.
2. In the Properties window, set the following properties:
•Set the StartupImageUrl property to a URL. For example, “Images/YourImage.png”.
•Set the FullScreenCapable property to True.
In Source View
Complete the following steps:
1.
Add StartupImageUrl=”YourImage.png” to the
<cc1:C1ViewPort> tag or the
<cc1:C1LaunchPad> tag, replacing “Images/YourImage.png” with
the URL containing your graphic.
2.
Add FullScreenCapable=“True” to the tag, as the startup image will
not work if the Web site isn’t full-screen capable
The markup will resemble one of the following:
<cc1:C1LaunchPad runat="server" ID="C1LaunchPad1" StartupImageUrl=”Images/YourImage.png” FullScreenCapable=”True”>
<cc1:C1ViewPort runat="server" ID="C1ViewPort1" StartupImageUrl=”Images/YourImage.png” FullScreenCapable=”True”>
In Code View
Complete the following:
1. In Design view, double click the page to enter Code view. This will also add a Page_Load event to your project.
2. Complete one of the following:
•For a C1LaunchPad control, add the following to the Page_Load event, replacing “Images/YourImage.png” with the URL to your image file:
C1LaunchPad1.StartupImageUrl = “Images/YourImage.png”
C1LaunchPad1.FullScreenCapable = True
o C#
C1LaunchPad1.StartupImageUrl = “Images/YourImage.png”;
C1LaunchPad1.FullScreenCapable = true;
•For a C1ViewPort control, add the following to the Page_Load event, replacing “Images/YourImage.png” with the URL to your image file:
C1ViewPort1.StartupImageUrl = “Images/YourImage.png”
C1ViewPort1.FullScreenCapable = True
o C#
C1ViewPort1.StartupImageUrl = “Images/YourImage.png”;
C1ViewPort1.FullScreenCapable = true;
3. Run the program.
This Topic
Illustrates the Following:
Now that you’ve set the StartupImageUrl property to the URL of an image and the FullScreenCapable property to True, a customized splash screen will be shown as the user loads your Web site from the Home screen of an iPad or iPhone device.