javascript - 如何抵消createjs按钮助手的点击区域？

我正在使用按钮助手来允许单击显示框和文本区域。如果用鼠标悬停在该框上，则仅可单击该框的2/3。

并且所选区域允许在右侧框的外部。如何正确设置可点击区域？只是盒子是可以点击的

Game Link to see example-灰色方向框位于链接的第二页上。

        self.stage.addChild(titleText);
        var directionsbox = new createjs.Container();
        displaybox = new createjs.Shape();
        displaybox.graphics.beginFill("gray").drawRoundRect(0, 0, 550, 350, 8);
        displaybox.name = "DirectionsBox";
        displaybox.x = 125;
        displaybox.y = 120;

        var label = new createjs.Text("\n" + gameData.Description + "\n\n\nDirections  \n \nThere are 3 levels to complete.  \nEach level gets a bit faster.  \nYour high sccore will automataly be submited to the Arcade. \n\n\nClick here to start sorting.", "bold 20px Arial", "#FFFFFF");
        label.textAlign = "center";
        label.lineWidth = 550;
        label.y = displaybox.y;
        label.x = displaybox.x + 275

        directionsbox.addChild(displaybox, label);
        self.stage.addChild(directionsbox);

        var helper = new createjs.ButtonHelper(displaybox, "out", "over", "down", false, displaybox, "hit");
        helper.y = displaybox.y;
        helper.x = displaybox.x + 275
        displaybox.addEventListener("click", handleClick);
        function handleClick(event) {
            createjs.Sound.play("click");
            self.stage.removeChild(directionsbox);
            StartInteraction();
        }

最佳答案

hitArea的问题在于您正在使用实例，因为它是它自己的hitArea。 HitAreas旨在自动定位其内容。由于您的displaybox已经设置了x / y，因此将其添加到hitArea的位置，该位置已经相对于可见的displayBox定位。

在您的示例中，您只需将ButtonHelper的hitArea参数设置为null。这将使ButtonHelper使用实际的可见内容作为hitArea，效果很好。如果要使用外部实例，则可以克隆DisplayBox，将其x / y设置为0，然后使用它。

// Just use null
var helper = new createjs.ButtonHelper(displaybox, "out", "over", "down", false, null, "hit");

// Use a new instance
var hitbox = displayBox.clone().set({x:0, y:0});
var helper = new createjs.ButtonHelper(displaybox, "out", "over", "down", false, hitbox, "hit");

希望能有所帮助。