pxt-calliope/docs/projects/guitar/displaybuttons.md
Sam El-Husseini e3975e65e5 pxt-microbit Accessibility PR (#529)
* Accessibility changes
2017-09-07 13:42:08 -07:00

179 lines
4.8 KiB
Markdown

# Buttons, Display & Sound
## @description @boardname@ guitar: using buttons with display and sound
## ~avatar avatar
Use Button Events to control LED Display and play Sound
* **Concepts:**
* Events
* Tone/Note
* Sequence
## ~
## Duration: 30 - 45 minutes
## Materials
A @boardname@, battery pack and 2 x AAA batteries
![battery pack and @boardname@](/static/mb/projects/guitar/microbit.jpg)
2 to 4 crocodile clips
![crocodile clips](/static/mb/projects/guitar/crocclips.jpg)
Headphones
![earbud headphones](/static/mb/projects/guitar/headphones.jpg)
## Blocks
```cards
basic.showLeds(`
. # . # .
. . . . .
. # # # .
. # . # .
. # # # .
`);
input.onButtonPressed(Button.A, () => {});
music.playTone(Note.C, music.beat(BeatFraction.Quarter))
music.rest(music.beat(BeatFraction.Whole))
music.beat(BeatFraction.Quarter)
```
## Step 1: Make a Smiley
Open @homeurl@ in your web browser
```blocks
basic.showLeds(`
. # . # .
. . . . .
. # # # .
. # . # .
. # # # .
`);
```
From **Basics**, drag a **show LEDs** block into the coding area
* Create a face with LEDs
![@boardname@ USB connection](/static/mb/projects/guitar/connectmicrobit.jpg)
Connect your @boardname@ to your computer via USB and click **`Download`**.
Follow the instructions to move the code to your @boardname@.
## Step 2: Add Smiley LED Button Events
```blocks
input.onButtonPressed(Button.A, () => {
basic.showLeds(`
. # . # .
. . . . .
. # # # .
. # . # .
. # # # .
`)
})
input.onButtonPressed(Button.B, () => {
basic.showLeds(`
. # . # .
. . . . .
. . . . .
# . . . #
. # # # .
`)
})
```
From **Input**, drag an **on button 'A' pressed** block into the coding area
* Snap the LED face into the block
* Create a 'B' button block with a different LED face
* Download the code to your @boardname@ and try the A & B buttons
## Step 3: Add Headphone Speakers using Crocodile clips
![crocodile clips attached to pins 0 and GND](/static/mb/projects/guitar/crocclipintoboard.jpg)
![crocodile clips attached to headphone jack](/static/mb/projects/guitar/jacktocrocs.jpg)
Connect **GND** to the **base of the headphone jack** using a second crocodile clip (usually black)
Connect **pin 0** to the **tip of the headphone jack** with a crocodile clip
*attaching batteries and @boardname@*
https://youtu.be/zwRTmpKIaVU
Attach the @boardname@ & battery-pack to the guitar body
*connecting headphone speaker*
https://youtu.be/ewyEW_U5G9M
Connect the headphones with crocodile clips
## ~hint
## The @boardname@ can play music
The **play tone** block allows a range letter note tones from **C** to **B5**.
Songs are played using sequences notes. Like the beginning of a birthday song (C, C, D, C, F, E).
```blocks
input.onButtonPressed(Button.A, () => {
music.playTone(Note.C, music.beat(BeatFraction.Quarter))
music.rest(music.beat(BeatFraction.Whole))
music.playTone(Note.C, music.beat(BeatFraction.Quarter))
music.rest(music.beat(BeatFraction.Whole))
music.playTone(Note.D, music.beat(BeatFraction.Quarter))
music.rest(music.beat(BeatFraction.Whole))
music.playTone(Note.C, music.beat(BeatFraction.Quarter))
music.rest(music.beat(BeatFraction.Whole))
music.rest(music.beat(BeatFraction.Whole))
music.playTone(Note.F, music.beat(BeatFraction.Half))
music.rest(music.beat(BeatFraction.Whole))
music.playTone(Note.E, music.beat(BeatFraction.Whole))
})
```
## ~
## Step 4: Add Tone Playing Events for Buttons A & B
```blocks
input.onButtonPressed(Button.A, () => {
basic.showLeds(`
. # . # .
. . . . .
. # # # .
. # . # .
. # # # .
`)
music.playTone(Note.A, music.beat(BeatFraction.Whole))
})
input.onButtonPressed(Button.B, () => {
basic.showLeds(`
. # . # .
. . . . .
. . . . .
# . . . #
. # # # .
`)
music.playTone(Note.G, music.beat(BeatFraction.Whole))
})
```
From **Music**, drag **play tone *C* for *1* beat** block under the **show leds** in **Button A Pressed**
* modify **tone** by choosing a note (*letter*) and experiment with high and low pitches
* set **beat** to 1
**Repeat** for **Button B** event
**Download the code** to the @boardname@
**Try the A & B buttons** with headphones and power connected
## Congratulations on completing the basic guitar!
**Challenge:** Create samples of longer music to play for each button instead of the single tone
* *Tip*: Search for "ABC music notation" or "Easy Music Notes" + the name of a song
## Extra
* [Smiley Buttons tutorial](/projects/smiley-buttons)
* [Hack your headphones](/projects/hack-your-headphones)
## ~button /projects/guitar/lightsensor
NEXT: Light Sensor Tone Control
## ~