Table of Contents

Variables: Giving Your App a Memory
Defining a variable
Setting and Getting a Variable
Incrementing a Variable
Displaying a Variable
Computational Expressions

Variables: Giving Your App a Memory Just as people need to remember things. This chapter examines how you can program an app to remember information. so do apps. .

one thing you’ll be asked is how much memory you want the computer to have. your modified document is in short-term memory only. A byte is 8 electronic currents. or some other type of data. Long-term memory. A megabyte is a million bytes. or at least part of it. means information that lives even after an app is closed. When someone tells you the phone number of a pizza place for a one-time immediate call. check the data values in them.000x1. It is something like a person’s short-term memory. If you were storing yes/no votes. The “4GB RAM” is the computer’s short-term memory. 4GB RAM. RAM stands for random access memory. with each cell holding a number. some of us have learned to decipher the terminology.000. . When you save a file. If you have a directly on your computer. If the power went out. You can think of the hard drive as the computer’s long-term memory. Short-term memory is used by an app as it executes and performs calculations. When you save information in a word processing file. If someone calls out some numbers for you to add. The “random” means that you can ask for the information in any memory slot and it can be accessed in a timely fashion. So if you are using your favorite word processor and haven’t saved your file. those numbers and the running total are stored in your shortterm memory. On the first line we learn that the speed of the computer is 3. that information would be lost. 750 GB means 750 gigabytes.000x8 votes. some text. it would be stored on the hard drive. Long-term memory is slower and better for batch jobs like storing or retrieving an entire file of information. (Gigahertz). Consider this ad: The description is in a foreign language to many. The second line has information about the computer’s memory: 750 GB Hard Drive. it moves information from the computer’s short-term memory to its long-term memory. An app can put things in these shortterm memory cells.000.0 Ghz. and perform computations on that data.When you buy a computer. it is stored on the hard drive. A gigabyte is a million megabytes. you could store 750x1. at least partially. in the context of a computer. you store it in your brain’s short-term memory. A computer’s speed is how fast it can perform calculations such as 1+1 or adding up a million numbers. You can think of the app’s short-term memory as a huge set of memory cells. The computer (or smart-phone) has the same kind of short-term memory.

Choose a number (123) for this example: . you define a new variable in the Blocks Editor by clicking on Definitions and dragging out a def variable block. or to keep track of the question number in a quiz app. For instance. You can also change and view them in the Blocks Editor. but more on that later.There are two types of memory cells in an App Inventor app: component properties and variables. when you close the app. Here are the steps you’d follow to create a variable “score”: 1. the data stored in the memory cells is lost.g. the width of each component is stored in a memory cell Button. e.these are called variables. that data will not be in the memory cells unless your app re-sets the property or variable. Besides component properties. a number or text: 3. You might define a variable to keep track of the score in a game app. Defining a variable With App Inventor. So if somebody plays your game app and gets the score up to 200. Drag the def variable block from Definitions: 2.Width 50 The end-user who uses the app never sees the memory cell or the number 50—the app’s shortterm memory is hidden from the user. Both component properties and variables are short-term in that. If you re-open the app. You as a programmer can view and set these properties in the Component Designer.. then closes the app. Click on the triangle in the red box to specify the type of variable. you can name it and specify an initial value. the score will not be 200 when he re-opens the app. you can also define memory cells which are not associated with a particular component-. You are already familiar with component properties—these are stored in short-term memory cells. When you define the variable.

All such floating definition blocks are executed when the app begins. When the app begins. score 0 Because score has been defined. Setting and Getting a Variable When you define a variable as demonstrated above. Note that the blocks for a variable definition are not placed in an event-handler: instead they float by themselves in the blocks editor. the app will be able to store values in it (set it). both of which appear in the My Definitions drawer: The set global to block lets you modify what is in the memory cell. If the app needs to determine a winner. Change the initial value to 0: 5. So if the app is a game and the player does something good. a slot in which you can remember something. the value in score can be set to a larger number. it can look at (get) the value of score and compare it to some other number.4. these blocks: . and see what value is in it (get it). App Inventor immediately creates two blocks for using it. Change the name of the variable to “score” for this example: When you define a variable you tell the app to set up a named memory cell. For instance. the slot is allocated and in this sample named “score” with an initial value of 0.

To understand these blocks. when the player touches the mole. if you wanted to check if the score was 100 or greater. the blocks say to get the value in the memory cell named score and add 1 to it. For instance. a variable is set based on another variable or even its own current value. If the value of score was 5. Specifically. For instance. resulting in 6 being placed in the variable: score 6 So like Chinese. the score should be incremented by a 5 in the variable score: score 5 The block labeled “global score” gets (retrieves) the value of a variable. in some sense. . and then the result is “set” into the variable score.the + and its two “argument” slots -. first realize that blocks on the right-.are performed first. Here are the blocks to increment a variable. App Inventor blocks are interpreted. right-to-left. in the game MoleMash. adding 1 to it gives 6 as the result of the + operation. you’d plug the “global score” block into an ifthen test: Incrementing a Variable Often. The 6 is then plugged into the set global score to operation.

The reason is flexibility as the specifications for your app change.g. or MVC for short. it is particular important to define variables for the calculations separately from the user interface objects. Understanding a concept like Model-ViewController. It becomes even more significant when one attempts to port an app from one device with a particular user interface (e. the ScoreLabel could be incremented (+1) directly and you wouldn’t need to define the variable “score” at all. the web) to a different device (a phone).Displaying a Variable When your app defines a variable. you’d leave the score increment blocks as they are. This variable and all of the cells in the short-term memory are not visible to the end-user of the app. For this simple example. and the Controller being the glue (e. the difference might not be significant. you’d only have to change the display blocks. however. but never used score to modify the user interface. ImageSprite. to keep your “calculation” (model) variables separate from your interface (“view”) variables. The concept itself has been coined Model-View-Controller. if your client tried the app and decided it would be beneficial to show the score as a sliding bar. If you defined and modified a variable score in a game app. But for software with many calculations and views of the data. it allocates a memory cell in the app’s short-term memory. ScoreLabel to display the score. event-handlers). the View being the user interface. When the user does something to get points.. the user would never know the score and the app’s work keeping track of it would be wasted. For instance. you can define a label component. For something like a score. One could just define another label component displaying the “Current Score:” and place it just to the left of ScoreLabel. can add significantly to your ability to working on a software . “why have both a score and a ScoreLabel?” and its a good question.g.g. For our example. with the Model being the calculations (and database) part. the app first modifies the variable score then transfers the new value of the variable into the label: You may ask..Text to” blocks with something that modified the width of the slider bar (probably a label).. In software engineering it is considered good practice. and just replace the “set ScoreLabel. and not the calculations.Touched). Then when the user did something to get points (e.

For Computational Expressions An expression is the computer science term for a formula. including those you’ve defined. A common place you’ll find expressions is on the right-hand side of a set global to block.Width and a random fraction function: . function. In general. an expression can be any mathematical formula and can contain any mathematical operator. Most of the building blocks for creating expressions are in the Math drawer: You can combine these with Component properties and variables to calculate just about anything. When we add one to the score: the blocks to the right of the set global score to block (the score + 1) are an experession. you’d configure an expression consisting of a multiply block. or value. the Canvas. if you wanted to move an image sprite to a random column within the bounds of a canvas.

you add blocks that display that information in a label or other user interface component. If you want the end-user to view the information stored in a variable. It begins executing its operations and responding to events that occur. the app sometimes needs to remember things. This separation of concerns is called the Model-View-Controller paradigm. it is good practice to use variables for calculations and use user interface components just for display—so you wouldn’t directly add to a ScoreLabel. or even something like the direction an object is moving. If you know your app needs to remember things. this might be each player’s score. like component properties. You can set a variable (modify the value in its cell) and get a variable (look at the contents within the cell). you define variables. You can perform calculations and then put the result in a variable. are really named memory cells in the app’s short-term memory. In responding to events. you’d modify a score variable and then place the updated score in the ScoreLabel. In software engineering.Summary An app is launched. For a game. . Variables are not visible to the end-user of the app. Variables.