Skip to main content

Featured to Learn

How to use Alert in Thunkable | Designer and Blocks clear explanation

thunkable_alert

Hello friends, welcome to the another tutorial of Thunkable. In this tutorial, we will know about Alert, it's uses and how to use it.

Alert

Alert is a component, which is used to show important messages, related to app in runtime (when the app is opened in the phone). for e.g. In contacts app, if we want to delete some contact, then it asks for yes or no, by showing the Alert etc.
We can add title, message, and buttons to the Alert, which can do the function, that you wanted to do. Just like in contacts app, when the user clicked yes on the alert, the contact will be removed.
The maximum number of button, which can be add in the Alert is three. we can customize alert for more buttons, but it is not possible in Thunkable. The three button, includes, a positive button (like yes, true, ok etc.), negative button (like cancel, no, false etc.), and a neutral button (like ask me later etc.). We can also customize the text of button.

How to use

We can simply drap and drop the Alert in Thunkable. We can also customize the Alert in Thunkable using Designer & Blocks section. The Designer section includes,
  1. First thing we had to do is to rename the Alert, so that we can easily identify it in Blocks section, and can easily write particular blocks for it.
rename
  1. Title - It sets the title of Alert. "Test" is the title of Alert in below image.
alert_title_message_thunkable
  1. Message - It sets the message of Alert. "This is a Test" is the message of Alert in above image.
  2. ConfirmButton - It customizes the confirm button of Alert. It includes,
    • Text - It sets the text of Confirm Button. The "NOPE" button in the above image is confirm button.
    • Dangerous - If sets to true, the button text will be in Red color. (Only for iPhone).
  3. CancelButton - It customizes the cancel button of Alert. It includes,
    • Text - It sets the text of Cancel Button. The "OK" button in the above image is cancel button.

Blocks

The function for the Alert button is defined in Blocks section. we can also customize all the Designer properties in Blocks section. The property which is set by Blocks will override the Designer property i.e If we set the title of Alert to "Test" in Designer Section, and "Test 1" in Blocks section, then the title of Alert will be "Test 1" in runtime.
  1. in "Alert" call "Show" - It shows the Alert to user. We can use it with button click or any another clickable component,
alert_show_on_button_click_thunkable
  1. from "Alert" set "Title" to - It sets the title of Alert.
  2. from "Alert" get "Title" - It returns the current title of Alert.
  3. from "Alert" set "Message" to - It sets the message of Alert.
  4. from "Alert" get "Message" - It returns the current message of Alert.
  5. from "Alert" set "Confirm Button" to -  It sets the confirm button of Alert. If we want to set the cancel button as Confirm Button, then we can use blocks as,
confirm_cancel_button_thunkable
  1. from "Alert" get "Confirm Button" to - It returns the current confirm button of Alert.
  2. from "Alert" set "Cancel Button" to - It sets the cancel button of Alert. We can use it same as 6th number Block.
  3. from "Alert" get "Cancel Button" - It returns the current cancel button of Alert.
So friends, the tutorial for Alert ends here. If you have any query regarding this, then Ask me in comment box.

Thanks,
Programming Infinity

Comments