Flex Gumbo中如何通过skinClass样式自定义FxButton的Skin的例子

By Minidxer | July 21, 2009

接下来的例子演示了Flex Gumbo中如何通过skinClass样式，自定义FxButton的Skin。

让我们先来看一下Demo（可以点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <FxApplication name="FxButton_skinClass_test"
  3.         xmlns="http://ns.adobe.com/mxml/2009"
  4.         backgroundColor="white">
  5.     <layout>
  6.         <BasicLayout />
  7.     </layout>
  8.  
  9.     <FxButton label="FxButton"
  10.             horizontalCenter="0"
  11.             verticalCenter="0"
  12.             skinClass="MyExternalSkin" />
  13.  
  14. </FxApplication>

下面是MyExternalSkin.mxml的代码：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <Skin xmlns="http://ns.adobe.com/mxml/2009" resizeMode="scale">
  3.  
  4.     <states>
  5.         <State name="up"/>
  6.         <State name="over"/>
  7.         <State name="down"/>
  8.         <State name="disabled"/>
  9.     </states>
  10.  
  11.     <Metadata>[HostComponent("mx.components.FxButton")]</Metadata>
  12.  
  13.     <Path data.up="M 0 0 L 10 0 L 10 10 L 0 10 Z"
  14.             data.over="M 0 0 L 20 0 L 20 20 L 0 20 Z"
  15.             data.down="M 0 0 L 30 0 L 30 30 L 0 30 Z">
  16.         <fill>
  17.             <SolidColor color="#000000"/>
  18.         </fill>
  19.     </Path>
  20.  
  21. </Skin>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: FxButton, Gumbo | 2 Comments » | Tags: , ,

你可能还对下列文章感兴趣:

2 comments | Add One

  1. lxlcx201 - 10/28/2010 at 5:59 pm

    能给我所有的demo吗 ？非常感谢

Trackbacks

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll