ActionScript 3 multiistanza, stesso nome, domanda
-
12-09-2019 - |
Domanda
Sto cercando di creare una griglia in cui gli utenti possono 'disegnare' attraverso di esso e cambiare i colori dei quadrati della griglia per un colore scelto.
In questo codice, sto creando la griglia con quadrati. Ho la funzionalità di 'lavoro', ma sta funzionando solo sull'ultimo piazza istanziato.
Come faccio a farlo funzionare su tutte le piazze, non solo l'ultimo?
Grazie per tutto l'aiuto che potete dare.
JD -
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);
}
}
}
}
Soluzione
Hai davvero bisogno di una rielaborazione su questo tutta la classe. Avete tutto il codice e metodi definiti direttamente nel costruttore, alcuni nomi di istanza non definita, ecc Sono interessato a come avete ottenuto questo per compilare. Come sidenote, non mettere classe in nome della classe AS.
Quello che dovete avere è una classe che gestisce ColorBox cose molto semplici come rollover, ecc per gestire il colore di per sé. Lasciare la creazione / posizionamento della scatola esterna della classe singola ColorBox.
Qui è una rielaborazione della stessa classe lavorando bene in Flash Player 10. ho separato le cose in due classi. Alcuni dei nomi / stile si è iniziato con sono ancora in gioco. Non ho riscrivere ogni singola riga.
ColorBox è una scatola. Questo è tutto. E non fa altro che gestire il colore.
ColorBoxRoot è la classe principale del documento. Impostare il FLA per questa classe e let'er rip. Aprire un nuovo fla da testare. Ho messo a nudo il codice del pulsante, nonché il codice di campo di testo, ma ha aggiunto in una traccia in cui il campo di testo usato per essere.
Spero che questo aiuti!
// ColorBox.as
package { import flash.display.MovieClip; import flash.display.Sprite; flash.events importazione *;.
[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
package { import flash.events.Event; import 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);
}
}
}
Altri suggerimenti
Non posso dire che io abbia mai usato come ma .. non si deve aggiungere l'ascoltatore all'interno del per? Stai sovrascrivendo colorBox
con ogni iterazione così, alla fine solo l'ultimo si farà riferimento da esso (questo è dove vorrei inveire che si compila anche, dal momento che sembra colorbox accessibile fuori portata; programmatore C in me piange).
Im abbastanza nuovo con AS3, ma sembra che tu problema è quando si inizializza i tuoi piazze. E chiamando ChangeColor () su colorbox. Hai una sola colorbox cui si gioca in giro con, non 10 come si desidera avere (?). Qui di seguito non è la soluzione migliore per questo, ma il suo più vicino ad una soluzione per la vostra base di codice corrente.
Crea un array chiamato colorboxArray e aggiungi le colorboxes ad esso.
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);
..
}
E non chiamate ChangeColor sul colorBoxArray [IdOfTheBoxYouWantToChangeColorOn]
Un modo migliore per farlo sarebbe quello di spostare tutte le funzioni di cui sopra per una classe denominata "Box", e creare istanze della classe Box nel vostro ciclo di creazione sopra, aggiungere ascoltatori di tutte le scatole e il set. Mi piace array anche se, (
non testato, ma dovrebbe essere di lavoro ... utilizzare MouseEvent :: buttonDown, a guardare, se il pulsante è giù ...
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();
}
}
}
}
}
In generale, penso ci si avvicina non è molto pulito ... la classe non ha dipendenze su alcune Grey_btn e DarkGrey_btn e altre cose esterne ... questo è un cattivo stile ... davvero ... anche ci sono alcune cose che non capisco perfettamente, ma ok ... questo è forse colpa mia ...:)
Buona fortuna comunque ...;)
greetz
back2dos