Flex中利用自定义图片代替CheckBox自带的图标的例子

By Minidxer | August 10, 2008

CheckBox的选中和取消的两个图标可谓是千年不变……印象中从Windwos31到Windows Vista以及各种开发工具中的CheckBox，都是一样的Style。Flex中的CheckBox允许我们改变这一点。接下来的例子演示了Flex中如何利用自定义图片代替CheckBox自带的图标。

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


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

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Script>
  8.         <![CDATA[
  9.             [Bindable]
  10.             [Embed(source="assets/icon_accept.gif")]
  11.             public var AcceptIcon:Class;
  12.  
  13.             [Bindable]
  14.             [Embed(source="assets/icon_alert.gif")]
  15.             public var AlertIcon:Class;
  16.         ]]>
  17.     </mx:Script>
  18.  
  19.     <mx:CheckBox id="checkBox"
  20.             label="Custom icon test (selected={checkBox.selected})"
  21.  
  22.             disabledIcon="{AlertIcon}"
  23.             downIcon="{AlertIcon}"
  24.             overIcon="{AlertIcon}"
  25.             upIcon="{AlertIcon}"
  26.  
  27.             selectedDisabledIcon="{AcceptIcon}"
  28.             selectedDownIcon="{AcceptIcon}"
  29.             selectedOverIcon="{AcceptIcon}"
  30.             selectedUpIcon="{AcceptIcon}"
  31.          />
  32.  
  33. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Flex | No Comments » | Tags: , ,

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

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll