Page 92 - KEC Khaitan C5 Flipbook
P. 92

Step  12   Click on the Balls block. The list of coding blocks appears.

                  Step  13   Drag and drop the set Ball1.Y to coding block inside the when Canvas1.Touched                                                                    HANDS-ON PROJECT
                            coding block.
                  Step  14   Click  on the  Logic block.  The list  of coding  blocks                                                       PROJECT NAME: Drawing App
                            appears.                                                                                                        Software Used: MIT App Inventor

                  Step  15   Drag and drop the true coding block and place it in
                            blank.                                                                                                          Objective:
                                                                                                                                            Develop a Drawing App with shake-to-clear functionality and brush color customization.
                  TESTING AN APP                                                                                                            This project teaches students how to:

                  For testing an app on your device, an MIT A12 Companion app is installed on it.                                           1. Implement touch events for drawing on Canvas using MIT App Inventor.

                  Now follow the given steps to test an app.                                                                                2. Utilize  the accelerometer sensor to  detect device  shaking and integrate  it  to  clear

                  Step  1   Click on the Connect menu.                                                                                         drawings.

                  Step  2   Click on AI Companion from the drop-down list.                                                                  Step-by-Step Instructions:

                            The Connect  to Companion message  box                                                                          Making an App in MIT is a four-step process.
                            appears.                                                                                                        Step  1   Planning the App

                  Step  3   Open MIT A12 Companion app on your device                                                                       Step  2   Designing  the App
                            and connect by scanning the QR code or typing
                            the code displayed on your screen.                                                                              Step  3   Coding the App
                                                                                                                                            Step  4   Testing the App
                  After successfully connecting to Magic Touch Ball app to your device, you can work on it.
                  When a user touches the canvas, a colourful ball appears at that location.                                                1. Planning the App

                                                                                                                                            Overview:
                         REVISIT                                                                                                               Begin by identifying the key features and components needed for the app.

                                                                                                                                               Plan the user interface (UI) for a simple, engaging drawing experience.
                    ▶  User Interface (UI) components in MIT App Inventor are the building blocks used to design
                       the visual and interactive elements of a mobile application.                                                            Use the following link to access MIT App Inventor and sign in:

                    ▶  Touch events in MIT App Inventor are mechanisms that allow apps to respond to user                                     MIT App Inventor Platform
                       interactions on the screen.                                                                                            Email to be used: abc@khaitanpublicschool.com

                    ▶  TouchDown event triggered when the user first touches the screen or a specific component.
                       TouchUp event is triggered when the user lifts their finger off the screen or a specific                             2. Designing the App
                       component. Touched event is triggered when the user taps on a component.                                                UI Components to Include:
                    ▶  Drag event is triggered when the user moves their finger across the screen or a component
                       while keeping it pressed.                                                                                              o   Canvas – For drawing.
                    ▶  The Canvas allows developers to draw shapes, display images, and create interactive                                    o   Buttons – To change brush colors (Red, Green, Blue).
                       content such as animations, games, and dynamic user interfaces.
                    ▶  The Canvas is a graphical drawing surface within your app where you can draw lines,                                    o   Accelerometer Sensor – To enable shake-to-clear functionality.
                       shapes, display images, and create animations.                                                                         o   Clear Button – To erase the canvas manually.

                                                                                                                                               Layout Tips:
                                                                                                                                              o   Place the canvas at the top for easy drawing.



                   90   Premium Edition-V
   87   88   89   90   91   92   93   94   95   96   97