When the barcode appears, use the barcode scanner on your phone to download and install the app. Package the final version of the app by choosing Package For Phone | Barcode from the Component Designer menu. Here's the complete BouncingBall program. Go ahead and assemble the blocks as shown. We also need to update the heading label by calling UpdateLabel. We will use both of these blocks to update the heading. Ball1 also has a method called Ball1.Bounce which takes in an edge argument as input and also changes the heading of the ball to make it bounce appropriately. This block provides an "argument" (a piece of information passed along from the method) that says which edge has been reached. Ball sprites have a method called Ball1.EdgeReached. The ball should change direction when it hits one of the four walls, also called "edges". When a fling happens, we also want to update the heading number displayed on screen by calling UpdateLabel.Īssemble the blocks as shown. We want to update the heading of the ball to whatever heading is reported by the Flung event. Notice how this block provides arguments for x, y, xvel, yvel, heading, and speed of the fling. The ball's new direction will be in the same direction as the fling gesture.ĭrag out a Ball1.Flung block. The ball should change direction when the player flings it. When you start playing with the app watch how the numbers change and see if you can make sense of how heading is represented by the numbers you see. If you've taken Geometry, this is how the unit circle assigns degrees. Headings start at 0 degrees at the right side, positive x-axis as in the diagram shown below, and continue to 360 degrees. Heading is a number that represents the direction in degrees of the path that ball is following. UpdateLabel sets the HeadingLabel.Text to the value of Ball1's heading. Leave the arg socket open because UpdateLabel does not take any input (also called arguments). The completed blocks should look like this: Drag out a new procedure block and name it UpdateLabel.īuild the UpdateLabel procedure. Defining a New Procedure: UpdateLabelĭefine a new procedure that updates the heading in the HeadingLabel. To implement all three of these features, we will use the Ball1.Flung event handler, the Ball1.EdgeReached event handler, and create a new procedure called UpdateLabel. Each time the ball changes direction we want the heading label to be updated. We want actions to happen after two different events: the ball hitting a wall and the ball being flung by the user. On the Viewer screen, move this label into HorizontalArrangement1. On the Viewer screen, move this label into HorizontalArrangement1.Ĭhange Text property to " " (blank). Change the Speed property to 8.Ĭhange Text property to "Current Heading: ". Set the properties of the components as described below: Component Organizes TextLabel and HeadingLabel horizontally The ball sprite Note: sprites can only be placed on top of a canvas, not directly onto the screen. To create this interface, put the following components into the Designer by dragging them from the Component Palette into the Viewer. When you finish, it should look something like the snapshot below (more detailed instructions below the snapshot). Use the component designer to create the interface for BouncingBall. Automatic events making the ball "bounce" off the wall.User-initiated events flinging the ball in a new direction across the screen.Using sprite heading as a feature in a game.This tutorial introduces the following skills, useful for future game development: Open the Blocks Editor and connect to a device or emulator. Name it BouncingBall, and also set the screen's Title to "BouncingBall". Getting StartedĬonnect to the App Inventor web site and start a new project. This tutorial shows how to use the BallSprite component and some of its methods (Bounce, Heading). You'll program a ball sprite to change heading when the player flings the ball or when the ball bounces off of one of the four walls. By building the Bouncing Ball App you will discover how sprite headings work in App Inventor.
0 Comments
Leave a Reply. |