Creating my first Android app, Part 3

Go here to read Part 1 and Part 2. (Note: I have slightly edited the previous posts, changing the name of one textbox to TextBoxMessage instead of TextBoxNote.)

Blogger is being a jerk, so I had to d/l Google Chrome to compose this. What's that? You don't care? You just came here to eat my brains and gain my app knowledge? Okay, on with the meager meal.

We will be doing something very complicated today: storing notes in a database which can then be retrieved using the ListPicker component. We will be building the functionality behind the [Save Note] button and the [Load Note] "button". The latter is an air quote "button" because it is actually a listpicker element that looks like a button.

One of the components we put into our app was a TinyDB (which we named DatabaseNotes). This database works by storing stuff under a tag. For example, you could store your age ("39" in my case) under the tag "age". The nice part about TinyDB is that it stores stuff even after you turn your app off.

We will store our notes, which consist of a title and a message, to the database using the title as the tag. That way, we can search the database for the title and reload our note.

Let's start with the [Save Note] button. When we press it, we need to save the note in the database (using the title as the tag). But we need to think further ahead. How are we going to get the note back out? There is no easy way to pull out all the tags from the database, so we need to keep a list of all the tags we put in. The way to do this is with a list.

A list is an 1-dimensional array. If that description made things more unclear, then a list is a list of things. So a list can be a list of numbers or a list of names or a list of titles. We will create a list of note titles and store it in the database, so we can pull it out, choose a title of a note, and then load the note.

I think I've talked too much. Let's do some programming. I'm assuming you've opened up your app in App Inventor and opened up the Blocks Editor. First, define our list of note titles:

1. Click [Built-In]. This is where all the build-in blocks are.
2. Click [Definitions].
3. Click [def variable as] and drag it to the editor.
4. Click on the "variable" and type "ListNoteTitles".
5. Click on [Built-In], click on [Lists], click on [call make a list], and drag it to [def ListNoteTitles as] and plug it in. This will define a list called "ListNoteTitles" which we can later store our list of note titles in.

Next, the [Save Note] button.

1. Click [My Blocks], click [ButtonNoteSave], click [when ButtonNoteSave.Click] and drag it to the editor. This will allow us to define what happens when the [Save Note] button is pressed.
2. Click [My Blocks], click [DatabaseNotes], click [call DatabaseNotes.StoreValue] and drag it to the editor. There is a notch at the top of it. Fit this into the spike on the [when ButtonNoteSave.Click] block.
3. Click [My Blocks], click [TextBoxTitle], click [TextBoxTitle.Text], and drag it and plug it into the "tag" slot.
4. Click [My Blocks], click [TextBoxMessage], click [TextBoxMessage.Text], and drag it and plug it into the "valueToStore" slot.

This will save the note to the database, but we also need to save the note title to the list of titles, and then save that list of titles to the database.

1. Click [Built-In], click [Lists], click [call add items to list], drag it, and put it below the [call DatabaseNotes.StoreValue].
2. Click [My Blocks], click [My Definitions], click+drag [global ListNoteTitles] to the "list" slot.
3. Click [My Blocks], click [TextBoxTitle], click+drag [TextBoxTitle.Text]to the "item" slot.

Unfortunately, there is really no way to test this to see if it is working. We need to build the [Load Note] button first. There are two parts: before picking from the list and after. Before we pick from the list, we need to define what the list is.

1. Click [My Blocks], click [ListNoteLoad], click+drag [when ListNoteLoad.BeforePicking] to the editor.
2. Click [My Blocks], click [ListNoteLoad], click+drag [set ListNoteLoad.Element to] and attach it to the notch in [when ListNoteLoad.BeforePicking].
3. Click [My Blocks], click [My Definitions], click+drag [global ListNoteTitles] to the "to" slot.

This populates the list with all our note titles. After we choose which note we want to load, we need to copy the note from the database to the text boxes.

1. Click [My Blocks], click [ListNoteLoad], click+drag [when ListNoteLoad.AfterPicking] to the editor.
2. Click [My Blocks], click [TextBoxTitle], click+drag [set TextBoxTitle.Text to] and attach it to the notch in [when ListNoteLoad.AfterPicking].
3. Click [My Blocks], click [ListNoteLoad], click+drag [ListNoteLoad.Selection] to the "to" slot.
4. Click [My Blocks], click [TextBoxMessage], click+drag [set TextBoxMessage.Text to] and attach it below [set TextBoxTitle.Text to].
5. Click [My Blocks], click [DatabaseNotes], click+drag [call DatabaseNotes.GetValue] to the "to" slot.
6. I'm going to show you a short cut. Click on the [ListNoteLoad.Selection] block, press CTRL+C, and press CTRL+V. This created a duplicate! Click and drag the duplicate to the "tag" slot below.

Test out the app on your phone. Press the [Record] button on your phone and say "test". Press the [Copy to Title] and [Copy to Message]. The text "test" should show up in both text boxes. Now press the [Save Note] button. Nothing should happen: SUCCESS! Next press the [Load Note] button. The screen should go black and you should see the word "test". Click on it and you should go back to your app and everything will look the same. Again, SUCCESS! Okay, to really test if things are working, repeat all those steps except say "best". Now when you press [Load Note], you'll see "test" and "best". Pressing "best" will load that into both text boxes.

My eyes are going blurry looking at all this code. I'll show you how to email a note to someone next time.

Go here for Part 4.