Use Flash CS3 and Flex 3 to allow programmers and designers to work collaboratively to separate coding and design.

Source: Internet
Author: User

The benefits of coding and design are obvious:

I,CodeEasy to maintain and perform secondary development. All as code is organized outside the Flash based on the object-oriented idea and can be opened using notepad. Compared with the traditional As2, Which is scattered between frames and earlier on films and buttons, its advantages are self-evident.

2. The design is independent of the Code. You canProgramWhen the program (system) is modified, you can also create a new number of theme. The program is not changed, but you can change the image, position, size, and so on, so that you can quickly get a new look. For example, it is easy to add some seasonal elements during the Spring Festival.

This example shows how to enable as programmers and designers to use flex and flash for collaborative development. Ideally, designers only design, as programmers only write code, changing the work content of each other does not affect the other party or the impact is extremely low. In this demo, we can't see a line of ActionScript code in the flash file.
Software requirements: Flash CS3 professional, flex builder 3 Professional
Flex3and flashcs3football match demo.swf

Football field demo-flash-source-code jointly developed by flex3 and flashcs3

Football field demo-Flex-source-code jointly developed by flex3 and flashcs3

To continue reading the following content, please download the source code first.

Open the Flash file and click the blank area. On the property panel, you can see that the document class has been directed to com. pmggroup. ebiz. footballfield. documentclass. There are two video editing instances in the Flash file: oneball and txtbtn. The names of the two clips must be defined in the attribute Panel of the Flash file, but not in the document class. The documentclass has the following description:

// Cannot be defined as follows:
// Public var oneball: ball;
// Public var txtbtn: textbutton;

Note: whether the component name is defined in public mode depends on whether the video instance is automatically created in the Flash video attribute.

When you click txtbtn, we need to change the tooltip of football. This logic is added in the document class. The Code is as follows:

Txtbtn. addeventlistener (
Mouseevent. Click,
Function (Event: mouseevent): void {
Trace ("try change tooltip outside .");
Footfield. oneball. tooltip = "Modify football outside .";
}
);

Txtbtn is not defined in the document class. It is specified in the flash file. This is the first requirement for flash design. All non-static and behavioral video clips must have an English name. This principle is not only applicable to the home scene, but also applies to video editing. Open the library panel. footballfield is a football video clip. In this clip, there is an instance of footballproxy named oneball.

When a football player in the demo is dragged, the football player is rolled, and the scroll stops when the mouse is released. The scroll animation is defined separately when the football element is used. It is extremely simple, but it only rotates in a circle within 30 frames. This is the second requirement for flash design: the video editing design should be simple, and a video editing should only do one thing or a group of related things. In the timeline of a video clip, only the animation of an object is defined. If the video clip behavior is complex, it is divided into several small video clips, such as footballproxy.

In the Flash file, there is a textbutton. The class of this component is bound to com. pmggroup. ebiz. footballfield. textbutton. Demo. It is intended to indicate that the button must inherit from simplebutton. During development, we advocate that all components are movieclip and must be inherited from uimovieclip. Inherited from uimovieclip is intended to be used in flex.

In the footballproxy component, there is a dynamic text. The class corresponding to the dynamic text is flash. Text. textfield. This component adds a dynamic text box to remind programmers that if the flash component uses the components provided by flash itself, it must be introduced into the class of its components. View the following code in the binding class com. pmggroup. ebiz. footballfield. footballproxy of footballproxy:

Import flash. Text. textfield;

View the flex source code. There is no content in it. There is only one reference to the directory where the flash file is located. The role of this project is to write the ActionScript using Flex. It is too inconvenient to use flash encoding. Using FLEX can significantly improve development efficiency. Because the code is Flex-encoded, reference is useless, as shown in figure

Flash. Text. textfield, with smart sensing, flex will automatically clear it, resulting in the following error during flash Compilation:

1046: The type cannot be found, or it is not the compile time: textfield.

The error shows code behavior 0. This error prompt does not make any sense for programmers to debug.

To sum up, coding and design separation have requirements for designers and programmers:

1. for designers, all non-static and behavioral video clips in the main scenario and in complex video clips must have an English name.

2. For a designer, only one thing or a group of related things is required for a video clip.

3. For programmers, use the document class to bind a flash main scenario, and customize the class to bind a video clip with behaviors in flash.

The complete separation of coding and design is an ideal state. It requires programmers to have a deep understanding of the idea of object-oriented development. It also requires designers to understand the principles of collaborative development, it also has the ability to simplify complex video editing and transform it to zero. It is easier for designers and programmers to collaborate after they understand each other's development habits.

Programmers do not need to make exquisite ideas and designs, but they need to come up with a framework. Designers do not need to write as code, but they also need to understand the programmer's intention. The role of a programmer here is not only the role of ActionScript programmer, but also the role of a front-end analysis architect.

From: http://blog.sban.com.cn/2008/03/20/flex3-flash-cs3-work-together-code-design-separate.html

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.