Flex 4 меняет изображение при наведении курсора мыши - не работает функция перемычки при быстром наведении курсора?

Question

У меня есть основное наведение мыши в моем приложении flex, которое изменяет изображение на mouseover и снова меняет его на moutout, используя код mouseOver="functionToChangeImageSource()", а другое на mouseout.

Работает нормально, когда вы медленно наводите курсор мыши вверх и вниз, однако, если я быстро перемещаю курсор мыши по нему, он иногда остается на изображении при наведении курсора, и функция mouseout не срабатывает. Могу ли я что-нибудь исправить , или у кого-нибудь есть идеи, почему это происходит?

Кроме того, я пробовал использовать rollOver и rollOut, но у них одна и та же проблема.

Код выглядит следующим образом (я переключил его, чтобы скрыть и показать два изображения при наведении курсора мыши, чтобы убедиться, что это решило проблему, но это не так):

        <mx:Image source="images/logout.jpg"  
              left="0"
              top="350"
              top.dataViewState="470"
              id="logoutimg"
              includeIn="dataViewState, dataDayViewState" 
              rollOver="logoutimg_mouseOverHandler(event)"
              click="doLogout()"
               />

    <mx:Image source="images/logoutover.jpg"  
              left="0"
              top="350"
              top.dataViewState="470"
              id="logoutoverimg"
              includeIn="dataViewState, dataDayViewState" 
              rollOut="logoutoverimg_mouseOutHandler(event)"
              visible="false"
              click="doLogout()" />

А функции следующие:

protected function logoutimg_mouseOverHandler(event:MouseEvent):void
        {
            logoutimg.visible = false;
            logoutoverimg.visible = true;
        }


        protected function logoutoverimg_mouseOutHandler(event:MouseEvent):void
        {
            logoutoverimg.visible = false;
            logoutimg.visible = true;
        }

Я полагаю, что вы правы насчет того, что событие mouseover не завершилось до того, как Mouseout завершилось, но как это исправить?

Answer 1

Вам лучше использовать этот однострочный код

    <mx:Image source="images/logout.jpg"  
          left="0"
          top="350"
          top.dataViewState="470"
          id="logoutimg"
          includeIn="dataViewState, dataDayViewState" 
          rollOver="event.currentTarget.source = 'images/logoutover.jpg'" 
          rollOut="event.currentTarget.source = 'images/logout.jpg'"
          click="doLogout()"
           />

Answer 2

Недавно мы столкнулись с той же проблемой, и единственное реальное решение, по-видимому, состоит в замене изображений на кнопку и замене ее скинов вверх, вниз, над и отключенными на встроенные версии изображений.

Answer 3

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

Но главная проблема здесь в том, что вы делаете это неправильно.

Вам не нужно 2 изображения, достаточно одного изображения и измените атрибут источника:

    <mx:Image source="images/logout.jpg"  
      left="0"
      top="350"
      top.dataViewState="470"
      id="logoutimg"
      includeIn="dataViewState, dataDayViewState" 
      rollOver="logoutimg_mouseOverHandler(event)"
      rollOut="logoutoverimg_mouseOutHandler(event)"
      click="doLogout()"
       />



    protected function logoutimg_mouseOverHandler(event:MouseEvent):void
{
    logoutimg.source="images/logoutover.jpg";
}


protected function logoutoverimg_mouseOutHandler(event:MouseEvent):void
{
    logoutimg.source="images/logout.jpg";
}

Изменить: Если вы видите мерцание, попробуйте синтаксис embed . Вы также можете сделать это с помощью Flex Css и атрибутов hover (код не требуется).

Answer 4

Если вы просто используете mouseUp и mouseDown, единственная проблема, с которой вы столкнетесь, это когда пользователь нажимает на изображение вниз, а затем, удерживая мышь нажатой, четко отводит мышь от изображения.В этом случае изображение остается в версии mouseDown.Чтобы исправить это, вам также необходимо включить условие rollOut, которое возвращается к изображению mouseUp.Теперь все базы покрыты.