How to Change the Background

Step 1

From the 'Edit Application Pages' screen (above), select the page you wish to edit then click 'style' on the corresponding row (as depicted above).


Step 2

You will now be on the 'Design Page Style' screen.

In the 'Properties' cell, select either 'Background Image' or 'Background Color' to edit either of these properties.   You can have either a background image displayed, or a background colour, but not both.  Having a background image inserted will override any background colour you set.

To edit the background image, click on the small grey square button (located on the right hand side of the field), then select the required image from the 'In-App Resource Manager'.  Refer to How to Add a File to 'In-App Resources' for more information on how to upload files used throughout your App (e.g. an image file such as a .png, or .jpg file).

To edit the background color, follow the same procedure and then select the required color from the palette provided.   Note that a HTML hexidecimal color code (e.g. #FFFFFF) can be typed directly into the 'Background Color' field in the 'Properties' cell, if you prefer.

Note:  If a background image is used in the iCaddy App template (instead of a standard background color), the image needs to be sized correctly to display correctly on all handset types.  The minimum image size is 320px by 480px.  The maximum image size is 640px by 1136px.  If the background image (as uploaded) does not fit the page correctly, the image dimensions can be adjusted using using the 'Background Size' field (circled in green above).  Small images with dimensions less than the minimum screen width and/or height will automatically tile on the page.  Small images will be tiled vertically and/or horizontally depending on the dimensions of the image.



Step 3

Once the image or color has been selected, click 'APPLY PAGES' and the image / colour will be updated into your App.   Click 'DONE'.

Note:  You will then be able to view the changes immediately on your device using the iCaddy Apps Previewer.   Refer to How to Download the iCaddy Apps Previewer and How to View Your App on the iCaddy Apps Previewer, for further information on how to download and use the iCaddy Previewer App.