flash - ActionScript 3 多实例，同名，问题

Question

我正在尝试创建一个网格，用户可以在其中“绘制”并将网格方块的颜色更改为选定的颜色。

在这段代码中，我正在创建带有正方形的网格。我有“工作”的功能，但它只在最后一个正方形实例上工作。

我如何让它在所有方块上工作，而不仅仅是最后一个？

谢谢你能给我的任何帮助。

京东-

package {
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.text.TextField;


public class ClassBoxColor extends MovieClip {
    public var boxColor = "0xFFFFFF";
    public var lineColor = "0x666666";

    public function ClassBoxColor() {

        // ****Create the Grid****
        var xpos:Number;
        var xposStart:Number = 20;  // Initial Placement of grid along x axis
        var ypos:Number = 100;      // Initial Placement of grid along y axis
        var xNum:Number = 10;       // Size of Grid across in squares
        var yNum:Number = 10;       // Size of Grid across in squares

        for (var yaxis:Number = 1; yaxis <= yNum; yaxis++) {
            xpos = xposStart;
            for (var xaxis:Number = 1; xaxis <= xNum; xaxis++) {
                // Draw the square
                var colorBox:Sprite = new Sprite();
                colorBox.graphics.beginFill(boxColor, 1 );
                colorBox.graphics.lineStyle(1, lineColor);
                colorBox.graphics.drawRect(0,0,20,20);
                colorBox.x = xpos;
                colorBox.y = ypos;
                colorBox.buttonMode = true;
                addChild(colorBox);
                xpos += 20;
            }
            ypos += 20;
        }

        // LISTENERS

        Grey_btn.addEventListener(MouseEvent.CLICK, setGrey);           // This button instance is onstage
        DarkGrey_btn.addEventListener(MouseEvent.CLICK, setDarkGrey);   // This button instance is onstage

        stage.addEventListener(MouseEvent.MOUSE_DOWN, drawColor);
        stage.addEventListener(MouseEvent.MOUSE_UP, stopDrawColor);
        colorBox.addEventListener(MouseEvent.CLICK, changeColor);

        // FUNCTIONS & ACTIONS

        Grey_btn.buttonMode = true;
        DarkGrey_btn.buttonMode = true;

        CurrentBoxColor_txt.text = boxColor;// Display the currently selected color in the CurrentBoxColor_txt instance textfield that is onstage

        function setGrey(event:MouseEvent):void {
            boxColor = "0xCCCCCC";
            CurrentBoxColor_txt.text = boxColor;
        }
        function setDarkGrey(event:MouseEvent):void {
            boxColor = "0x666666";
            CurrentBoxColor_txt.text = boxColor;
        }
        function changeColor(event:MouseEvent):void {
            colorBox.graphics.clear();
            colorBox.graphics.lineStyle(1, lineColor);
            colorBox.graphics.beginFill(boxColor, 1);
            colorBox.graphics.drawRect(0,0,20,20);
            colorBox.graphics.endFill();
        }
        function drawColor(event:MouseEvent):void {
            //colorBox.addEventListener(MouseEvent.MOUSE_DOWN, changeColor);
            colorBox.addEventListener(MouseEvent.ROLL_OVER, changeColor);
        }
        function stopDrawColor(event:MouseEvent):void {
            //colorBox.removeEventListener(MouseEvent.MOUSE_DOWN, changeColor);
            colorBox.removeEventListener(MouseEvent.ROLL_OVER, changeColor);
        }
    }
}

}

score 3 · Accepted Answer

不能说我曾经使用过 AS，但是.. 你不应该在 for 中添加监听器吗？您正在覆盖colorBox每次迭代，所以最后只有最后一个会被它引用（这是我要咆哮它甚至可以编译的地方，因为 colorBox 似乎可以超出范围；我的 C 程序员正在哭泣）。

score 0 · Accepted Answer

我对 AS3 很陌生，但看起来你的问题是当你初始化你的方块时。并在 colorBox 上调用 changeColor()。您只有一个可以玩的颜色框，而不是您想要的 10 个（？）。下面不是最好的解决方案，但它最接近您当前代码库的解决方案。

制作一个名为 colorboxArray 的数组并将您的颜色框添加到其中。

var colorBoxArray:Array = new Array();
 for (var yaxis:Number = 1; yaxis <= yNum; yaxis++) {
         xpos = xposStart;
         for (var xaxis:Number = 1; xaxis <= xNum; xaxis++) {
         // Draw the square
          var colorBox:Sprite = new Sprite();
          colorBoxArray[yaxis] = colorBox;
          ..
          colorBoxArray[yaxis].addEventListener(MouseEvent.CLICK, changeColor);
          ..
 }

并在 colorBoxArray[IdOfTheBoxYouWantToChangeColorOn] 上调用 changeColor

一个更好的方法是将上面的所有函数移到一个名为“Box”的类中，并在上面的创建循环中创建 Box 类的实例，将侦听器添加到所有盒子和集合中。我喜欢数组虽然;(

score 0 · Accepted Answer

未经测试但应该可以工作...使用 MouseEvent::buttonDown 来查看按钮是否按下...

package {
    import flash.display.MovieClip;
    import flash.display.Sprite;
    import flash.events.MouseEvent;
    import flash.text.TextField;


    public class ClassBoxColor extends MovieClip {
        public var boxColor = "0xFFFFFF";
        public var lineColor = "0x666666";

        public function ClassBoxColor() {

            // ****Create the Grid****
            var xpos:Number;
            var xposStart:Number = 20;      // Initial Placement of grid along x axis
            var ypos:Number = 100;          // Initial Placement of grid along y axis
            var xNum:Number = 10;           // Size of Grid across in squares
            var yNum:Number = 10;           // Size of Grid across in squares

            for (var yaxis:Number = 1; yaxis <= yNum; yaxis++) {
                xpos = xposStart;
                for (var xaxis:Number = 1; xaxis <= xNum; xaxis++) {
                    // Draw the square
                    var colorBox:Sprite = new Sprite();
                    colorBox.graphics.beginFill(boxColor, 1 );
                    colorBox.graphics.lineStyle(1, lineColor);
                    colorBox.graphics.drawRect(0,0,20,20);
                    colorBox.x = xpos;
                    colorBox.y = ypos;
                    colorBox.buttonMode = true;
                    addChild(colorBox);
                    colorBox.addEventListener(MouseEvent.CLICK, changeColor);
                    colorBox.addEventListener(MouseEvent.ROLL_OVER, changeColor);
                    xpos += 20;
                }
                ypos += 20;
            }

            // LISTENERS

            Grey_btn.addEventListener(MouseEvent.CLICK, setGrey);                   // This button instance is onstage
            DarkGrey_btn.addEventListener(MouseEvent.CLICK, setDarkGrey);   // This button instance is onstage

            // FUNCTIONS & ACTIONS

            Grey_btn.buttonMode = true;
            DarkGrey_btn.buttonMode = true;

            CurrentBoxColor_txt.text = boxColor;// Display the currently selected color in the CurrentBoxColor_txt instance textfield that is onstage

            function setGrey(event:MouseEvent):void {
                boxColor = "0xCCCCCC";
                CurrentBoxColor_txt.text = boxColor;
            }
            function setDarkGrey(event:MouseEvent):void {
                boxColor = "0x666666";
                CurrentBoxColor_txt.text = boxColor;
            }
            function changeColor(event:MouseEvent):void {
                if ((event.type == MouseEvent.CLICK) || (event.buttonDown)) {
                    colorBox.graphics.clear();
                    colorBox.graphics.lineStyle(1, lineColor);
                    colorBox.graphics.beginFill(boxColor, 1);
                    colorBox.graphics.drawRect(0,0,20,20);
                    colorBox.graphics.endFill();
                }
            }
        }
    }
}

一般来说，我认为你的方法不是很干净......你的班级依赖于一些 Grey_btn 和 DarkGrey_btn 以及其他外部事物......这是不好的风格......真的......还有一些我不知道的东西完全理解，但是好吧...这可能是我的错... :)

无论如何，祝你好运...... ;)

问候

back2dos

score 0 · Accepted Answer

你真的需要对整个课程进行返工。您在构造函数中直接定义了所有代码和方法，未定义一些实例名称等。我对您如何编译它感兴趣。作为旁注，不要将 Class 放在您的 AS 类的名称中。

您需要的是一个 ColorBox 类，它可以处理非常简单的东西，例如翻转等，以自行管理颜色。将框的创建/放置留在单个 ColorBox 类之外。

这是在 Flash Player 10 中工作正常的同一类的返工。我将事物分为两个类。您开始使用的一些名称/样式仍在使用中。我没有重写每一行。

ColorBox 是一个盒子。就是这样。它除了管理颜色之外什么都不做。

ColorBoxRoot 是文档根类。将您的 FLA 设置为此类并让我们撕开。打开一个新的fla进行测试。我剥离了按钮代码以及文本字段代码，但在文本字段曾经所在的位置添加了跟踪。

希望这可以帮助！

//ColorBox.as

包 { 导入 flash.display.MovieClip; 导入 flash.display.Sprite；导入 flash.events.*；

[Event(name="colorChange")]
public class ColorBox extends MovieClip{
//  CONSTANTS
    public static const COLOR_CHANGE:String = "colorChange";
    public static const DEFAULT_WIDTH:uint = 20;
    public static const DEFAULT_HEIGHT:uint = 20;

//  PROPERTIES
    private var _boxColor:uint = 0xFFFFFF;
    public function get boxColor():uint{ return _boxColor; }

    private var _lineColor:uint = 0x666666;

//  CONSTRUCTOR
    public function ColorBox(){
        addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
    }

//  EVENT LISTENERS
    private function onAddedToStage(event:Event):void{
        stage.addEventListener(MouseEvent.MOUSE_DOWN, setGrey);
        stage.addEventListener(MouseEvent.MOUSE_UP, resetColors);

        updateDisplay();

        addEventListener(MouseEvent.ROLL_OVER, setGrey);
        addEventListener(MouseEvent.ROLL_OUT, setDarkGrey);
    }

//  PRIVATE METHODS
    private function resetColors(event:Event=null):void{
        _boxColor = 0xFFFFFF;
        updateDisplay();
    }

    private function setGrey(event:MouseEvent):void {
        _boxColor = 0xCCCCCC;
        updateDisplay();
        dispatchEvent(new Event(COLOR_CHANGE));
    }
    private function setDarkGrey(event:MouseEvent):void {
        _boxColor = 0x666666;
        updateDisplay();
        dispatchEvent(new Event(COLOR_CHANGE));
    }

    private function updateDisplay():void {
        graphics.clear();
        graphics.lineStyle(1, _lineColor);
        graphics.beginFill(_boxColor, 1);
        graphics.drawRect(0,0,20,20);
        graphics.endFill();
    }
}

}

//ColorBoxRoot.as

包{导入flash.events.Event；导入 flash.display.MovieClip；

/**
 * Document root class; Create a new FLA (empty) and set this class as the document root
 */
public class ColorBoxRoot extends MovieClip{
//  STAGE OBJECTS
    //public var Grey_btn:DisplayObject;
    //public var DarkGrey_btn:DisplayObject;

//  CONSTRUCTOR
    public function ColorBoxRoot(){
        addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
    }

//  EVENT LISTENERS
    /**
     * Called once the swf stage is ready
     */
    private function onAddedToStage(event:Event):void{
        initializeUI();
        createGrid();
    }

//  PRIVATE METHODS
    /**
     * Always try to initialize your UI in a method so you can recall it later to "reset" things, if needed
     */
    private function initializeUI():void{
        //Grey_btn.buttonMode = true;
        //DarkGrey_btn.buttonMode = true;
    }

    /**
     * Creates the ColorBox grid
     */
    private function createGrid():void{
        var xpos:Number;
        var xposStart:Number = 20;      // Initial Placement of grid along x axis
        var ypos:Number = 100;          // Initial Placement of grid along y axis
        var xNum:Number = 10;           // Size of Grid across in squares
        var yNum:Number = 10;           // Size of Grid across in squares
        var colorBox:ColorBox;

        for (var yaxis:Number = 1; yaxis <= yNum; yaxis++) {
                xpos = xposStart;
                for (var xaxis:Number = 1; xaxis <= xNum; xaxis++){
                        // Draw the square
                        colorBox = new ColorBox();
                        colorBox.addEventListener(ColorBox.COLOR_CHANGE, onBoxColorChange);
                        colorBox.name = "box" + xaxis + "_" + yaxis; //jcbii: give it an identifiable name; just for fun
                        colorBox.x = xpos;
                        colorBox.y = ypos;
                        addChild(colorBox);
                        xpos += ColorBox.DEFAULT_HEIGHT; //jcbii: never hardcode these values; use dynamic values as much as possible
                }
                ypos += ColorBox.DEFAULT_WIDTH; //jcbii: never hardcode these values; use dynamic values as much as possible
        }
    }

    private function onBoxColorChange(event:Event):void{
        trace(event.target.name, ColorBox(event.target).boxColor);
    }
}

}

flash - ActionScript 3 多实例，同名，问题

4 回答 4

Related

Reference