CPSC 110-08: Computing on Mobile Phones
Fall 2011

ListsAndLoops

In this tutorial we will introduce App Inventor's for-each loop, which is used for processing lists of data.

Simple Memory Game

Suppose you are writing a simple game that displays, momentarily, an increasingly long lists of numbers and then invites the user to repeat the list from memory. How long a list can users remember?

User Interface

For this version of the game our user interface will consist of a couple of buttons to control generation of the lists and a text box to display the lists:

Program Blocks

Each time the New List Button is clicked, it will generate a list of random digits between 0 and 9 and display it in the text box. Each time the Reset Button is clicked, it will re-initialize the list to the empty list. So the basic logic for this version is simply this:

We will use two global variables to keep track of the desired size of the list and theList itself. Each time ButtonNewList is clicked we will add 1 to the size variable, make a list of length size, and display the resulting list. When the ResetButton is clicked, we will simply reset the variables and the text box to their original states.

Procedural Abstraction: Notice how the ButtonNewList.Click blocks calls the MakeList procedure, which handles the app's list making operations. Using a named procedure here makes the app easier to understand and easier to modify and debug.

Using a While Loop to Create a List

Now let's define the MakeList procedure, using a while loop, which we've used many times before with number problems. Here's the algorithm. Not that it uses a global variable named size to determine the size of the list we are making:

To MakeList do:
   Set global theList to make-an-empty-list
   While length(theList) < global size do:
      add a random number between 0 and 9 inclusive to theList

Here's how this algorithm would look in App Inventor. Not how it uses the add items to list block:

In this case, each time the 'do' slot is executed, a new random integer between 0 and 9 is added to thelist. Each time through the loop, the list will grow in size until it reaches a length of size at which point the test will be false and the loop will terminate.

Initialize, Test, Update

Let's look at the various parts that make up a good while loop. The while loop performs a test. If the test is true, then the body of the loop -- the do slot -- is performed. When the body is finished, the test is performed again and this process repeats until the test becomes false.

Initialization Step: It's important to realize that before we perform the test that controls entrance to the loop, we need to perform some initializations. In this case we initialize theList to the empty list. And the listSize argument is also initialized to the value given when the procedure is called.

Test Step: Before the while loop performs the do slot, it must perform the test. The statements in the do slot are performed only when the test is true.

Update Step: It's also important to note that at least one operations in the do slot must make progress toward the termination of the loop. In this case operation of adding items to the list makes the list longer each time, eventually reaching length listSize.

Question: What would happen if we didn't make progress toward termination? Question: What would happen if the test never became false? Watson: What is an infinite loop?

Using a For-each loop to Process a List

When dealing with lists, App Inventor provides a for-each loop that will perform some operation for each element on the list.

There are three slots that need to be filled in to define a for-each loop:

  1. The variable slot -- Create your own named variable using Definition > name
  2. The in list slot -- This should a global list variable or a list argument
  3. The do -- This is where the operations go.

For example, suppose we want to compute the sum of the numbers on our random list. Let's write a Pseudocode function to do that, using the idea of for-each-item-in-a-list:

# Function using a for-each loop to compute the sum of a list of numbers.
# In this case the variable is named item
# In this case the in list is named aList

To computeListSum(aList) :
   Set global Sum to 0
   For each item in aList do:
      Set Sum to Sum + item
   Return Sum

And here is the App Inventor definition.

Let's use App Inventor's Watch and DoIt features to test our definition:

Download Source

Click here to download the source code and use it for the following exercises.

In-class Exercises, and Homework

Working in pairs, perform each of the following exercises. If you do not finish in class, do the exercises for homework. HINT: Many of the operations required for these exercises use built-in functions that can be found in the App Inventor Lists and Text menus.

We will do the first exercise together.

  1. Write and test a function named getNumberSequence that uses a while loop to generate the numbers 1 to n where n is an argument. For example, if n is 5, then your function should generate the list (1 2 3 4 5). The function should return a list.

  2. Write and test a function named getEvenNumberSequence that uses a while loop to generate the even numbers between 0 to n, where n is an argument. For example, if n is 5, then your function should generate the list (0 2 4). The function should return a list.

  3. Write and test a function named convertListToText that uses a for-each loop to convert a list of numbers into a string where the numbers are separated by commas. For example, if the list was (1 2 4), the function would return '1,2,4,'. (HINT: Join each list item to a string.)

Click here for solutions