Responding to User Input

Design Mode makes it really easy to lay out the User Interface for your app, but we'll need to dive into Code Mode to make it actually respond to users.

In Game Lab the Draw loop just constantly ran code, using conditionals to check for interactions from the user. App Lab, on the other hand, waits to respond to certain events that occur in a program. It's App Lab's way of saying "Hey! Something just happened!". This means that there doesn't need to be any code running when you aren't directly interacting with an app, and your code can respond to each of these events as they happen.

In App Lab all event handling starts by adding a special block of code called onEvent. Here is how to do it:

  1. Switch into Code Mode
  2. Drag an onEvent block from the toolbox into the workspace.
  3. Use the pulldown menu to select the ID of the UI element you want to setup to respond to some event. The IDs of all UI elements added in design mode will be listed here.
  4. Use the pulldown menu to select the type of event you want to respond to. (Just use "click" for now).
  5. Add code inside the function that you want to run when the event happens. The function will run once every time the event occurs.

Found a bug in the documentation? Let us know at documentation@code.org