pxt-calliope/docs/tutorials/hour-of-code/hey-microbit.md
Juri Wolf 77ed2ccfb1
V4 updates (#210)
* update pxt.json files

* Fix button event enums

fixes https://github.com/microsoft/pxt-calliope/issues/206

* Fix Safari CSS Rule for iOS app

fixes https://github.com/microsoft/pxt-calliope/issues/205

* aprove preffered repos

should fix https://github.com/microsoft/pxt-calliope/issues/167
2023-01-11 09:51:27 -08:00

4.1 KiB

Hey, @boardname@!

Step 1

Welcome, let's code the @boardname@! Place the ||basic:show string|| block in the ||basic:on start|| slot. Change the "Hello" text to be your name instead. Did you see it scroll in the simulator?.

basic.showString("My Name")

Step 2

Well, you noticed that the text stopped. Place the ||basic:show string|| block in an ||input:on button pressed|| block to scroll your name whenever button A is pressed.

input.onButtonEvent(Button.A, input.buttonEventValue(ButtonEvent.Click), () => {
    basic.showString("My Name")
});

Step 3

Ok, let's try to talk to the @boardname@ using a button. Change the text in ||basic:show string|| to ask the question "How are you?". Add another ||basic:show string|| with "....." to show that the @boardname@ is thinking.

input.onButtonEvent(Button.A, input.buttonEventValue(ButtonEvent.Click), () => {
    basic.showString("How are you?")
    basic.showString(".....");
})

Step 4

Now, make the @boardname@ give an answer with a smiley face! Find the ||basic:show leds|| and draw a smiley face on the block by clicking on the LEDs. Press button A in the simulator and see the @boardname@ respond to your question.

input.onButtonEvent(Button.A, input.buttonEventValue(ButtonEvent.Click), () => {
    basic.showString("How are you?")
    basic.showString(".....");
    basic.showLeds(`
    # # . # #
    # # . # #
    . . . . .
    # . . . #
    . # # # .
    `)
})

Step 5

OK, let's ask @boardname@ how it's feeling just now, but by a different method. We can use the shake gesture to ask the question. Go get an ||input:on shake|| block. Go grab your ||basic:show leds|| block from before and and put it in the ||input:on shake||.

input.onGesture(Gesture.Shake, () => {
    basic.showLeds(`
    # # . # #
    # # . # #
    . . . . .
    # . . . #
    . # # # .
    `)
})

Step 6

We want the @boardname@ to change how it feels at different times. It will have two moods, happy and sad. Go to Logic and get an ||logic:if then else||. Put it in the ||input:on shake|| and move the ||basic:show leds|| into the ||logic:if then|| slot.

input.onGesture(Gesture.Shake, () => {
    if (true) {
        basic.showLeds(`
            # # . # #
            # # . # #
            . . . . .
            # . . . #
            . # # # .
            `)
    } else {
    	
    }
})

Step 7

Duplicate the ||basic:show leds|| block (right-click, then choose Duplicate). Put the new one into the ||logic:else|| part of the ||logic:if then else||. This time, turn that one into a frowny face.

input.onGesture(Gesture.Shake, () => {
    if (true) {
        basic.showLeds(`
            # # . # #
            # # . # #
            . . . . .
            # . . . #
            . # # # .
            `)
    } else {
        basic.showLeds(`
            # # . # #
            # # . # #
            . . . . .
            . # # # .
            # . . . #
            `)
    }
})

Step 8

Test it's mood by changing the condition in the ||logic:if|| from true to false and then click the SHAKE spot in the simulator.

Step 9

So, to make the @boardname@ more fickle, let's give it a random mood. Find the ||math:pick random true or false|| block in Math. Pull it out and use it in the ||logic:if|| condition instead of the true value.

input.onGesture(Gesture.Shake, () => {
    if (Math.randomBoolean()) {
        basic.showLeds(`
            # # . # #
            # # . # #
            . . . . .
            # . . . #
            . # # # .
            `)
    } else {
        basic.showLeds(`
            # # . # #
            # # . # #
            . . . . .
            . # # # .
            # . . . #
            `)
    }
})

Step 10

Now, click the SHAKE spot a few times to see how the @boardname@ is feeling. Hmm, it's mood is different sometimes!

Step 11

Awesome job! You've completed your Microsoft MakeCode activity. If you have a @boardname@ to use, click the |Download| button and try your code on the board.