Изображение, добавленное поверх кнопки, блокирует MouseEvent, почему?

Question

Привет всем, сегодня у меня проблема в том, что у меня есть пара кнопок, которые скользят вверх и вниз, когда в поднятом состоянии я добавляю изображение X, обозначающее кнопку закрытия.Однако изображение X, похоже, блокирует действие моей кнопки.

_{(источник: flickr.com)}

У меня есть пример в фильме Я работаю над >> здесь <<.Здесь есть 2 фильма, самый большой: если вы щелкнете любую синюю вкладку, вы увидите, о чем я говорю, появится кнопка X, но нажатие на область X не приведет к опусканию кнопки.Вам нужно нажать на синюю область кнопки, чтобы опустить кнопку обратно.

Теперь я сделал тестовый видеоролик меньшего размера, добавив кнопку X практически таким же образом, и, если вы заметили, она работает нормально (анимируется вправо, даже если вы нажмете на изображение X)

Вот мой код в Большом фильме (Я скрыл код анимации, чтобы он не был таким длинным):

function handleButtonClick(event:MouseEvent):void {
var button:MovieClip=event.target as MovieClip;
var id:Number=Number(button.name.split("button")[1]);

dispatchEvent(new CustomEvent(CustomEvent.PAUSE_MOVIE, {}));

if (! $btn1&&! $btn2) {
    if (storeButton2==buttons[id]) {
        closeTabX.x = buttons[1].width - (closeTabX.width + 10);
        closeTabX.y=buttons[1].height/2-15;
        buttons[1].addChild(closeTabX); // X added here
        $btn2=true;
        $btn1=false;
    } else if (storeButton1 == buttons[id]) {
        closeTabX.x = buttons[0].width - (closeTabX.width + 10);
        closeTabX.y=buttons[0].height/2-15;
        buttons[0].addChild(closeTabX); // X added here
        $btn1=true;
        $btn2=false;
    }
} else if ($btn1 && !$btn2) {
    if (storeButton2==buttons[id]) {
        buttons[0].removeChild(closeTabX); // X removed here
        buttons[1].addChild(closeTabX); // X added here
        $btn2=true;
        $btn1=false;
    } else if (storeButton1 == buttons[id]) {
        buttons[0].removeChild(closeTabX); // X removed here
        $btn1=false;
    }
} else if ($btn2 && !$btn1) {
    if (storeButton2==buttons[id]) {
        buttons[1].removeChild(closeTabX);
        $btn2=false;
    } else if (storeButton1 == buttons[id]) {
        buttons[1].removeChild(closeTabX); // X removed here
        buttons[0].addChild(closeTabX); // X added here
        $btn1=true;
        $btn2=false;
    }
}

}

Вот код моего основного тестового фильма:

var blueButton:MovieClip;
var closeBtnX:MovieClip;

blueButton = new BlueButton;
blueButton.buttonMode = true;

closeBtnX = new CloseTabX;
closeBtnX.x = blueButton.width/2 - closeBtnX.width;

addChild(blueButton);


blueButton.addEventListener(MouseEvent.MOUSE_UP, specialClick);

function specialClick(event:MouseEvent):void
{
  blueButton.addChild(closeBtnX); // X added here
  blueButton.x = blueButton.x+10;
}

Я не понимаю, почему вы не можете нажать X в основном примере, чтобы закрыть вкладку, но можете в моем маленьком базовом фильме?Мысли, идеи?

Answer 1

вы не написали, как создаете экземпляр closeTabX в первом примере. Это тот же класс, что и меньший пример (CloseTabX)?

Простое «исправление» заключается в том, что если вы установите его свойства следующим образом, оно не будет блокировать события мыши для своего родителя:

closeTabX.mouseEnabled = false;
closeTabX.mouseChildren = false;

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