Have any questions?

+44 (20) 3540 6226


How to call an Action when a screen loads?

5.0/5 rating (3 votes)

It is possible to call an Action when the screen loads.

For example, when a screen loads you could play a sound, or set a form field value, run some Blockly or JavaScript... basically any Action that is available in AppShed.

This can be particularly powerful if you are doing some coding (Blockly or JavaScript) as you can carry out a number of tasks in the code. You can make your app very interactive.


How to call an Action when the screen loads:

1) Go to the Screen that will have the action.
Here we have a basic Standard Screen. 

basic screen


2) Go to "Templates" and search for "onLoad".



3) "Use" this Template.
As soon as the template is added, you will see a popup message appear. This is a JavaScript Action (the default Action for the onLoad template.)

Click on "OK" to close the popup.

alert popup


4) Template Position
You will notice a special item has been added to the Screen.
The Template will probably be at the top of the screen. If not, it makes sense to move it to the top so that you remember it is on your screen. But it makes no difference where it is positioned, it will always run when the screen loads.


event item


5) Event Items
This is a special Item... called an "Event". It has a dashed borderd, and grey backgroud. This is to show you that it is an Event. 

Events are only visible while editing your app (in App Builder). Once you publish the app, the Event item will be invisible, but it will continue to funciton properly.

6) Change the Action
Edit the Event item (in the normal way, click on it and select "Edit").
Go to the Action tab.
You will see that the Action has been set to "JavaScript" and it has some code. This code causes the popup message to appear. You could change the message just to try it out.

You can also click "Change Action" and set it to any other action that's available.

change action



Some ideas:

  • Make a Word Game that set the value of a Text Input item when the screen loads
  • Change the background colour when the screen loads (you might need to look at the app.js courses to learn how to change the background using JavaScript)


Share this product



   Get In Touch   

appshed name white text 250

Copyright © 2022 AppShed Limited

AppShed Support
Customer Support

We are online and available to help teachers/educators using AppShed. How can we help you today?

Chat, call or email support@appshed.com