President's Quiz

The app allows the user to navigate through a set of questions. Each question has a picture and some text. The user enters an answer and clicks the "Answer" button, at which time the app checks to see if the answer is correct.

A quiz might have any number of questions. You could define a screen for each question, but it would be quite difficult to program it that way and equally hard to tailor for new quz apps that you build. Instead, we only define a single screen, and program it so that the information within the components changes as the user clicks "Next". So in the blocks, in the NextButton.Click event, the QuestionLabel.Text property will be changed to the next question, and the QuestionImage.Picture will be set to a different image file name. See the blocks below

The blocks for President's Quiz are shown above. Because there is only one screen, we define 'hidden' variables to store all of the questions and answers. These are 'hidden' in the sense that the app only displays one at a time. So one question and one image are displayed at any time, while the other two are hidden from the user (but sill exist in the app's memory).

You drag out "initiaize global" blocks from the Variables drawer. When the app begins, it will set up spreadsheet-like memory cells and place the question, answer, and picture data in those cells. The list variables can be indexed. So, for instance, the value of answerList[1] is "Roosevelt", answerList[2] is "Carter", and so on. The index variable is not a list but a single number. It keeps track of where the user is in the quiz. So if index is 2, we are on the second question (and answer/picture).

You define a list with the "make a list" block. When you drag it out, it has only two items. But if you click the blue icon, you can specify that the list should have more items. In this case, a third item was added.

If you want something to happen when the app begins, put them into the Screen1.Initialize event handler. In this case, we want to show the first question in the list. We could have set the QuestionLabel to the question directly (e.g., 'Which president implemented the New Deal..."). But then if the question changed, or we repurposed our code for a different quiz, the blocks wouldn't work. This is a great example of how code often needs to use abstract references as opposed to "concrete" ones-- it makes the code more flexible and reusable.

The index variable tells us which question the user is on. Its a spreadsheet cell with a number in it. When "Next" is clicked, we look at the number (get global index block), add 1 to it, and stick it back in (set global index). So if its 1 it becomes 2, it its 2 it becomes 3, and so on. The "if" block checks to see if we are at the end of the list. We could check if index > 3, but then if we added a new question to the quiz, the code wouldn't work. Instead, we refer abstractly to 'length of list'.

The user answers by entering text in the AnswerTextBox and clicking the AnswerButton. We compare the current answer (as determined by the value of index) with what the user has entered. So if index is 1, we compare the 1st answer with the user's answer, if index is 2, we compare the 2nd answer, and so on. If you understand what is meant by the "indexth" item in a list, you're starting to get it. Basically, we want to look in the index variable's memory cell, see what number is in there, and then go get that answer (the indexth item). Note that our whole scheme is based on the assumption that we've syncrhonized the question and answer list: the first question goes with the first answer, and so on.

The bottom two blocks are added to clean up the user interface. Without the blocks, when 'Next' is clicked, the user's previous answer and the correct/incorrect are not removed. So even though the user is looking at the next question, the old answer still appears. This code just clears the two labels on each new question.

The President's Quiz is an excellent template that can be used to build many types of quizzes. You can use it to build a study guide for a class you're taking, or a sports or history quiz to stump your friends. One USF student built a quiz app to help his father study for his US citizenship exam. Besides customizing the content, you might try:

• Changing the user interface-- add a previous button so the user can go backward, or stop the quiz when the last question is reached.
• Make the quiz multiple choice. Hint: make a new list for AnswerChoices, and make each item of it a list with the answer choices.