Flash simulation of real basketball bounce movement

Use Flash to make interactive animation, games, must use the flash as. To use good flash,as is necessary to learn. I write this article, I hope to learn as a friend to help. The author divides this example into the realization basketball horizontal movement, the rotation, the beating, adds the shadow these four parts to explain.

　　source file Download: Click here to download (4K, Zip compressed file)

　　Effect preview:

Create a new Flash document, click the Size button in the Properties panel, and open the document Properties panel to set the scene size to 500px x 240px, with white and 20fps background.

　　 one, the realization basketball level movement

1. Draw or press CTRL to import a basketball. Click to draw, press F8 to create as a movie clip symbol, as shown in Figure 1.

Figure 1

2. Click the "basketball" component, press F9 to open the Actions panel, and enter the following code:

Onclipevent (enterframe) {
_x + 6;
}

Test, you will find that basketball can now be horizontal movement. Because we changed the x-axis value of the component by the _x property. But there is a problem, the basketball out of the scene will not come back. Well, let's add the following code:

Onclipevent (enterframe) {
_x + 8;
if (_x>500) {
_x = 0;
}
}

Figure 2

　　 Second, the realization of basketball rotation

Many friends may think that directly let the angle attribute add a constant, such as "_rotation + + 20" on it. In this way, you will find that when your duty is slightly larger, it becomes obvious that the basketball spins unevenly. Some friends may think of diameters, but unfortunately, there is a nasty border around the components in Flash, as shown in Figure 2. When the basketball spins, its diameter is not sure. But luckily, the perimeter of the basketball is fixed. So, when the film is loaded, we can record the perimeter of the basketball and then calculate a fixed radius, as follows:

Onclipevent (load) {
S = Math.pi*_width;
}

Onclipevent (enterframe) {
_x + 8;
if (_x>500) {
_x = 0;
}
_rotation = _x*360/s;
}

　

Figure 3, Figure 4

　　 third, the realization of basketball beat

1. When the ball is beating, the vertical velocity is constantly changing due to the gravity effect. This change can be described by a sine wave, as shown in Figure 3. So, we can add the following paragraph to the code above.

Onclipevent (enterframe) {
......
_y =-math.abs (100*math.sin (_x/100)) +150;
}

2. To keep the ball below the horizontal line, we need to convert the negative value to a positive value using Math.Abs (), as shown in Figure 4.

3. In order for sin () to loop, we must provide a fixed increment for it. The use of _x is the most convenient. However, there is a problem here need attention, basketball bounce cycle is 2л (6.283), if the value is too large, it will lead to incomplete basketball trajectory. So, I'm going to let _x divide by a very large number.

4. Multiplying by 100 is what allows the basketball to beat up to 100 pixels. As for the minus sign, that involves the problem of the flash coordinate system, simply put, in Flash, the _y is a negative value for the move up, and a positive value for the move down.

Figure 5

Four, the realization basketball shadow

1. In theory, as long as the reader knows the basketball bounce, the more the basketball close to the ground shadow smaller, darker color, conversely, the greater the shadow, the more transparent.

2. In the Properties panel, give the "basketball" symbol an instance named "basketball" as shown in Figure 5. Then create a "shadow" movie clip symbol. Then click the shadow component and press F9 to enter the following code:

Onclipevent (enterframe) {
X =. 6*_root. Basketball. _y;
_x = _root. Basketball. _x;
_xscale = _yscale = + X;
_alpha = X;
}

Multiplied by _y, the shadow will be large, so multiply. 6 (ie 0.6). In Flash, even waiting is allowed. If you add the statement "Trace (_alpha)" to the above code, you see that the _alpha value is changing.

Now the test, you will find a beating basketball.