Flash production of dynamic trigonometric diagram courseware

Source: Internet
Author: User
Tags functions generator interface sin
Dynamic | functions using Flash MX 2004 to make trigonometric function image generators is very simple, here we use the sine wave as an example, look at how to implement a functional image in Flash.

First to analyze the function of this generator, in the main interface of the program input box, enter the corresponding amplitude, frequency or initial phase value, and then press the "Sin" button, the axis and a dynamically generated function curve, if you modify the corresponding input values, The generator also generates a different color function curve based on the original image, which makes it easier for people to understand the changes in the function image caused by different values, so that the user can understand the meaning of the trigonometric formula more clearly. A . fla file is provided at the end of the article for you to download reference.

The results are as follows, you can try the actual effect of the courseware according to the above description:

The specific steps to make this sin function image Builder are as follows:

  The first step is to make components

Four components are required in this generator. Two button components, one is to start generating the button "sin", one is to clear the image button "clear"; two movie clips, a clip with a pencil tool in the center of the edit area to draw a point, because in the use of a large number of copies of this point, so that the point connected to the function curve, so the size is appropriate, In another movie clip, draw the planar rectangular coordinate system.

  The second step is to design the scene interface

The scene is preceded by three input text boxes, which are used to enter different values. text box to the left with "static text" to identify the role of three "input text" box, from top to bottom is, amplitude, frequency and initial phase, these three "input text" box variable name first and next in turn is "hight", "Freq", "C". Then drag the "sin" and "clear" buttons from the library to the appropriate location. Write "Y =< space >sin (< space >X+< space >)" on the right with "static text", then place the three dynamic text boxes in the spaces to display the specific formulas for the trigonometric functions you have entered, and the variable names of the three dynamic text boxes from left to right are "QQ", "ww", "ee". These make up the main interface of this image generator.

  Step three, add code

In this generator, a total of six layers of four frames are required, and the layers can be modified as needed.

The first layer is the background layer.
The second layer is the coordinate layer, where the second frame of the layer is inserted into the keyframe, and then the frame is dragged into the coordinate component and placed in an area outside the scene, and the "instance name" of the component is called "Zuobiao".
The third layer drags the "dot" element in, the instance name is "Point1", and the fourth layer is the code layer, which is used to write the program, and the four frames of this layer are all converted to keyframes.
The remaining two layers are used to place the buttons and the various text boxes mentioned in the previous step.
More than a few layers can be easy to modify later, so when you do flash should pay attention to this detail, do not put all the content into a layer.

  

Let's start by writing a bit of code to generate the function curve, and notice that we're going to write all the code in the Code layer.

  First Frame code:

k=20000; Set the initial value of a partial variable
j=0;,

  Second Frame code:

i = 0;
Draw = 1;
j=j+1; Defining variables
Duplicatemovieclip ("Point1", "point", 67778);
SetProperty ("Point", _x, 320);
SetProperty ("Point", _y, 240); The "dot" clip "point1" outside the scene is copied into a clip named "Point" placed in the middle of the scene
Xpos = _root.point._x;
Duplicatemovieclip ("Zuobiao", "Zuobiao1", 1);
SetProperty ("Zuobiao", _x,220);
SetProperty ("Zuobiao", _y,240)//edit the coordinate clip "Zuobiao" outside the scene into a clip named "Zuobiao1" placed in the middle of the scene
Xpos = _root.point._x;
Ypos = _root.point._y;
Stop ();


   Third Frame code:

Do {//through the loop, a large number of copies of "Point", through the SIN function constraints,//so that these points distribution on a reasonable curve to form a sine wave
Duplicatemovieclip ("point", "point" +i, K);
SetProperty ("point" +i, _x, i-22);
xx = GetProperty ("point" +i, _x);
SetProperty ("point" +i, _y,ypos-hight*math.pi*10*func ((xx/(math.pi*10)) *freq));
V=c% (2*MATH.PI);
SetProperty ("point" +i, _x, I-(v*math.pi*10)-196);
BodyColor = new Color ("point" +i); Make the curves that are generated by pressing the "sin" button a different color to make the curve clearer
R = (j%5) +1;
if (r = = 1) {
Bodycolor.settransform ({rb:255,bb:0,gb:0});
}
else if (r = = 2) {
Bodycolor.settransform ({gb:255,rb:0,bb:0});
}
else if (r = = 3) {
Bodycolor.settransform ({rb:255,gb:255,bb:0});
}else if (r = = 4) {
Bodycolor.settransform ({gb:255,bb:255,rb:0});
} else {
Bodycolor.settransform ({bb:255,rb:255,gb:255});
}
i = i+1;
k++;
draw = draw+1;
while (DRAW&LT;=20);

   Fourth Frame code:

if (number (i) >=1060) {//gives the loop a constraint, the program stops at the appropriate time
gotoAndPlay (2);
k-=2400;
} else {
Draw = 1;
gotoAndPlay (3);
}

   code for the "Sin" button:

On (release) {//Press button The rear screen displays a specific formula for generating a sine curve,//and begins to generate the execution function generation curves.
Qq=hight;
Ww=freq;
Ee=c;
func = Math.sin;
gotoAndPlay (3);
}

   The code for the "clear" button

On (release) {//Clear all curves that have occurred
for (n=0;n<=1060;n++)
{Removemovieclip ("point" +n);
k+=2400;
};
}

This generator program works in both Flash MX 2004 and Flash MX two versions. Because consideration may not be very thoughtful at the time of writing, some values need to be modified in other environments. . fla File Download



Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.