Flash clock
2003-7-28 14:12:29
Effect Description Small noisy knowledge points for flash 1. fs command2. Simple Avascript3. Basic Action Script4. Movie Clip control See the real-time clock made with Flash? Do a beautiful Flash clock on the desktop, don't be too cool! Prepare the work to start Flash MX, press Ctrl J to set the size and background color. In order to make more precise, select the [Show grid] command under the [Grid] menu in the [View] menu to display the grid. At the same time, select the [RULERS] command under the [View] menu to display the ruler. Making clocks and each component will be prepared to make clock components. Click New Symbol command under the INSERT menu to create a new icon (Ctrl F8), named "Clock," and enter the icon editing window. Select a circle tool in the tool panel, the round border and fill colors can be set according to personal preferences. Press and hold the Shift key to draw a positive circle in the editing area, set the size in the properties panel: w: 200, H: 200, the ring radius is 100. Then press CTRL K to adjust the alignment panel (align). Press the To Stage button on the right of the bottom side, then click on the Align Horizontal Center and the Align Vertical Center. As shown in Figure 1. At this point, you can see the center of the circle coincide with the cross line of the scene center. as shown in picture 2. Figure 1 Figure 2 With an arrow tool Click to select the inside, press SHIFT F9 to call up the Color Mixer panel and set the padding mode to Radial gradient padding. Gradient is selected, as shown in Figure 3. (Due to the limited space, the production of beautification can only be brought.) Figure 3 Next, make a bell scale. The new layer is named "Scale". Draw a small vertical line with a linear tool and set the vertical line size of 4. Press F8 to convert the small vertical line into a graphic, named "Small Tightening". Double-click the small vertical line to enter the editing state. Set the position x: 0, Y: -100 (100 is a circle radius) in the properties panel. Back to "Clock" icon editing status. Drag the "Small Scale" icon causes the center position to coincide with the clock surface. As shown in Figure 4. Figure 4 Figure 5 Select the [Transform] command in the [Windows] menu, or press Ctrl T directly to call up the Transform panel. Set the rotation angle Totate to 30 degrees. Then click the Copy and Apply Transform button. Rotate the minor scales and copy 12 times. Considering a few important point points, delete 3, 6, 9, 12, and create a "large scale" icon with the same method. Different, when drawing small vertical line, the size of the line is set to 6. Then return to the "clock" icon editing state. Continue to press the steps of rotation, but the rotation angle is set to 90 degrees. Then click the text tool in the Tools panel to enter numbers at several critical points. The final resulting clock surface renderings are shown in Figure 6. Figure 6 hours face, now makes a clockwise, division and second needle, respectively. Select the [New Symbol] command under the [Insert] menu, select the Movie Clip radip radip in the pop-up dialog box and set the movie clip name "hour. As shown in Figure 7.
Figure 7 Figure 8 Click the circular tool in the tool panel to drag an ellipse in the editing area, then hold down the CTRL button, drag a tapered on the upper edge of the elliptical. As shown in Figure 8. Next, the "division" and "second needles" two movie clamps are established in the same way. The only difference is that the second needle score is long, and the minute should be pressed. The components of the assembly clock clock have been done, and each component is now assembled. Back to the main scene, press the F11 callout library (library) panel. Drag the clock icon to the main scene and name the current layer "clock". In order to ensure the accuracy of the production, a vertical reference line is dragged out of the mouse to the right at the scales of the left. Also drag out a horizontal reference line downward at the scale scale. The center of the clock icon followed by the intersection of the two reference lines. Note: During the above operation, pay attention to select the Snap to Object button. Create a new layer, named "Hall", drag the "hour hand" movie clip in the library to the main scene, set the center point center point at the center of the hour, the setting method is: Click the zoom tool to drag the center point directly Go to the target location. Then move the center point of the center of the heart with the center point of the center. The needle points to 12 time points. Newly construct a "division" and "second needles" two layers, the operation method is the same as "hour hand" layer. In addition, "clock" layer is at most, followed by "division", and then "second needle". The resulting rendering is shown in Figure 9. The frame in each layer is inserted into the frame in the F5, and each layer is extended to the second frame. Figure 9 Add the AS clock has been made, how to let the hour needle, minute and second needle move. Now add ActionScript to Flash. The new layer is named "ActionScript". Add the following Action code in the first frame: Time = New Date (); // Get system date Hours = time.getHours (); // Get system hours minutes = time.getminutes (); // Get system minutes Seconds = Time.getSeconds (); // Get the system seconds IF (Hours> 12) {hours = Hours-12;} if (Hours <1) {hours = 12;} Hours = Hours * 30 Int (Minutes / 2); // Calculate the angle of rotation of time-rotation MINUTES = Minutes * 6 INT (Seconds / 10); // Calculate the angle of the split rotation seconds = seconds * 6; // Calculate the angle code of the second needle rotation basically has been annotated Here, it will be described here: Because the system has a 24-hour meter, the clock here is only 12 hours, only 12 hours. In addition, the 0 point of the system is 12 points of the clock. Next, insert the keyframe in the second frame, insert the key frame, add the following ACTION code: gotoandplay (1); Can the clock go? ? Not yet, there is also one of the most important steps.
