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

By Minidxer | July 24, 2009

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

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


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

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <FxApplication name="FxHSlider_skinClass_test"
  3.         xmlns="http://ns.adobe.com/mxml/2009"
  4.         backgroundColor="white">
  5.     <layout>
  6.         <BasicLayout />
  7.     </layout>
  8.  
  9.     <FxHSlider id="slider"
  10.             showDataTip="false"
  11.             horizontalCenter="0"
  12.             verticalCenter="0"
  13.             skinClass="CustomFxHSliderSkin" />
  14.  
  15. </FxApplication>

下面是CustomFxHSliderSkin.mxml的代码：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <SparkSkin name="BitmapGraphicThumbSkin"
  3.         xmlns="http://ns.adobe.com/mxml/2009">
  4.  
  5.     <states>
  6.         <State name="up" />
  7.         <State name="over" />
  8.         <State name="down" />
  9.         <State name="disabled" />
  10.     </states>
  11.  
  12.     <Metadata>
  13.         [HostComponent("mx.components.FxButton")]
  14.     </Metadata>
  15.  
  16.     <BitmapGraphic id="bg"
  17.             source="@Embed('asterisk_yellow.png')"
  18.             left="-4"
  19.             top="-4" />
  20.  
  21. </SparkSkin>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: FxHSlider, Gumbo | No Comments » | Tags: ,

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

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll