# 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:

<figure><img src="https://1663557159-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5pNfTQ4i4gxcGBvuQAOz%2Fuploads%2FLDfAQJsm13x42kziOhL3%2Flogic.jpg?alt=media&#x26;token=57de7f02-1b3f-4ef2-9a4c-6786c9f724a0" alt="" width="375"><figcaption><p>App logic</p></figcaption></figure>

1. Navigate to the <mark style="color:green;">**`Blocks`**</mark> tab above the <mark style="color:green;">**`Properties`**</mark> panel.
2. Click on <mark style="color:green;">**`Button1`**</mark> in the `Blocks` panel and drag the <mark style="color:green;">**`when Button1.Click`**</mark> block.
3. Drag an <mark style="color:green;">**`if then else`**</mark> block from the <mark style="color:green;">**`Control`**</mark> section into the <mark style="color:green;">**`when Button1.Click`**</mark> block.
4. Drag an equal block from the <mark style="color:green;">**`Logic`**</mark> section and drop it into the if statement.
5. Use the <mark style="color:green;">**`Button1.Text`**</mark> block from the <mark style="color:green;">**`Button1`**</mark> section, placing it in the first section of the equal operation.
6. Drag an empty text block from the <mark style="color:green;">**`Text`**</mark> section into the second part of the equal operation. Type *Hide* in the empty block.&#x20;

<figure><img src="https://1663557159-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5pNfTQ4i4gxcGBvuQAOz%2Fuploads%2FichQ4IzNXgHjXTVzW8Zu%2Fblocks1.png?alt=media&#x26;token=1b4a1ea0-13ea-4694-bedf-090476f77528" alt="" width="375"><figcaption><p>App condition</p></figcaption></figure>

7. Click on the <mark style="color:green;">**`Image1`**</mark> block and drag and drop <mark style="color:green;">**`set Image1.Visible to`**</mark> on your screen. From the <mark style="color:green;">**`Logic`**</mark> section grab the <mark style="color:green;">**`False`**</mark> block. Connect them together.
8. Similarly, click on the <mark style="color:green;">**`Button1`**</mark> block and drag and drop <mark style="color:green;">**`set Button1.Text to`**</mark> on your screen. From the <mark style="color:green;">**`Text`**</mark> section grab the empty text block and type `S`<mark style="color:green;">**`how`**</mark><mark style="color:green;">**.**</mark> Connect them together.
9. Move these two blocks inside the if statement.&#x20;

<figure><img src="https://1663557159-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5pNfTQ4i4gxcGBvuQAOz%2Fuploads%2FMvzAtZi8mBDnECb6LbpQ%2Fblocks2.png?alt=media&#x26;token=3e7abac8-b0e4-463e-9693-02c2bd5e620b" alt="" width="375"><figcaption><p>Completed if block</p></figcaption></figure>

10. Right-click on the first set block, choose <mark style="color:green;">**`Duplicate`**</mark>, and move the duplicated block inside the else statement. Change <mark style="color:green;">**`False`**</mark> to <mark style="color:green;">**`True`**</mark> and <mark style="color:green;">**`Show`**</mark> to <mark style="color:green;">**`Hide`**</mark>.
11. Duplicate the other block, move it into the else statement, and change the text to <mark style="color:green;">**`Hide`**</mark>. The final code is as follows:&#x20;

<figure><img src="https://1663557159-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5pNfTQ4i4gxcGBvuQAOz%2Fuploads%2FMcDcV3a6qjO6pKcijSjg%2Fblocks3.png?alt=media&#x26;token=648d98f9-fcf5-4a87-a513-23869f62dd58" alt="" width="375"><figcaption><p>Final code</p></figcaption></figure>

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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://caseytechschool.gitbook.io/app-development-using-mit-app-inventor-platform/tutorial-1-image-hide-and-seek/building-your-first-mobile-app-app-logic.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
