Flex中如何通过backgroundAlpha样式设置RichTextEditor控件内TextArea的背景颜色透明度的例子

By Minidxer | August 27, 2008

前面的Flex中如何通过backgroundColor样式设置RichTextEditor控件内TextArea的背景颜色的例子中，我们了解了Flex中如何通过backgroundColor样式，设置RichTextEditor控件内TextArea的背景颜色。接下来的例子则演示了Flex中如何通过backgroundAlpha样式，设置RichTextEditor控件内TextArea的背景颜色透明度。

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


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

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application name="RichTextEditor_textArea_backgroundAlpha_test"
  3.         xmlns:mx="http://www.adobe.com/2006/mxml"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <mx:Script>
  9.         <![CDATA[
  10.             import mx.events.ColorPickerEvent;
  11.             import mx.events.SliderEvent;
  12.  
  13.             private function colorPicker_change(evt:ColorPickerEvent):void {
  14.                 richTextEditor.textArea.setStyle("backgroundColor", evt.color);
  15.             }
  16.  
  17.             private function slider_change(evt:SliderEvent):void {
  18.                 richTextEditor.textArea.setStyle("backgroundAlpha", evt.value);
  19.             }
  20.         ]]>
  21.     </mx:Script>
  22.  
  23.     <mx:ApplicationControlBar dock="true">
  24.         <mx:Form styleName="plain">
  25.             <mx:FormItem label="backgroundColor:">
  26.                 <mx:ColorPicker id="colorPicker"
  27.                         selectedColor="0xFFFFFF"
  28.                         change="colorPicker_change(event);" />
  29.             </mx:FormItem>
  30.             <mx:FormItem label="backgroundAlpha:">
  31.                 <mx:HSlider id="slider"
  32.                         minimum="0.0"
  33.                         maximum="1.0"
  34.                         value="1.0"
  35.                         snapInterval="0.01"
  36.                         tickInterval="0.1"
  37.                         liveDragging="true"
  38.                         change="slider_change(event);" />
  39.             </mx:FormItem>
  40.         </mx:Form>
  41.     </mx:ApplicationControlBar>
  42.  
  43.     <mx:RichTextEditor id="richTextEditor" />
  44.  
  45. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Flex | Tags: , , , , ,

Related Post

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll

Sponsored Ads