Time-based animation
If you want to make the animation object speed consistent, Time-based animation is the method we will use.This
Methods are commonly used in some games. We know that neither frame nor timer animation can be played at a specific rate. One
Complex animations may run much slower on an old and slow computer than originally designed. We will see it soon
By now, time-based animations can achieve reliable speed regardless of the frame rate of the final animation.
First, we need to change the speed consideration method. So far, when I say vx = 5, we use pixels.
Per frame (pixels per frame). In other words, every time an object enters a new frame, it will move 5 pixels on the X axis. In
In the timer animation, of course, it should be moving 5 pixels at each scheduled interval.
For time animation, we will use real time units, such as seconds. Because we are processing a complete one second, rather
Therefore, the speed value is greater. If the speed of an object is 10 pixels per frame
30-frame speed movement, It is about 300 pixels per second. For example, in the following example
Part of the file class is truncated and some changes are made. See the bold section below (which can also be found in timebased.) :
Package {
Import flash. display. Sprite;
Import flash. Events. event;
Import flash. utils. gettimer;
Public class timebased extends sprite {
Private var ball: ball;
Private var VX: number;
Private var Vy: number;
Private var bounce: Number =-0.7;
Private var time: number;
Public Function timebased (){
Init ();
}
Private function Init (): void {
Stage. framerate = 10;
Ball = new ball ();
Ball. x = stage. stagewidth/2;
Ball. Y = stage. stageheight/2;
VX = 300;
Vy =-300;
Addchild (ball );
Time = gettimer ();
Addeventlistener (event. enter_frame, onenterframe );
}
Private function onenterframe (Event: Event): void {
VaR elapsed: Number = gettimer ()-time;
Time = gettimer ();
Ball. x + = VX * elapsed/1000;
Ball. Y + = Vy * elapsed/1000;
VaR left: Number = 0;
VaR right: Number = stage. stagewidth;
VaR top: Number = 0;
VaR bottom: Number = stage. stageheight;
If (ball. x + ball. radius> right ){
Ball. x = right-ball. radius;
VX * = bounce;
} Else if (ball. X-ball. radius <left ){
Ball. x = left + ball. radius;
VX * = bounce;
}
If (ball. Y + ball. radius> bottom ){
Ball. Y = bottom-ball. radius;
Vy * = bounce;
} Else if (ball. Y-ball. radius <top ){
Ball. Y = Top + ball. radius;
Vy * = bounce;
}
}
}
}
As described above, I changed the speed calculation so that they can use fixed values instead of random values. Then I created
The time variable to make it equal to the result of the Flash. utils. gettimer function. The gettimer function is very simple.
It returns the number of milliseconds that the video has run-this is all of its work. We can't clear it, restart it,
Change it, and so on. It is just a counter.
It seems to be of little use, but if you call gettimer to save the value, call it later
Once we subtract the two results, we can know exactly-millisecond-how many times the two calls have passed
.
This is the policy: Call gettimer at the beginning of each frame to calculate the interval between the previous frame and the previous frame. If you set it
Divided by 1,000, we will get the interval in seconds, which is a score in seconds. Because of our VX
And Vy are calculated in pixels per second. Therefore, you can multiply them by this score so that you know that you want
The number of moves. Similarly, do not forget to reset the value of the time variable so that the next frame can be computed.
Test,We will see that the ball moving speed is almost the same as the initial speed! But what is really exciting is
We can publish this video at any frame rate, and it can still be moved at the same speed! By modifying
The value of stage. framerate is as high as 1,000 FPS and as low as 10 FPS. You will see that the speed of the ball is the same.
. Of course, a higher frequency will make the animation smoother, while a lower frequency will be incoherent, but the speed is consistent.
.
You can apply this technology to any example of speed in this book.In this case, you also need
Similar technologies are applied to acceleration or external forces, such as gravity, because they are also time-based. Acceleration must be more efficient than conversion.
It is much larger, because acceleration is defined as the rate of change of speed to time. For example, the gravity is about 32 feet/Second/
Seconds.
If the gravity is 0.5 in a 30 FPS animation, it should be 450 now. Calculation Method
0.5*30*30. Then add it as follows:
Vy + = gravity * elapsed/1000;
In the last example, add 450 gravity and test it. We will see the effect of adding gravity 0.5 to the frame animation.
The results are the same. One trick to use this technology is to set the frame rate very high, such as 100. Although no machine can
It is consistent with the real frame rate, but time-based animation ensures that the films that everyone sees run smoothly.
Collision with mass objects
Recall the conservation of momentum in Chapter 1. There are very rigorous code. However, when two objects of the same quality
When a collision occurs, we can implement it more easily. The basic principle is that two objects exchange them along the collision line.
Speed. At the same time, it is necessary to use coordinate rotation to determine the collision line and the object speed, so as to get rid of the complicated
Momentum Conservation formula. Let's see how it works. Let's go back to the file multibilliard2.as and use it
The basis of samemass. As in the next example. I will not list all the original code, because it is really a very
Large file. However, let's take a look at the for loop for creating all the small balls:
For (var I: uint = 0; I <numbils; I ++ ){
VaR radius: Number = math. Random () * 50 + 20;
VaR ball: ball = new ball (RADIUS );
Ball. mass = radius;
Ball. x = math. Random () * stage. stagewidth;
Ball. Y = math. Random () * stage. stageheight;
Ball. VX = math. Random () * 10-5;
Ball. Vy = math. Random () * 10-5;
Addchild (ball );
Bils. Push (ball );
}
For the new file, you need to change the section in bold to this line:
VaR radius: Number = 30;
The same size of all small balls eliminates the concept of quality, which is equivalent to giving them the same quality.
Next, let's take a look at the checkcollision function. Find this part:
// Rotate the speed of ball0
VaR vel0: Point = rotate (ball0.vx,
Ball0.vy,
Sin,
Cos,
True );
// Rotate the speed of ball1
VaR vel1: Point = rotate (ball1.vx,
Ball1.vy,
Sin,
Cos,
True );
// Collision Response
VaR vxtotal: Number = vel0.x-vel1.x;
Vel0.x = (ball0.mass-ball1.mass) * vel0.x +
2 * ball1.mass * vel1.x )/
(Ball0.mass + ball1.mass );
Vel1.x = vxtotal + vel0.x;
This part finds the speed on the collision line and finds the collision result based on the object quality. The "Collision Response" section is
Conservation of momentum, which is what we can eliminate. We can let vel0 and vel1 exchange, you can
To easily replace it. The entire code segment is as follows:
// Rotate the speed of ball0
VaR vel0: Point = rotate (ball0.vx,
Ball0.vy,
Sin,
Cos,
True );
// Rotate the speed of ball1
VaR vel1: Point = rotate (ball1.vx,
Ball1.vy,
Sin,
Cos,
True );
// Exchange two speeds
VaR temp: Point = vel0;
Vel0 = vel1;
Vel1 = temp;
Optimization can be performed here, but I will not change it for the sake of code clarity. Now we have gotten rid of a small piece.
If you have a mathematical problem, test the file before and after the modification. The result is the same.
Sound Integration
This book has never mentioned the use of sound.Because sound is not a direct component of an animation, High-quality sound effects
It can make flash videos more authentic and fascinating.
We can use different methods to add sound. Back to the earliest program version of Flash IDE, we have
A special way to use sound-import sound to the library, Then add it to the frame.This is not what I want to introduce
Method. I will introduce some basics of using sound in as 3.
The sound class of as 3 has changed a lot, and there are several additional classes that can help us to repair it.
Decoration. There is not much space for further discussion, But there is one aspect that I think will be useful for our book.
Very useful. This means that when an event occurs in an animation, the sound should be played. The most obvious thing is collision. One
When a ball hits a wall or another ball, we can hear a bang, a snap, or something. Therefore, I
, ,
We need to master the ability to enable sound through ActionScript.
In this example, we need to return to bouncing2.as, and the ball will collide with the wall. Every time a wall is hit,
I want it to sound. For new classes, see soundevents..
First, sound effects are required. There are many free audio effects resources on the Internet. Among them, the most popular flash sound
The website is flashkit. Apart from loop, their audio files also have a sound effect library.
Www.flashkit.com/soundfx /. These effects are classified into cartoon, interfaces, mechanical, and so on.
This website has more than 6,000 sound effects files, so you should be able to find your own sound effects. We can
Find your favorite file and download it in MP3 format. Set
To preview the page directly (PreView)
It is saved to the hard disk and stored in the same directory as the final video.
Sometimes we need to give the file a simpler name. For example, I downloaded a "boing" sound
Rename it boingpipeline.
The basis for using sound in as 3 is actually simpler than that in as 2.
First, we need to create a sound object. Assume that a variable named boing has been declared in the class:
Private var boing: sound;
Creating a sound object is as simple as this:
Boing = new sound ();
Of course, like most as 3 classes, the sound class is also in the package, Flash. Media package, so ensure that the pilot
Enter flash. Media. Sound.
The simplest way to connect an external sound object is to input a request in the constructor ).
Just like reading an external image (chapter 4), we cannot directly input the URL of an external sound file. But
Package it into URLRequest (flash.net. URLRequest, which needs to be imported ). It should be like this:
Boing = new sound (New URLRequest ("boingpipeline "));
That's all. Now the sound is ready. What we need to do is:
Mysound. Play ();
This sound is played wherever it is. There are some optional parameters in play, such as the offset in milliseconds and playing
The number of times, but by default, the sound is played from the starting position of the sound, which already meets our general needs.
The following is all soundevents. As code, which shows the creation of a sound object. Whenever a ball hits the wall,
All play the sound.
Package {
Import flash. display. Sprite;
Import flash. Events. event;
Import flash. Media. sound;
Import flash.net. URLRequest;
Public class soundevents extends sprite {
Private var ball: ball;
Private var VX: number;
Private var Vy: number;
Private var bounce: Number =-0.7;
Private var boing: sound;
Public Function soundevents (){
Init ();
}
Private function Init (): void {
Boing = new sound (New URLRequest ("boingpipeline "));
Ball = new ball ();
Ball. x = stage. stagewidth/2;
Ball. Y = stage. stageheight/2;
VX = math. Random () * 10-5;
Vy =-10;
Addchild (ball );
Addeventlistener (event. enter_frame, onenterframe );
}
Private function onenterframe (Event: Event): void {
Ball. x + = VX;
Ball. Y + = Vy;
VaR left: Number = 0;
VaR right: Number = stage. stagewidth;
VaR top: Number = 0;
VaR bottom: Number = stage. stageheight;
If (ball. x + ball. radius> right ){
Boing. Play ();
Ball. x = right-ball. radius;
VX * = bounce;
} Else if (ball. X-ball. radius <left ){
Boing. Play ();
Ball. x = left + ball. radius;
VX * = bounce;
}
If (ball. Y + ball. radius> bottom ){
Boing. Play ();
Ball. Y = bottom-ball. radius;
Vy * = bounce;
} Else if (ball. Y-ball. radius <top ){
Boing. Play ();
Ball. Y = Top + ball. radius;
Vy * = bounce;
}
}
}
}
Test the film... ... When you hear your voice, you will feel different. Of course, find the correct
In the correct environment, do not add too much, because it is also an art.
(If You Want To reprint it, please specify the source at http://blog.sina.com.cn/jooi. Thank you)