Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 77 - 2626_South Point_C-7
P. 77

    View Pane              Components Pane

                                                                                                           Properties
                          Palette                                                                            Pane
                          Pane

                       Palette pane: On the left, there is a palette pane from where we can select components like buttons,
                       images, and other functions required for our app.
                       View pane: To the right of the palette is the white area where we can view and arrange added
                       components.

                       Components pane: This pane shows a list of all the components added to the screen in a hierarchical
                       view.
                       Properties Pane: When we click on a component in the viewer, we see its properties listed here.
                       Properties of the components can be changed from here.

                          Creating a Talking app

                     In  the  Project Designer window, we will
                     design the interface by choosing buttons,
                     images  or text  boxes  and specify  the

                     functionalities of our app.

                     Adding a Button

                     Drag and drop a button from the Palette
                     pane to the View pane.

                     Testing the App

                     App Inventor allows us to test our app while creating, so, to test your app, connect your android device
                     and download MI A12 companion. Now follow the given steps.
                     Step 1:  Click on Connect menu.
                     Step 2:  AI Companion from the drop-down list.
                     Step 3:   Open MIT A12 Companion on your device connect by scanning the QR code or typing the
                             code displayed on your screen.

                                                                                                     App Development   75

| 72 73 74 75 76 77 78 79 80 81 82 |