2.14.處理focusIn和focusOut事件

2024-04-27 13:51:47

字體：大中小

供稿：網(wǎng)友

2.14.1. 問(wèn)題
我想要在用戶聚焦在一個(gè)標(biāo)簽上時(shí)，顯示一個(gè)彈出窗口，并且當(dāng)用戶離開(kāi)聚焦的時(shí)候關(guān)閉這個(gè)彈出窗口。
2.14.2. 解決辦法
使用focusIn 和focusOut 事件（在InteractiveObject 類的子類的所有實(shí)例都可用）來(lái)調(diào)用PopUpManager 相關(guān)的方法。
2.14.3. 討論
在用戶聚焦時(shí)啟動(dòng)一個(gè)窗口，你可以重用前兩節(jié)的代碼。不過(guò)就是把彈出窗口的啟動(dòng)從用戶點(diǎn)擊LInkButton 切換到通過(guò)focusIn 事件來(lái)創(chuàng)建而已。組件接受到聚焦的時(shí)候就會(huì)發(fā)布focusIn 事件，例如當(dāng)用戶按tab 切換到組件上或者點(diǎn)擊了它。focusIn 事件的處理代碼只需要在之前章節(jié)的內(nèi)容添加一點(diǎn)：

-ActionScript

systemManager.removeFocusManager(IFocusManagerContainer(popup))

對(duì)應(yīng)的上下文：

-XML

<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Canvas horizontalCenter="0" verticalCenter="0">
<mx:LinkButton id="lbl" label="Top" x="100" y="10"
focusIn="showDetail(event)" focusOut="closePopUp()"/>
<mx:LinkButton label="Left" x="10" y="100"
focusIn="showDetail(event)" focusOut="closePopUp()"/>
<mx:LinkButton label="Bottom" x="100" y="200"
focusIn="showDetail(event)" focusOut="closePopUp()"/>
<mx:LinkButton label="Right" x="200" y="100"
focusIn="showDetail(event)" focusOut="closePopUp()"/>
<mx:Canvas width="100" height="100" x="125" y="40"
backgroundColor="#ff0000" rotation="45">
</mx:Canvas>
</mx:Canvas>
<mx:Script>
<![CDATA[
import mx.managers.IFocusManagerContainer;
import mx.managers.PopUpManager;
private const POPUP_OFFSET:int = 10;
private var popup:CustomPopUp;
private function showDetail(evt:FocusEvent):void {
// create the popup
popup =
CustomPopUp(PopUpManager.createPopUp(this,CustomPopUp,false));
popup.message = "This is the detail for " +
evt.target.label;
// position the popup
var pt:Point = new Point(0, 0);
pt = evt.target.localToGlobal(pt);
popup.x = pt.x + POPUP_OFFSET;
popup.y = pt.y + evt.target.height + POPUP_OFFSET;
systemManager.removeFocusManager(IFocusManagerContainer(popup))
}
private function closePopUp():void {
PopUpManager.removePopUp(popup);
}

]]>
</mx:Script>
</mx:Application>