Согните изображение мышью

Question

У меня есть следующий код, который показывает изображение, а когда мышь над ним, измените его.

  <mx:Image source="{ConfigApp.getResourcesPath()}/img.jpg" id="imgOne"   
  mouseOver="imgOne.source=ConfigApp.getResourcesPath()+'/img_over.jpg'"
  mouseOut="imgOne.source=ConfigApp.getResourcesPath()+'/img.jpg'"/>

У меня 2 проблемы:

1-й: Если я быстро проведу мышью по изображению, иногда состояние изображения с изображением mouseOver (не обнаруживает событие mouseOut).

2-й: в тот момент, когда мышь находится, есть несколько миллисекунд, когда изображение отсутствует, поэтому оно выглядит как белая вспышка каждый раз, когда мышь заканчивается.

Answer 1

2-й выпуск: при загрузке изображения каждый раз эта вспышка ухудшается при удаленном подключении.вместо этого создайте изображение в классе и переключите ссылку на класс.

[Embed(source="/assets/imageOver.png")]
public static const overImage:Class;
[Embed(source="/assets/img.png")]
public static const image:Class;

Затем переключите их следующим образом ...

<mx:Image source="{image}" id="imgOne"   
  mouseOver="imgOne.source=overImage"
  mouseOut="imgOne.source=image"/>

Answer 2

Я бы предпочел сделать что-то подобное, это решит все проблемы:

[Bindable] public var isOurMouse:Boolean = false;

<mx:Canvas>
    <mx:Image source="{ConfigApp.getResourcesPath()}/img.jpg"
        mouseOver="isOurMouse = true"
        mouseOut="isOurMouse = false"/>
    <mx:Image source="{ConfigApp.getResourcesPath()}/img_over.jpg"
        mouseEnabled="false" mouseChildren="false"
        visible="{isOurMouse}"/>
</mx:Canvas>

Кстати, если вы хотите, чтобы ваше изображение не вспыхивало при перезагрузке, у вас должно быть два изображения, одно на другое, фон которого перезагружается только после того, как передний план завершил загрузку. На самом деле ваше изображение блестит, но вы его не видите:

<mx:Canvas>
    <mx:Image id="imgBkg"/>
    <mx:Image id="imgFrg"
        source="{something}"
        complete="imgBkg.source = imgFrg.source"/>
</mx:Canvas>