FLASH MX2004体验二：定制组件外观

flashmx2004自带的组件比mx美丽了很多, 但有功夫为了让组件的表面和所有页面包车型的士款式相一致, 必需从新变换组件的表面, 比方组件标签的字体和脸色, 组件的后台脸色之类. 这个flashmx自己是做不到的.

       变换组件表面有三种本领: use the styles api(运用款式api), apply a theme(运用一个主提名), 和modify or replace a component's skins(窜改或替代组皮肤). 这边提防证明第一种本领, use the styles api(application programming interface). 咱们不妨运用styles api 供给的属性和本领( setstyle()和getstyle())来变换组件的脸色和文本方法.

       个中运用styles又有四种本领:      1．set styles on a component instance. (对一个组件范例树立款式)      2．use the _global style declaration that sets styles for all components in a document.(运用全部款式证明对文书档案的一切组件树立款式)      3．create custom style declarations and apply them to specific component instances.(创造自设置款式证明并运用到指定的组件范例)      4．create default class style declarations.(为组件类型创造款式证明)           下面临每一种本领举行详解.

            set styles on a component instance (对一个组件范例树立款式).

       从components面板拖个button 组件加入景(也不妨用其它组件)，并定名为”mybtn”:

       赶快键”f9”翻开action面板，在功夫线上写action:

mybtn.setstyle("themecolor", "0x00ccff");mybtn.setstyle("fontfamily", "verdana");mybtn.setstyle("fontsize", "10");mybtn.setstyle("fontweight", "bold");mybtn.setstyle("color", "0x990000");

       ctrl+enter 预览功效，组件款式是否变换了？底下是默许的款式和方才自设置款式的功效比较图：

      use the _global style declaration that sets styles for all components in a document.(运用全部款式证明对文书档案的一切组件树立款式)        

       flashmx2004的_global东西的style属性不妨做到这一点：  从components面板拖n 个组件加入景，这边我用的是button，checkbox和radiobutton 三个组件，也不要给组件定名，径直在功夫线上写action:          

_global.style.setstyle("themecolor", "0x00ccff");_global.style.setstyle("fontfamily", "verdana");_global.style.setstyle("fontsize", "10");_global.style.setstyle("fontweight", "bold");_global.style.setstyle("color", "0x990000");

      ctrl+enter 预览功效.底下是这三个组件的前后功效比较图：

       这种本领使得场景里的一切组件的表面维持普遍.

      create custom style declarations and apply them to specific component instances.(创造自设置款式证明并运用到指定的组件范例)

       当咱们把组件拖加入景里便不妨运用cssstyledeclaration 东西创造一个款式证明来变换指定组件的表面。仍旧从components面板拖button，checkbox和radiobutton三个组件加入景并辨别定名为compa, compb, compc. 在功夫线上写action:

//创造一个cssstyledeclaration东西范例var styleobj = new mx.styles.cssstyledeclaration;//树立stylename属性styleobj.stylename = "newstyle";//将款式放到全部款式列表_global.styles.newstyle = styleobj;//树立款式属性styleobj.fontfamily = "verdana";styleobj.fontsize = "10";styleobj.fontweight = "bold";styleobj.color = "0x990000";styleobj.setstyle("themecolor", "0x00ccff");//对组件树立款式compa.setstyle("stylename", "newstyle");compb.setstyle("stylename", "newstyle");compc.setstyle("stylename", "newstyle");

      下图为三个组件运用款式后的功效:

      create default class style declarations.(为组件类型创造款式证明)

       这种本领为场景内某一典型的组件设置款式，只对此类型灵验。先写action:

//为button典型的组件设置款式var btn = _global.styles.button=new mx.styles.cssstyledeclaration();btn.fontfamily = "verdana";btn.fontsize = "12";btn.fontweight = "bold";btn.color = "0x000000";//为checkbox典型的组件设置款式var cb = _global.styles.checkbox=new mx.styles.cssstyledeclaration();cb.fontfamily = "tahoma";cb.fontsize = "12";cb.fontweight = "bold";cb.color = "0x990000";//为radiobutton典型的组件设置款式var rb = _global.styles.radiobutton=new mx.styles.cssstyledeclaration();rb.fontfamily = "arial";rb.fontsize = "12";rb.fontweight = "bold";rb.color = "0x003399";

      而后辨别拖3个(个数按照须要而定)button组件，checkbox组件，radiobutton组件加入景。预览功效如次图:

      用styles api 设置组件表面的四种本领引见结束，呵呵，是否很象用css设置html表单东西的款式？

     [注：之上例子只对flash v2 component灵验]

      经过学袭用css方法化flash文本和用款式证明变换组件表面，大师大概发觉到mm正在用flash制造一个和html一律的平台，呵呵，刮目相待~!