Lists Quiz T utorial - PowerPoint Presentation

Lists Quiz T utorial Visual Prog r amming week # 05

1. Lists 2. T utorial # 05: President Quiz 3. Homework # 04 VP Lecture Note by D r . Hanh Pham 2 Outline

List = a set of similar things/data Examples: • • a list of phone numbers: {257-3574,255-3015, …} a list of names: {Emma Smith, Andy Mills,…} “ Phon e ” List: Phone[1] = 257-2574 … Phone[N]=256 = 7980 VP Lecture Note by D r . Hanh Pham 3 Elements 257-3574 255-3015 … 256-7980 Index 1 2 … N Lists

T ASK: A quiz about US p r esidents (but you can use it as a templ a te to build quiz z es on a n y topic). T he user s t eps through a series of questions, clicking a bu t ton to proceed to the n ext question. The user enters an answer for each question and the app reports whether each answer is correct or not. The PROBLEM (requirements): display a question with an i mage that relat es to the question  user can en t er/type their answer and click on “SUBMI T ” to see if the answer is cor r ect or not ?  user can go to another que s tion by clicking on “NEX T ” button VP Lecture Note by D r. Hanh Pham 4 Tutorial # 05: Pres ident Quiz

INSTRUCTIONS to Build: More guidance and explanation including video instructions are at : http:// www.appinventor.org/presidentsQuiz2 1) Cre a te a new project c alled “t5 _ QuizMe” 2) In DESIGN window: • •• add an Image, set Width= P are n t, Height=300 Download and Upload 3 ima g es at: http://cs.newpaltz.edu/~phamh/avp/Homework/hw04 / Add 2 labels and 2 bu t tons 3) Use “Screen Ar r angement” to place the T extb o x and the “Submi t ” but t on 4) RENAME the components VP Lecture Note by Dr. Hanh Pham5 Tutorial # 05: President Quiz

VP Lecture Note by Dr. Hanh Pham 6 The DESIGN window should look li k e this: T utorial # 05: Presi d ent Quiz

VP Lecture Note by Dr. Hanh Pham 6 Stage 1: Displ a y the question. The DESIGN window should look li k e this: T utorial # 05: Presi d ent Quiz

HOW to CR E A TE a LIST ?  a List is a V ARIABLE  Click on “ Built-I n ” then “ Variables ” and get the first block :  Drag it to the w orking area. Click and change the default name “variable” to “QuestionList” (NAME of the LIST) VP Lecture Note by D r . Hanh Pham 7 Lists

ADD elements t o a LIS T : • Click on “ Built-I n ” then “ List s ” and sel e ct “ call ma k e a li s t”: •• Left Click, choose “TEXT” and get then type the question in that blockPlug them into each other as shown • Do the same f o r ANSWER list and PICTURE list VP Lecture Note by D r . Hanh Pham 8 Lists

ADD elements t o a LIS T : • Do the same f o r ANSWER list and PICTURE list. Then, we’ll have 3 lists : VP Lecture Note by D r . Hanh Pham 8 Lists

VP Lecture Note by Dr. Hanh Pham 9 Cre a te INDEX v ariable t o navi g a t e / access elements of a LI S T : • Cre a te a V ariable for INDEX of the l istand set it initially to 1:(Click on “Built-In ” then “ Variables ” ) • ASSIGN an element of QuestionList to the Que s tionLabel use “ call select list i t em ” , get it under “ Built-I n ” then “List s”:• Need to specify list = QuestionList and index = IndexOfCurrentQues tionFor NEXT butt on: increase index by 1 to go to the NEXT element Lists

VP Lecture Note by Dr. Hanh Pham 10 Create lists for the questions and pictures, and an index to keep track of your place. Then program the NextButton.Click to show the right question each time. : T utorial # 05: Pres i dent Quiz

VP Lecture Note by Dr. Hanh Pham 10 Complete the code by adding an if block that checks if the user has reached the end of the list. T utorial # 05: Pres i dent Quiz

VP Lecture Note by Dr. Hanh Pham 10 Add a textbox and button for the user's answer, then use an if block to check whether the submitted answer is correct. T utorial # 05: Pres i dent Quiz

VP Lecture Note by Dr. Hanh Pham 10 In Block EDI T OR window ADD more blocks: T utorial # 05: Pres i dent Quiz

VP Lecture Note by Dr. Hanh Pham 10 ANOTHER (simpler) version of BLOCKS : T utorial # 05: Pres i dent Quiz

VP Lecture Note by Dr. Hanh Pham 10 Homework #4 : Quiz Me (done at class)

VP Lecture Note by Dr. Hanh Pham 10 Homework #4 : Quiz Me (done at class)

VP Lecture Note by Dr. Hanh Pham 10 Homework #4 : Quiz Me

VP Lecture Note by Dr. Hanh Pham 10 Homework #4 : Quiz Me

These slides con t ain ma t erials from ma n y sou r ces including the fo l lowing: • • • h t tp://ww w .appin v en t o r .or g http://appinventor. mit.edu “ App I n ve n tor: C r ea t e Y our Own And r oid Apps” by Dav i d W olbe r , Hal Abelson, Ellen Spertus, Liz Loone y , Publisher: O' R eilly App Inventor for Androi d: Build Your Own Apps - No Experience Required, Jason Tyle • VP Lecture Note by D r. Hanh Pham 14 References