Open flash MX
In 2004, press Ctrl+F8 to create a new movie clip named "Window". Then draw a window interface in the main stage. (As shown below, 1, the size is 550*400, how to draw it? Draw whatever you want! )
Note: the interface design should not be too fancy, but it should have a main color. I use light green here.
It is not recommended to use dazzling colors, because the whole courseware should be coordinated. Too dark makes people feel depressed, too bright hurts their eyes, and moderate is best.
Style depends on personal preference, for example, I like window style. There are also many people who like windowless ones. It's up to you. My page has a title bar at the top, a button control area on the right and some explanation information at the bottom.
After the initial completion, drag and drop it into the scene to coincide with the stage. And in the Attribute column, enter: window in the instance name.
Second, after the interface is completed, you should make interactive buttons.
Generally, we need to make 3-4 buttons:
1. Control the screen size and close button of the courseware (named close_btn, fullscreen _ BTN, small _ BTN);
2. General buttons to respond to courseware content and related operations (because you can change them into buttons such as "play", "stop" and "music" by adding a name to them);
3. Temporary buttons: mainly used for temporary interaction in courseware.
Detailed production method (don't think I'm verbose):
1. Click Insert to create a new component, or press crtl+F8.
Name it "Button", select "Button" as the type, and confirm. Buttons have four frames: up (normal state), past (the way the mouse moves up), down (the way the mouse clicks down) and click (it doesn't matter what color here, it only limits the working range of the mouse). In addition, you can add some sounds to this button, which will ring when you press it. To do this, click File-Import Sound. Sound exists in the library. Create a new layer on the button graph, insert a keyframe in the Press frame, and drag the sound from the library to the editing window. (Actually, there are many sound settings, so there is no need to make too many settings here, so I won't go into details. )
2. Make four different frames according to your own ideas, so that your colorful buttons can be made. Gradient colors (both linear and radial) are recommended.
3. Drag and drop the button into the interface, name it and enter the text.
Double-click the "Interface" component in the library to enter the editing state of the "Interface" of the movie clip, create a new layer, name it "Button", drag the finished button from the library to a suitable position and place it neatly. Enter: (excluding the following Chinese characters) in the Instance Name in the Attribute column.
Full Screen _btn Full Screen Close _btn Close Play _btn Play Stop _btn Pause Return _btn
Back to Music _btn Music Practice _btn Practice Score _btn Score Help _btn Help Exit _btn.
. Create a new layer and name it Button Text. Use the text tool to enter the name of the button above (as shown in the following figure):
4. Enter a script control statement for each button:
Create a new layer and name it "Script". Press F9 to bring up the action panel (in case of FLASH MX, select "Expert Mode"), and then enter the following code in the blank space:
full screen _ BTN . on release = function(){
///on release means clicking and releasing the function.
Fscommand ("fullscreen ",true)//fscommand is a command statement, and full screen is full screen.
}
close _ BTN . on release = function(){
Fscommand ("quit ",true)//quit means exit.
}
play_btn.onRelease=function(){
_root.play() // Play _root. Represents the main scene, and this prefix is added to control the main time axis, the same below.
}
stop_btn.onRelease=function(){
_root.stop() // Stop
}
back_btn.onRelease=function(){
_root.gotoAndStop("mulu ")
//Return to the directory frame (you can find the "Label" column in the property panel of the directory frame in the courseware, and enter: mulu will have a small red flag and the word mulu in the timeline).
}
music _ BTN . on release = function(){
Musiccontrol.play() // Here is a music control movie clip, which will be introduced later.
}
practice _ BTN . on release = function(){
_ root。 Go and stop ("Practice")//Jump to the practice content (the frame label is Practice).
}
score _ BTN . on release = function(){
Score_mc。 _visible=true // Set the scoreboard to be visible, and the production of scoreboard will be introduced later.
}
help_btn.onRelease=function(){
Helpcontrol.play() // Set the visible and hidden controls of help information, which will be introduced later.
}
After the input is completed, click the small tick above to check whether there are any mistakes in the script. If there is an error prompt, please check it carefully and enter it correctly. Until the prompt "This script has no errors".
Third, make a movie clip that realizes background music control, scoreboard and help information panel.
By the way, it is suggested to set up several folders in the library to facilitate the management of many movie clips.
Click the folder icon in the lower left corner of the library panel to create a folder in the library. Various movie clips can be classified and stored: for example, create three folders of "sound", "button" and "panel section", and then drag the corresponding components into them. To use the components inside, just double-click the folder icon.
1, making background music control elements.
Import a music file in mp3/wav format, not too big, preferably 1-4m. After importing, a small icon will appear in the library panel and drag it to the sound folder.
Create a new movie clip and name it "Music". Drag the music you just imported to the editing window, click the first frame, and in the property panel, select "Data Stream" from the "Synchronization" drop-down menu (as shown below, in order to make the music play with the frame easy to control), and then insert a frame around 700 frames (not a key frame! ! ), if the music is about 1 minute, it will take 720 frames. Do the math yourself. There is no blue waveform until your last frame, which means the music is just there.
Create a new movie clip and name it "Music Control". In the frame action of the first frame, enter:
Stop ()
Music_mc.play() // Let the music play.
Insert a key frame in the second frame and enter:
Stop ()
Music_mc.stop() // Stop music.
Double-click the interface component in the library to enter the editing state, and create a new layer named Music. Drag the movie clips Music and musiccontrol that you just made to any position in the workspace and name them music_mc and Music Control respectively. At this point, the control elements of the background music are ready. You can click the "Music" button in the interface to control it. Press Ctrl+Enter to test it!
2, making scoreboard components
This requires the use of "dynamic text", which is a kind of text that can change characters at any time as needed and dynamically display scores.
Create a new movie clip and name it "Scoreboard". Draw the board first, and pay attention to the main interface. And enter the number of each group in the appropriate place in the text.
Create a new layer, name it "Fraction", click the T text tool, set it as "Dynamic Text" in the property bar, frame six text areas under the panel group name, and select "Variable" as s 1-s6 respectively, as shown in the figure:
Make another plus button and minus button (the steps will not be detailed), and drag and drop it to the appropriate position of the scoreboard six times. Examples are: jia 1_btn, JIA 1 _ BTN, jia2_btn, jian2_btn …
... as shown in the figure:
Create a new layer, open the Frame Action panel, and enter the following six similar codes:
a 1 = 0；
Jia 1 _ BTN . on release = function(){
a 1++； //Increment per click 1.
s 1 = a 1；
};
Jian 1 _ BTN . on release = function(){
a 1-； //Decrease per click 1
s 1 = a 1；
}
… …
(The above buttons are 1 group, you can add five more! Just change 1 to 2,3,4,5,6. Be careful, and check it later if you lose it. )
Finally, drag a button to close the scoreboard and put it in the upper right corner. The instance is named close_btn, and a column is added to the frame action panel:
close _ BTN . on release = function(){
_parent。 _visible=false // indicates that the previous level (i.e. scoreboard) is invisible.
}
At this point, the scoreboard has been completed. In the Library panel, double-click the interface to open its editing status.
Create a new layer, name it Scoring, drag the completed scoreboard component to the appropriate location in the scene, and enter score_mc in the instance name.
. Please test your scoreboard again! Ha ha!
3, making help information components
This is very simple. Create a new movie clip, name it "Help Information", draw a 450*20 rectangle, and then add a dynamic text to it. Think of variables as helptxt.
Creating a new movie clip is similar to music control, with only two frames: help control.
The first frame action: stop ()
Help_mc。 _visible=true // Help is visible.
The second frame action: stop ()
Help_mc。 _visible=false // Help is invisible.
When the two are finished, double-click the Interface in the library to enter the editing state, create a new layer, name it Help, and drag the Help Information you just made to the lower column of the interface. Enter: help_mc in the instance name, and then drag "helpcontrol" into the instance name: Help Control.
.
To display help information in real time, you need to add some code. Click the first frame of "Interface" and enter:
Near BTN. OnRollover = function () {//OnRollover indicates that an event is triggered when the mouse moves over the button.
Help_mc.helptxt= "Prompt: click to close this courseware "//Assign a value to the variable helptxt of dynamic text, the same below.
}
full screen _ BTN . on rollover = function(){
Help_mc.helptxt= "Tip: Click on the full screen to display the courseware"
}
small _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click on the small screen to display this courseware"
}
play _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click to play the courseware."
}
stop _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click to pause the courseware."
}
back _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click to return to the courseware directory."
}
music _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click to play or stop the background music."
}
score _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click to enter the group grading system."
}
practice _ BTN . onrollover = function(){
Help_mc.helptxt= "Tip: Click to enter the exercise."
}
quit_btn.onRollOver=function){
Help_mc.helptxt= "Tip: Click to exit the courseware"
}
In addition, sometimes if you want to display the time on the courseware, you can add a dynamic text with variables: mytime. And input in the frame action of the frame in which it is located:
Function showtime(){
Var time=new Date() // Get the system time string.
My time = substring (time, 1 1, 9)// Only minutes and seconds are intercepted.
}
Setinterval (showtime,100)/100 milliseconds.