Building your First Mobile App: App Logic

The app logic is responsible for toggling the visibility of the image and updating the button text accordingly. Follow these steps to implement the logic:

App logic

1. Navigate to the Blocks tab above the Properties panel.

2. Click on Button1 in the Blocks panel and drag the when Button1.Click block.

3. Drag an if then else block from the Control section into the when Button1.Click block.

4. Drag an equal block from the Logic section and drop it into the if statement.

5. Use the Button1.Text block from the Button1 section, placing it in the first section of the equal operation.

6. Drag an empty text block from the Text section into the second part of the equal operation. Type Hide in the empty block.

App condition

7. Click on the Image1 block and drag and drop set Image1.Visible to on your screen. From the Logic section grab the False block. Connect them together.

8. Similarly, click on the Button1 block and drag and drop set Button1.Text to on your screen. From the Text section grab the empty text block and type Show. Connect them together.

9. Move these two blocks inside the if statement.

Completed if block

10. Right-click on the first set block, choose Duplicate, and move the duplicated block inside the else statement. Change False to True and Show to Hide.

11. Duplicate the other block, move it into the else statement, and change the text to Hide. The final code is as follows:

Final code

12. Congratulations, you are done! Test your app to see the logic in action.