Flex组件开发总结（转自大家网）

最新推荐文章于 2024-09-23 17:45:04 发布

原创最新推荐文章于 2024-09-23 17:45:04 发布 · 130 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Flex #UP #Blog #HTML

本文介绍了Flex应用程序开发中几个实用的技巧，包括监听键盘事件、控制RichTextEditor的控制栏、处理双击事件、在TextArea的光标位置插入字符以及保持滚动条始终处于最下方的方法。

1.如何监听键盘事件？

<mx:TextArea id="textEditor" keyDown="sendKeyHandler(event)" x="11" y="366" width="399"/>

private function sendKeyHandler(evt:KeyboardEvent):void
{
      //Enter 键
      if (evt.keyCode == 13)
      {
         this.sendTxt();
         return ;
      }
}

代码说明：有两种类型的键盘事件：KeyboardEvent.KEY_DOWN 和 KeyboardEvent.KEY_UP

以上是监听的是回车事件

要是想监听组合键，例如：Ctrl+Enter 键，代码如下：

if (evt.keyCode == 13 && evt.ctrlKey)
{
}

2.怎么控制RichTextEditor的控制栏？

利用showControlBar属性，控制RichTextEditor的控制栏,这样把整个控制栏都关闭了

要是想分别控制控制栏中各寄宿控件，可以参考如下代码：

this.textEditor.alignButtons.height=0;
this.textEditor.alignButtons.visible=false;

this.textEditor.bulletButton.height=0;
this.textEditor.bulletButton.visible=false;

this.textEditor.linkTextInput.height=0;
this.textEditor.linkTextInput.visible=false;

this.textEditor._RichTextEditor_VRule1.height=0;
this.textEditor._RichTextEditor_VRule1.visible=false;

this.textEditor._RichTextEditor_VRule2.height=0;
this.textEditor._RichTextEditor_VRule2.visible=false;

当然，还可以参考这文章

http://blog.minidx.com/2008/12/29/1841.html

3.控件双击事件(DoubleClick Event)怎么没反应？

<mx:Button doubleClickEnabled="true" doubleClick="doubleClickHandler(event)" x="48" y="32" label="Button"/>

private function doubleClickHandler(evt:MouseEvent):void
{
Alert.show("doubleClick");
}

代码说明：

doubleClickEnabled属性：指定对象是否接收 doubleClick 事件。默认值为 false，这意味着在默认情况下，不接收 doubleClick 事件。如果将 doubleClickEnabled 属性设置为 true，实例在其范围内接收 doubleClick 事件

4.怎么在TextArea的光标位置插入字符?

<mx:TextArea id="textEditor" x="11" y="366" width="399"/>

private function insertString(insertStr:String):void
{
if (this.textEditor.selectionBeginIndex == this.textEditor.selectionEndIndex)
{
      var startPart:String=this.textEditor.text.substring(0, this.textEditor.selectionBeginIndex);
      var endPart:String=this.textEditor.text.substring(this.textEditor.selectionEndIndex, this.textEditor.text.length);
      startPart+=insertStr;
      startPart+=endPart;
      this.textEditor.text=startPart;
}
else
{
      this.textEditor.text=insertStr;
}
}

5.实现TextArea控件的滚动条始终保持在最下面?

this.txt_content.addEventListener(FlexEvent.VALUE_COMMIT,VALUE_COMMITHandler);
private function VALUE_COMMITHandler(evt:FlexEvent):void{
      txt_content.verticalScrollPosition = txt_content.maxVerticalScrollPosition;
}

代码说明：这段代码是为了实现TextArea控件的滚动条始终保持在最下面,以方便用户查看聊天信息

要是VBox控件需要实现类似效果，可以看如下代码：

<mx:VBox id="vd" updateComplete="updateCompleteHandler(event)" x="10" y="10" width="399" height="348">

private function updateCompleteHandler(evt:FlexEvent):void
{
this.vd.verticalScrollPosition=this.vd.maxVerticalScrollPosition;
}