Using the A and B Buttons

header-lesson-02

Using the A and B Buttons#

In this section, we will focus on the A and B buttons:

microbit-buttons

To access the code for the buttons, click on the “Input” drawer of the Toolbox.

makecode-buttons-01

Select an on button block.

makecode-buttons-02

Place the on button block on the workspace. This block has three options: A, B and A + B. The A + B is when you press both the A and B button at the same time.

makecode-buttons-03

Duplicate the on button block twice.

makecode-buttons-04

These blocks are not the same color as the other block, because they are the same. This means they will be ignored unless you change the values in the dropdown menu.

makecode-buttons-05

Rearrange the blocks to make the workspace cleaner.

makecode-buttons-06

Click on the arrow on the dropdown menu on one of the duplicated blocks and change the value to B.

makecode-buttons-07

The block changes colors and will not be ignored.

makecode-buttons-08

Click on the arrow on the dropdown menu on the remaining duplicated block and change the value to A + B.

makecode-buttons-09

This block changes colors too, and will not be ignored.

makecode-buttons-10

Now we need to do something when the buttons are pressed. Click on the “Basic” drawer in the Toolbox.

makecode-buttons-11

Select a show string block.

makecode-buttons-12

Place the show string block in any of the on button blocks.

makecode-buttons-13

Change the string to display a string of your choice. In this example, the string “4CSCC” will be displayed on the micro:bit display when button A is pressed.

makecode-buttons-15

We will work on another block now. Click on the “Basic” drawer again.

makecode-buttons-16

Select a show icon block.

makecode-buttons-17

Place the show icon block in any of the empty on button blocks.

makecode-buttons-18

Change the image using the dropdown menu.

makecode-buttons-19

In this example, the happy face icon will display when button B is pressed.

makecode-buttons-21

For your remaining block, you need to take one more action. To do so, click on the “Basic” drawer in the Toolbox again.

makecode-buttons-22

This time, we will display a custom image. Choose the show leds block.

makecode-buttons-23

Place the show leds block in the remaining block. In this example, the custom image will be displayed when buttons A and B are pressed simultaneously.

makecode-buttons-24

Design your custom image.

makecode-buttons-25

The micro:bit is now ready to be flashed with code. Press the download button to transfer the code to the micro:bit.