Your browser is not supported. Please upgrade your browser to one of our supported browsers. You can try viewing the page, but expect functionality to be broken.
CS in Algebra curriculum and content is being deprecated. Within the next few months, this lab will no longer be available. Please check out Bootstrap: Algebra instead. Learn More.
Apps are really cool because it's kind of like starting your own business I mean, you get to design everything from the ground up, you get to manage everything, and you're the owner of this piece of work that you just created with code.
Now that you can change the look of your app let's make it interactive by responding to events! Events are user actions like clicking a button, scrolling through a menu, or hovering over a picture. Interactive apps need ways to respond to events, like playing a sound when I click this button. To do this in App Lab you need to use a new block called 'onEvent'.
This program sets the screen to blue. I want the screen to turn green when I click this button. First I'll need to drag in an onEvent block. By hovering I know the button's ID is "bigButton" so I'll select that in the first drop-down.
Next I'll choose the type of event. There's lots of options you can pick from but right now I'll leave it as a regular old click.
Finally I'll add code inside the on event that will change the background color of the screen. You can read this block like a sentence: "On the event that the button is clicked run all this code."
Let's test it. Blocks outside an onEvent still run right away so the screen starts blue.
And when I click the big button the code inside my onEvent runs and my screen turns green.
If you want to change more things after the event, like the text on the screen just add more code to the onEvent
To make your program respond to more events add more onEvent blocks. Just make sure not to put them inside of each other. Now it's time to try it out for yourself. Have fun!