ImagePicker, Basic: Set screen BackgroundImage

[Scott Ferguson]

This exercise uses the ImagePicker component to change the app's screen BackgroundImage.

Create a new project named lrn_imp_basic.

Screen Designer:

Set Screen1.BackgroundColor to none.

Set Screen1.Title to ImagePicker demonstration.

Drag and drop an ImagePicker component to the Viewer.

Set ImagePicker1.Text to change background image ....

 - this component allows the app to pick a photo from the device's photo gallery and return it's location to the AI app

Blocks Editor:

Drag and drop an ImagePicker1.AfterPicking event block onto the BE canvas.

 - this block executes it's contents after the user picks a photo from the device's image gallery

Drag and snap a [set Screen1.BackgroundImage to] block inside the ImagePicker.AfterPicking block.

Drag and snap an ImagePicker1.ImagePath block to Screen1.BackgroundImage's to socket.

 - these blocks set the selected picture as the screen background

DONE.

Test the project with the emulator or device.

The output should be similar to the following: