Flex中如何通过设置各寄宿控件visible属性控制RichTextEditor控件的各寄宿控件显示与否的例子

By Minidxer | December 29, 2008

接下来的例子演示了Flex中如何通过设置各寄宿控件visible属性，控制RichTextEditor控件的各寄宿控件显示与否。

让我们先来看一下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.             import mx.controls.CheckBox;
  10.  
  11.             private function checkBox_change(evt:Event):void {
  12.                 var ch:CheckBox = evt.currentTarget as CheckBox;
  13.                 richTextEditor[ch.data].visible = ch.selected;
  14.             }
  15.         ]]>
  16.     </mx:Script>
  17.  
  18.     <mx:ApplicationControlBar dock="true" verticalAlign="top">
  19.         <mx:Form styleName="plain">
  20.             <mx:FormItem label="fontFamilyCombo.visible:">
  21.                 <mx:CheckBox selected="true"
  22.                         data="fontFamilyCombo"
  23.                         change="checkBox_change(event);" />
  24.             </mx:FormItem>
  25.             <mx:FormItem label="fontSizeCombo.visible:">
  26.                 <mx:CheckBox selected="true"
  27.                         data="fontSizeCombo"
  28.                         change="checkBox_change(event);" />
  29.             </mx:FormItem>
  30.             <mx:FormItem label="toolBar2.visible:">
  31.                 <mx:CheckBox selected="true"
  32.                         data="toolBar2"
  33.                         change="checkBox_change(event);" />
  34.             </mx:FormItem>
  35.             <mx:FormItem label="colorPicker.visible:">
  36.                 <mx:CheckBox selected="true"
  37.                         data="colorPicker"
  38.                         change="checkBox_change(event);" />
  39.             </mx:FormItem>
  40.             <mx:FormItem label="alignButtons.visible:">
  41.                 <mx:CheckBox selected="true"
  42.                         data="alignButtons"
  43.                         change="checkBox_change(event);" />
  44.             </mx:FormItem>
  45.             <mx:FormItem label="bulletButton.visible:">
  46.                 <mx:CheckBox selected="true"
  47.                         data="bulletButton"
  48.                         change="checkBox_change(event);" />
  49.             </mx:FormItem>
  50.             <mx:FormItem label="linkTextInput.visible:">
  51.                 <mx:CheckBox selected="true"
  52.                         data="linkTextInput"
  53.                         change="checkBox_change(event);" />
  54.             </mx:FormItem>
  55.         </mx:Form>
  56.  
  57.         <mx:Spacer width="100%" />
  58.  
  59.         <mx:Form styleName="plain">
  60.             <mx:FormItem label="_RichTextEditor_VRule1.visible:">
  61.                 <mx:CheckBox selected="true"
  62.                         data="_RichTextEditor_VRule1"
  63.                         change="checkBox_change(event);" />
  64.             </mx:FormItem>
  65.             <mx:FormItem label="_RichTextEditor_VRule2.visible:">
  66.                 <mx:CheckBox selected="true"
  67.                         data="_RichTextEditor_VRule2"
  68.                         change="checkBox_change(event);" />
  69.             </mx:FormItem>
  70.         </mx:Form>
  71.     </mx:ApplicationControlBar>
  72.  
  73.     <mx:RichTextEditor id="richTextEditor"
  74.             width="100%"
  75.             height="100%" />
  76.  
  77. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

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

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

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll