Choose exam board for KS4 Computer Science (GCSE)
Choose exam board for KS4 English
Choose exam board for KS4 French
Choose exam board for KS4 Geography
Choose exam board for KS4 German
Choose exam board for KS4 History
Choose tier for KS4 Maths
Choose exam board for KS4 Music
Choose exam board for KS4 Physical education (GCSE)
Choose exam board for KS4 Religious education (GCSE)
Choose exam board for KS4 Spanish

      Events and interactions

      Lesson details

      Learning outcome

      I can make an app respond to user actions by using events.

      Key learning points

      1. Events are actions that apps can respond to.
      2. Event listeners are used to detect events and run a set of instructions.
      3. Apps respond to user input by using functions that run when specific events occur.

      Keywords

      • Event - an action that happens in the app which the app can respond to

      • Event listener - a function that waits for a user action (such as a click) and then triggers a response

      • Trigger - the action that causes an event to run

      • Function - a named block of code that performs a task when called

      Common misconception

      Events happen automatically.

      Events only trigger code if an event listener is attached. Without one, the app will not respond.

      Teacher tip

      Pupils will have encoutered many uses of apps in the world around them. Tailor the activities in the slides to best reflect the experiences pupils in your school will have had when using app-based technology.

      Equipment

      Pupils will need access to a device with phone app design software. Examples in this lesson use App Lab https://oak.link/app-lab which will require pupils to have a login to obtain access to edit.

      Licence

      This content is © Oak National Academy Limited (2026), licensed on Open Government Licence version 3.0
      except where otherwise stated. See Oak's terms & conditions
      (Collection 2).

      Lesson video

      Loading...

      Prior knowledge starter quiz

      6 Questions

      Q1.
      What is the main purpose of a user interface (UI) in an app?

      to make the app look colourful
      Correct answer: to help users interact with the app
      to store information secretly
      to speed up the app’s code

      Q2.
      Which of the following is considered a user interface (UI) element?

      the app’s background code
      the power supply
      the device’s battery
      Correct answer: a button users can click

      Q3.
      What is the area called where you arrange the layout of your app visually?

      Correct Answer: design mode, Design

      Q4.
      What is the term for a setting that changes how a user interface (UI) element looks or behaves?

      Correct Answer: property, Properties

      Q5.
      Match each keyword to its description:

      Correct Answer:user interface (UI),the visual part users interact with

      the visual part users interact with

      Correct Answer:design mode,the area for arranging app layout visually

      the area for arranging app layout visually

      Correct Answer:element,a specific part of a user interface

      a specific part of a user interface

      Correct Answer:property,a setting that changes how something looks or works

      a setting that changes how something looks or works

      Q6.
      Arrange these steps for creating a simple app layout in the correct order:

      1 - open design mode
      2 - drag elements onto the screen
      3 - set properties for each element
      4 - test the layout

      6 Questions

      Q1.
      Match each keyword to its description:

      Correct Answer:event,an action the app can respond to

      an action the app can respond to

      Correct Answer:event listener,code that waits for a specific action

      code that waits for a specific action

      Correct Answer:trigger,the action that starts code running

      the action that starts code running

      Correct Answer:function,a named block of code for a task

      a named block of code for a task

      Q2.
      Match each scenario to the correct term:

      Correct Answer:user taps a button and the app reacts,event

      event

      Correct Answer:code waits for a key to be pressed,event listener

      event listener

      Correct Answer:a set of instructions to show a message,function

      function

      Correct Answer:pressing a key starts a process,trigger

      trigger

      Q3.
      Put these steps in order for making a button perform an action when clicked:

      1 - create a button
      2 - attach an event listener to the button
      3 - write a function for the action
      4 - click the button to test it

      Q4.
      Which of these is an example of a trigger?

      Correct answer: typing on a keyboard
      the app’s logo
      the code’s file name
      the device’s battery level

      Q5.
      Which statement is true about events in apps?

      Events happen automatically without any code.
      Events cannot be used with buttons.
      Correct answer: Events only trigger code if an event listener is present.
      Events are only for advanced apps.

      Q6.
      Which of the following best describes a function?

      a setting in the app
      a graphic in the interface
      a type of event listener
      Correct answer: a block of code that can be called when needed

      To help you plan your 8 computing lesson on: Events and interactions, download all teaching resources for free and adapt to suit your pupils' needs...