In this tutorial, you'll learn how to upload and manage files for use in your app. It builds on both of the previous tutorials (Tutorial1: Hello World and Tutorial 2: Changing Pages) so you might want to work through those first if you haven'y already done so.
Create a new app in the usual way and rest for a moment in the familiar Screen editor. I've changed the background colour of my page to a light blue but that's up to you. Now add an image widget to the page - select the Image button in the widgets panel and drag the image widget in the associated list to the page. Resize and position the widget on the page to suit.
By the way, there are some short cuts to aligning widgets nicely. For example, select the image widget and click on Layout & Align in the menu immediately above the three main panels. Look down to the Center in Canvas section in the resulting dropdown and click on Both.
Changing the image
So far, you have placed an image on your home page, but it's probably not the image that you want to show there. That's where fle upload comes in. Click on the Files tab in the main menu at the top of the screen. You will be taken to the file manager:
The AppFurnace file manager mostly follows the usual model you will be familiar with from your computer's operating system. Files are organized into folders which can be created, renamed, moved, expanded, closed and deleted. You can do most of those things to files too, except create them. Instead, files are added to the store by uploading them from your computer. At this point, you might want to get a feel for the file manager by trying some of the actions attached to buttons and the files and folders themselves. One word of warning, though, please don't delete any of the files and folders in the default folder. You can do that later, but it would be better to wait until we have explained styles in a later tutorial.
Click the "Upload" button in the top-left of the Files tab, and select an image to upload from your computer: using PNG and JPEG image files are recommended. The file will appear in the File structure on the left, and a preview of the selected file will be shown on the right.
You can also check the estimated total size of your app in the grey toolbar at the top, which also suggests how large your app should be for both the iPhone and Android markets. But remember that this is an estimate, and the final size of your app, once built, may differ - so making sure it's under the relevant file size limits is a good idea.
Now, go back to the "Layout" tab and select the image in the center of the screen again. In the Settings attribute tab on the right of the screen, click the "Image" attribute and select the file you've uploaded from the list.
The image widget on the canvas will update to contain your image, though it may need to be resized to get the right proportions.
There are also other image size settings you can use to present your images differently, which you can learn more about on the Image Widget description page.
From here, you can start to add more images to your app, organise them into folders (useful if you've got lots of files) and bring your content to life.