CPSC 110-08: Computing on Mobile Phones
Spring 2011


One of the most operations that a computer can do is to repeat a sequence of operations and repetition is a fundamental construct in just about every programming language. When a sequence of operations is performed repeated, this is called a loop.

In this tutorial we will introduce some of App Inventor's looping constructs. Because loops are often used to perform operations on lists we will loop at several examples of using a loop to process a list in some way.

The Memory Game

Suppose you wanted a write a simple game that displayed, momentarily, an increasingly long lists of numbers and then invited the user to repeat the list from memory. How long a list can users remember?

For the first version our app will have a simple user interface consisting of a couple of buttons to control generation of the lists and a text box to display the lists:

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 make a list, display it, and add 1 to the size variable for the next play. When the ResetButton is clicked, we will simply reset the variables and the text box to their original states.

Top-down Program Design: Notice how we use procedures to divide the app into different logical components. The MakeList procedure will define the list making operations and the DisplayList procedure will handle the displaying of the list, which for now consists simply of setting the text box's text to the list we generate.

This is an example of top-down design: we define the overall structure of the app and then work our way down to defining lower-level procedures and functions. One advantage of this approach is that it's very easy to understand what the program does when ButtonNewList is clicked -- as long as meaningful procedure names are used.

Using a While Loop to Create a List

Now let's define the MakeList procedure. Under App Inventor's Control menu there are three looping blocks: for each, for range, and while.

The most general loop construct is the while loop, which can be used -- together with other operations -- to program any loop whatsoever. Here is how we would use it in the MakeList procedure to create a list of length size:

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.

So, 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 execute the while loop, we need to initialize theList to the empty list. Question: What would happen if we forgot this step?

Update Step: It's also important to note that the operation in the 'do' slot make progress toward the termination of the loop. In this the 'do' operation the list longer each time, eventually reaching length size.

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?

While Loop Summary: The while loop runs the blocks in the 'do' section while some test is true. Before executing a while loop, it is necessary to perform some kind of initialization step. The operation in the 'do' slot must make progress toward the termination of the loop.

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. Solutions next class. Each student should create a portfolio page for this exercise with solutions and commentary.

We will do the first exercise together.

  1. Write and test a function named getRandomList that uses a while loop to generate the a list of length n of random numbers between 0 and n where n is a argument to the function. If n is 0, the empty list should be returned.

  2. 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 size is 5, then your function should generate the list (1 2 3 4 5).

  3. 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).

  4. Write and test a function named convertListToText that uses a while 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 result would be '1,2,4'.

  5. Write and test a function named sumAList that calculates the sum of a list of integers, aList, where aList is an argument. You may assume that the aList contains nothing but numbers. An empty list should sum to 0.