This lesson introduces lists that are built dynamically with user-input. The sample is a
"Twitter-like" note-taking app in which
the user enters notes in a text box and the system records the notes in a list. You'll build a music app in which the user plays notes that are recorded and played back.
What you'll learn: dynamic lists, add items to list, foreach
Demo, Part 1: Create an input form for adding items
- Add a label, textbox and button, name them
- Arrange the components in a horizontal arrangement
- Add a hint to textbox
- Add a label "NoteListLabel" to show all notes, and a header for it.
- In blocks editor, add a list "notes"
- On submitButton.click, add textbox contents to list using add items to list
- show list in noteListLabel
Your Turn, Part 1:
For your music app, do the following:
- find at least three sound files which are simple musical notes.
- Create a list named "MusicalNoteList"
- In your app, the user will click on buttons to play/record notes. When they click one of the musical note buttons, add the note to your musical note list.
- For now, just display the list of musical notes (the file names) in a label.
Demo, Part 2: List the notes on separate lines
- Foreach allows you to process each item in a list
- /n is a text block means new line character
Your Turn Part 2
- Now let's play back the musical notes instead of displaying them in a label.
- Add a Sound component
- Add a button "Play" which uses foreach to loop through and play each note.
- How is the timing on the playback? How might you use a clock to make it better?
For more information on dynamic lists, see chapter 19 beginning
with p. 273