makanmel
02.06.2007, 18:33
Есть Canvas с разными контролами (Button, Label, TextArea), который является Tooltip'ом (или Hint'ом) появляющимся при наведении мышки на кнопку.
Нужно, чтобы после наведения (MouseOver), а потом убирания мышки с него (MouseOut) он прятался, а если был клик на нем, то оставался.
Проблема в том, что событие MouseOut возникает при передвижении мышки на другие контролы в пределах Canvas'а (кнопку или текстовое поле), а не только когда мы уберем мышку с самого Canvas'а.
<?xml version="1.0" encoding="utf-8"?>
<RSSTooltipBase
xmlns="controls.*"
xmlns:mx="http://www.adobe.com/2006/mxml"
width="{INITIAL_WIDTH}"
height="{INITIAL_HEIGHT}"
borderStyle="solid"
borderColor="#0000FF"
backgroundColor="#FFFFEE"
cornerRadius="8">
<mx:Label
id="titleLabel"
text="{title}"
textAlign="center"
width="{INITIAL_WIDTH - 20}"
fontSize="12"
fontWeight="bold"
left="0"
top="0"
mouseOut="event.stopPropagation();"/>
<mx:Button
label="x"
width="16"
height="16"
right="2"
top="2"
cornerRadius="8"
click="onCloseClick(event);"
mouseOut="event.stopPropagation();"/>
<mx:TextArea
id="rssField"
htmlText="{description}"
width="{INITIAL_WIDTH - 8}"
height="{INITIAL_HEIGHT - 42}"
bottom="21"
backgroundColor="#FFFFEE"
horizontalCenter="0"
borderStyle="none"
horizontalScrollPolicy="off"
editable="false"
mouseOut="event.stopPropagation();"/>
<mx:TextArea
id="linkLabel"
htmlText="{link}"
textAlign="center"
backgroundColor="#FFFFEE"
color="#000088"
borderStyle="none"
horizontalCenter="0"
width="{INITIAL_WIDTH - 20}"
height="20"
editable="false"
left="0"
bottom="0"
mouseOut="event.stopPropagation();"/>
</RSSTooltipBase>
public function RSSTooltipBase()
{
super();
addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
}
public function close() : void
{
dispatchEvent(new TooltipWindowEvent(TooltipWindowEvent.CLOSE_TOOLTIP));
}
public function onCloseClick(event : MouseEvent) : void
{
close();
}
public function onMouseOver(event: MouseEvent) : void
{
dispatchEvent(new TooltipWindowEvent(TooltipWindowEvent.STOP_CLOSE_TIMER));
removeEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
}
public function onMouseDown(event: MouseEvent) : void
{
removeEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
removeEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
}
public function onMouseOut(event: MouseEvent) : void
{
if (event.eventPhase != 3) close();
}
Пришлось пока написать на всех контролах mouseOut="event.stopPropagation();"
и проверку event.eventPhase.
Я знаю что есть какой-то более элегантный способ, но через поиск не могу найти.
Нужно, чтобы после наведения (MouseOver), а потом убирания мышки с него (MouseOut) он прятался, а если был клик на нем, то оставался.
Проблема в том, что событие MouseOut возникает при передвижении мышки на другие контролы в пределах Canvas'а (кнопку или текстовое поле), а не только когда мы уберем мышку с самого Canvas'а.
<?xml version="1.0" encoding="utf-8"?>
<RSSTooltipBase
xmlns="controls.*"
xmlns:mx="http://www.adobe.com/2006/mxml"
width="{INITIAL_WIDTH}"
height="{INITIAL_HEIGHT}"
borderStyle="solid"
borderColor="#0000FF"
backgroundColor="#FFFFEE"
cornerRadius="8">
<mx:Label
id="titleLabel"
text="{title}"
textAlign="center"
width="{INITIAL_WIDTH - 20}"
fontSize="12"
fontWeight="bold"
left="0"
top="0"
mouseOut="event.stopPropagation();"/>
<mx:Button
label="x"
width="16"
height="16"
right="2"
top="2"
cornerRadius="8"
click="onCloseClick(event);"
mouseOut="event.stopPropagation();"/>
<mx:TextArea
id="rssField"
htmlText="{description}"
width="{INITIAL_WIDTH - 8}"
height="{INITIAL_HEIGHT - 42}"
bottom="21"
backgroundColor="#FFFFEE"
horizontalCenter="0"
borderStyle="none"
horizontalScrollPolicy="off"
editable="false"
mouseOut="event.stopPropagation();"/>
<mx:TextArea
id="linkLabel"
htmlText="{link}"
textAlign="center"
backgroundColor="#FFFFEE"
color="#000088"
borderStyle="none"
horizontalCenter="0"
width="{INITIAL_WIDTH - 20}"
height="20"
editable="false"
left="0"
bottom="0"
mouseOut="event.stopPropagation();"/>
</RSSTooltipBase>
public function RSSTooltipBase()
{
super();
addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
}
public function close() : void
{
dispatchEvent(new TooltipWindowEvent(TooltipWindowEvent.CLOSE_TOOLTIP));
}
public function onCloseClick(event : MouseEvent) : void
{
close();
}
public function onMouseOver(event: MouseEvent) : void
{
dispatchEvent(new TooltipWindowEvent(TooltipWindowEvent.STOP_CLOSE_TIMER));
removeEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
}
public function onMouseDown(event: MouseEvent) : void
{
removeEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
removeEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
}
public function onMouseOut(event: MouseEvent) : void
{
if (event.eventPhase != 3) close();
}
Пришлось пока написать на всех контролах mouseOut="event.stopPropagation();"
и проверку event.eventPhase.
Я знаю что есть какой-то более элегантный способ, но через поиск не могу найти.