move lessons out of web site
will move select lessons back to "educators" section
This commit is contained in:
69
olddocs/lessons/rotation-animation/activity.md
Normal file
69
olddocs/lessons/rotation-animation/activity.md
Normal file
@ -0,0 +1,69 @@
|
||||
# rotation animation block activity
|
||||
|
||||
Rotate images with a while loop.
|
||||
|
||||
### ~avatar avatar
|
||||
|
||||
Welcome! This tutorial will teach how to rotate images with a **while loop**. Let's get started!
|
||||
|
||||
### ~
|
||||
|
||||
Let's start by creating a global variable called `rotating` and initialize it to true. This well indicate when the animation should be displaying.
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
```
|
||||
|
||||
Now we need a while loop that will be executed only if the variable rotating is true.
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
basic.pause(20)
|
||||
|
||||
}
|
||||
```
|
||||
|
||||
Let's create and show an animation of a diagonal line that rotates clockwise. We need a pause so that the battery does not burn out.
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
basic.pause(20)
|
||||
basic.showLeds(`
|
||||
# . . . .
|
||||
. # . . .
|
||||
. . # . .
|
||||
. . . # .
|
||||
. . . . #
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
# # # # #
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
}
|
||||
```
|
||||
|
||||
### ~avatar avatar
|
||||
|
||||
Excellent, you're ready to continue with the [challenges](/lessons/rotation-animation/challenges)!
|
||||
|
||||
### ~
|
||||
|
145
olddocs/lessons/rotation-animation/challenges.md
Normal file
145
olddocs/lessons/rotation-animation/challenges.md
Normal file
@ -0,0 +1,145 @@
|
||||
# rotation animation block challenges
|
||||
|
||||
Coding challenges for the rotation animation.
|
||||
|
||||
## Before we get started
|
||||
|
||||
Complete the following guided activity:
|
||||
|
||||
* [activity](/lessons/rotation-animation/activity)
|
||||
|
||||
At the end of the activity, your code should look like this:
|
||||
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
basic.pause(20)
|
||||
basic.showLeds(`
|
||||
# . . . .
|
||||
. # . . .
|
||||
. . # . .
|
||||
. . . # .
|
||||
. . . . #
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
# # # # #
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### Challenge 1
|
||||
|
||||
Now let's add to this by creating a condition for on button pressed `A` before the while loop. We will also introduce serial writeLine for the while loop and input OnButtonPressed
|
||||
|
||||
```blocks
|
||||
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
serial.writeLine("loop")
|
||||
basic.showLeds(`
|
||||
# . . . .
|
||||
. # . . .
|
||||
. . # . .
|
||||
. . . # .
|
||||
. . . . #
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
# # # # #
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
}
|
||||
input.onButtonPressed(Button.A, () => {
|
||||
serial.writeLine("hello")
|
||||
})
|
||||
|
||||
```
|
||||
|
||||
### Challenge 2
|
||||
|
||||
|
||||
|
||||
Now that we have the on button pressed condition, let's make the animation stop rotating by setting the rotating global variable to false when button `A` is pressed.
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
serial.writeLine("loop")
|
||||
basic.showLeds(`
|
||||
# . . . .
|
||||
. # . . .
|
||||
. . # . .
|
||||
. . . # .
|
||||
. . . . #
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
# # # # #
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
}
|
||||
input.onButtonPressed(Button.A, () => {
|
||||
serial.writeLine("hello")
|
||||
rotating = false
|
||||
})
|
||||
|
||||
```
|
||||
|
||||
* Run the code to see the awesome rotation.
|
||||
|
||||
### Challenge 3
|
||||
|
||||
Let's also make the image rotate the opposite way when button A is pressed! We can do this with another while loop that is only executed while `not rotating`.
|
||||
|
93
olddocs/lessons/rotation-animation/quiz-answers.md
Normal file
93
olddocs/lessons/rotation-animation/quiz-answers.md
Normal file
@ -0,0 +1,93 @@
|
||||
# rotation animation quiz answers
|
||||
|
||||
Learn how to create a rotating image with a while loop.
|
||||
|
||||
This is the answer key for the [rotation animation quiz](/lessons/rotation-animation/quiz).
|
||||
|
||||
## 1. What is a " variable"?
|
||||
|
||||
Answers may vary. A variable is a place where you can store data so that you can use it later in your code.
|
||||
|
||||
## 2. Write the code to create a ** variable** called `foo` that stores a boolean and initialize it to **false**.
|
||||
|
||||
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
```
|
||||
|
||||
## 3. Explain what this line of code does.
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . # . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
<br/>
|
||||
|
||||
It is a **while** loop that will be executed only if the ** variable** called `rotating` is **true**.
|
||||
|
||||
## 4. If the rectangle below represents the BBC micro:bit, shade the areas that will be displayed. Explain why that particular area is shaded.
|
||||
|
||||
```blocks
|
||||
basic.showLeds(`
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
# # # # #
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||

|
||||
|
||||

|
||||
|
||||

|
||||
|
||||

|
||||
|
||||
Show animation will show a series of image frames on the LED screen, pausing the specified time (400 milliseconds) after each frame
|
||||
|
83
olddocs/lessons/rotation-animation/quiz.md
Normal file
83
olddocs/lessons/rotation-animation/quiz.md
Normal file
@ -0,0 +1,83 @@
|
||||
# rotation animation quiz
|
||||
|
||||
Learn how to create a rotating image with a while loop.
|
||||
|
||||
## Name
|
||||
|
||||
## Directions
|
||||
|
||||
Use this activity document to guide your work in the [rotation animation tutorial](/lessons/rotation-animation/activity).
|
||||
|
||||
Answer the questions while completing the tutorial. Pay attention to the dialogues!
|
||||
|
||||
## 1. What is a " variable"?
|
||||
|
||||
<br />
|
||||
|
||||
## 2. Write the code to create a variable called foo that stores a boolean and initialize it to false.
|
||||
|
||||
<br/>
|
||||
|
||||
## 3. Explain why you use a while loop with a variable
|
||||
|
||||
```blocks
|
||||
let rotating = true;
|
||||
while (rotating) {
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . # . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
<br/>
|
||||
|
||||
## 4. Draw the areas on the micro:bits to illustrate the code below. Explain why you chose to draw in those areas.
|
||||
|
||||
```blocks
|
||||
basic.showLeds(`
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
. . # . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . .
|
||||
. . . . .
|
||||
# # # # #
|
||||
. . . . .
|
||||
. . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
basic.showLeds(`
|
||||
. . . . #
|
||||
. . . # .
|
||||
. . # . .
|
||||
. # . . .
|
||||
# . . . .
|
||||
`)
|
||||
|
||||
```
|
||||
|
||||

|
||||
|
||||
<br/>
|
||||
|
Reference in New Issue
Block a user