schiebepuzzle mit Drag and Drop

[voulontine]

hallöchen, hab da mal bißchen rumgeschaut bezüglich einem schiebepuzzle. allerdings funktionieren die meisten beispiele nur mit click. hat schon mal jemand ein schiebpuzzle programmiert, wo man die puzzleteile dragged (mit eingeschränkten koordinaten) und auf dem leeren puzzlefeld dropped?

anbei das beispielscript, welches ich als tutorial gefunden habe:

///////////////////////// EINLADEN ////////////////////////
// Vorlage Laden, Skalieren und Positionieren
vorlage.loadMovie("images/0.jpg"); vorlage._xscale = 25; vorlage._yscale =25;
vorlage._x = 0;vorlage._y = 200;

// Teile Laden und Positionieren
t1.container.loadMovie("images/1.jpg"); t1._x = 0; t1._y = 0;
t2.container.loadMovie("images/2.jpg"); t2._x = 62; t2._y = 0;
t3.container.loadMovie("images/3.jpg"); t3._x = 124; t3._y = 0;
t4.container.loadMovie("images/4.jpg"); t4._x = 0; t4._y = 62;
t5.container.loadMovie("images/5.jpg"); t5._x = 62; t5._y = 62;
t6.container.loadMovie("images/6.jpg"); t6._x = 124; t6._y = 62;
t7.container.loadMovie("images/7.jpg"); t7._x = 0; t7._y = 124;
t8.container.loadMovie("images/8.jpg"); t8._x = 62; t8._y = 124;
// Teil 9 ist noch nicht dabei

//////////////////////// VORLAGE ////////////////////////
aktiv = false; // Variable, die Spiechert, ob die Vorlage grad angezeigt wird oder nich
vorlage_btn.onRelease = function() {
if(aktiv == false) { // wenns noch nich angeziegt wird--
aktiv = true; // das natürlich zwischenspeichern
vorlage._xscale = 100; // vorlage vergrößern
vorlage._yscale = 100;
vorlage._x = 0; // und über das Schiebefeld legen
vorlage._y = 0;
} else { // wenns bereits angezeigt wird
aktiv = false; // kommt alles wieder zum alten
vorlage._xscale = 25;
vorlage._yscale =25;
vorlage._x = 25;
vorlage._y = 245;
}
}

/////////////////////// VARIABLEN ///////////////////////
t1.nummer = 5; t2.nummer = 9; t3.nummer = 4; t4.nummer = 7; // Zwischenspeicher
t5.nummer = 3; t6.nummer = 8; t7.nummer = 1; t8.nummer = 6; // welches bild wo is

clicked = 0; // das feld, auf dass geklickt wurde
leer = 9; // das aktuell leere feld

///////////////////////// BUTTONS ////////////////////////
but1.onRelease = function() { if(clicked == 0)clicked = 1; } // wenn raufgeklcikt wird,
but2.onRelease = function() { if(clicked == 0)clicked = 2; } // wird in "clicked" fest-
but3.onRelease = function() { if(clicked == 0)clicked = 3; } // gehalten, auf welchen ge-
but4.onRelease = function() { if(clicked == 0)clicked = 4; } // klickt wurde. Das natürlcih
but5.onRelease = function() { if(clicked == 0)clicked = 5; } // nur dann, wenn clicked
but6.onRelease = function() { if(clicked == 0)clicked = 6; } // 0 ist, also kein anderer Button
but7.onRelease = function() { if(clicked == 0)clicked = 7; } // gerade aktiv ist.
but8.onRelease = function() { if(clicked == 0)clicked = 8; }
but9.onRelease = function() { if(clicked == 0)clicked = 9; }

////////////////////// MAIN //////////////////////
bla = 0;
_root.onEnterFrame = function() {
if(t1.nummer == 1 && t2.nummer == 2 && t3.nummer == 3 && t4.nummer == 4 && t5.nummer == 5 && t6.nummer == 6 && t7.nummer == 7 && t8.nummer == 8 && t9.nummer == 9) {
// wenn alles richtig is
vorlage._xscale = 100; // wird die vorlage angezeigt
vorlage._yscale =100;
vorlage._x = 0;
vorlage._y = 0;
Status.text = "FERTIG"; // und ein Textfeld
}
if(clicked != 0) { // wenn auf einen button geklcikt wurede...
obi = eval("t" + clicked); // das objekt evaluereiene,m welches wir bewegen wollen
if(clicked - leer == -3) { // siehe unten
if(bla < 10) {
obi._y += 6; // bewegen
bla++; // anzahlbgrenzung, es wird nur 8 mal bewegt
} else {
obi._name = "t" + leer;
leer = clicked;
clicked = 0;
bla = 0;
}
} else if(clicked - leer == -1) {
if(bla < 10) {
obi._x += 6;
bla++;
} else {
obi._name = "t" + leer;
leer = clicked;
clicked = 0;
bla = 0;
}
} else if(clicked - leer == 1) {
if(bla < 10) {
obi._x -= 6;
bla++;
} else {
obi._name = "t" + leer;
leer = clicked;
clicked = 0;
bla = 0;
}
}
else if(clicked - leer == 3) {
if(bla < 10) {
obi._y -= 6;
bla++;
} else {
obi._name = "t" + leer;
leer = clicked;
clicked = 0;
bla = 0;
}
} else if(clicked == leer) { clicked = 0; }
}
}

[marcus79]

Hallö!
Leider noch nicht, aber den Code den du da hast, kannst du ehrlich gesagt vergessen. Ziemlich übel geschrieben und eine Menge Dinge drin, die absolut keinen Sinn ergeben.

Aber in Sachen Drag und Drop kanst Du Dir unter Umständen mal hittest anschauen... also prinzipiell Kollisionsabfrage beim droppen.
Grüße

[hgseib]

hast du eine frage zu dem script, oder warum hast du ihn veröffentlicht?

ein puzzle zu programmieren ist doch denkbar einfach.
hier eine vorlage für ein einzelnes puzzleteil zum selbst erweitern:

// zuerst rettet man die originalposition von allen puzzleteilen
puzzleteil.originalX = puzzleteil._x;
puzzleteil.originalY = puzzleteil._y;
// dann werden die per zufall verschoben
puzzleteil._x = Math.random()*Stage.width;
puzzleteil._y = Math.random()*Stage.height;
// events
puzzleteil.onPress = function() {
  // angeklicktes puzzle nach oben
  this.swapDepths(100);
  // verschiebbar machen
  this.startDrag();
};
puzzleteil.onRelease = puzzleteil.onReleaseOutside = function() {
  // verschiebbar beenden
  this.stopDrag();
  // testen, obs in der nähe der originalposition steht
  var dx = this._x-this.originalX;
  var dy = this._y-this.originalY;
  var r = Math.sqrt(dx*dx+dy*dy);
  var tolleranz = 4;  // je kleiner die zahl, desto genauer muss man positionieren
  if (r<tolleranz) {
    // treffer! gerade rücken und events entfernen
    this._x = this.originalX;
    this._y = this.originalY;
    delete this.onPress;
    delete this.onRelease;
    delete this.onReleaseOutside;
    // jetzt noch testen ob alle fertig sind
    puzzleFertigZaehler++;
    if (puzzleFertigZaehler >= anzahlAllePuzzle) {
      trace("fertig");
    }
  }
};

[Rookie_BS]

habe das schon durch... vergiss drag&drop - es gibt eh nur eine "freie" position wo das teil hinwandern kann... reicht also ein "klick" und das autoverschieben dorthin... macht das ganze u.U. einfacher.

der user kann dadurch auch schneller spielen (falls du nen zeit*highscore hast) halt ergonomischer irrchendfie ;-)

[Buttonking]

Zitat von hgseib

hast du eine frage zu dem script, oder warum hast du ihn veröffentlicht?

ein puzzle zu programmieren ist doch denkbar einfach.
hier eine vorlage für ein einzelnes puzzleteil zum selbst erweitern:

// zuerst rettet man die originalposition von allen puzzleteilen
puzzleteil.originalX = puzzleteil._x;
puzzleteil.originalY = puzzleteil._y;
// dann werden die per zufall verschoben
puzzleteil._x = Math.random()*Stage.width;
puzzleteil._y = Math.random()*Stage.height;
// events
puzzleteil.onPress = function() {
  // angeklicktes puzzle nach oben
  this.swapDepths(100);
  // verschiebbar machen
  this.startDrag();
};
puzzleteil.onRelease = puzzleteil.onReleaseOutside = function() {
  // verschiebbar beenden
  this.stopDrag();
  // testen, obs in der nähe der originalposition steht
  var dx = this._x-this.originalX;
  var dy = this._y-this.originalY;
  var r = Math.sqrt(dx*dx+dy*dy);
  var tolleranz = 4;  // je kleiner die zahl, desto genauer muss man positionieren
  if (r<tolleranz) {
    // treffer! gerade rücken und events entfernen
    this._x = this.originalX;
    this._y = this.originalY;
    delete this.onPress;
    delete this.onRelease;
    delete this.onReleaseOutside;
    // jetzt noch testen ob alle fertig sind
    puzzleFertigZaehler++;
    if (puzzleFertigZaehler >= anzahlAllePuzzle) {
      trace("fertig");
    }
  }
};

Hi ! Ich würde das gerne ein bisschen besser verstehen. Ich möchte ein Bild verschieben das, wenn es nicht in einer bestimmten area gedroppt wird, wieder zurück "fliegt". Wie soll ich das denn dann machen ?

[hgseib]

Zitat von Buttonking

Hi ! Ich würde das gerne ein bisschen besser verstehen.

das geht nicht, indem dir jemand etwas erklärt, sondern NUR wenn du SELBST etwas machst und dabei lernst. z.b. schwimmen lernt man nur im wasser, fahrrad fahren lernt man nicht aus büchern, sondern man muss höchst persönlich auf die fresse fallen. nur so gehts ;-)

Zitat von Buttonking

Ich möchte ein Bild verschieben das, wenn es nicht in einer bestimmten area gedroppt wird, wieder zurück "fliegt". Wie soll ich das denn dann machen ?

- maus loslassen
- testen ob's innerhalb des ziels ist
- wenn nicht zurück zur letzten position. also z.b. die, die man sich beim drücken der maus gemerkt hat.

[Buttonking]

das geht nicht

Ich versteh was du meinst. Aber mir kommt es eher so vor wie wenn es eine sprache wäre die ich lernen kann.

- maus loslassen =

on (release) {
	
}

- testen ob's innerhalb des ziels ist (dabei verstehe ich nicht wie man das zeil festlegt, vl was mit target und dann die koordinaten ?!) =

this.stopDrag();

- wenn nicht zurück zur letzten position. also z.b. die, die man sich beim drücken der maus gemerkt hat. =

da hätt ich keine idee dazu. Gibts denn so eine art dictionary ? oder ist das einfach das im actionpanel ?

[hgseib]

nicht das ich dir nicht antworten will oder kann, aber ...
das hier ist die rublik:
Flashforum > Flash > Flash Fortgeschritten > Flash 8
und
deine anfrage hat nicht wirklich etwas mit dem thema dieses treads 'schiebepuzzle' zu tun, sondern du willst offensichtlich flash erstmal lernen. somit bist du hier am falschen ort.

zum lernen von flash gibts sehr gute und preisgünstige bücher und millionen von tutorials - hier im forum und generell im internet. bitte einfach mal danach suchen. das lernen von flash müssen wir hier ja nicht nochmals neu erfinden ;-)
zum lernen muss es auch nicht unbedingt ein schiebepuzzle sein. probiere alles aus, was du im internet findest.

auch hier findest du jede menge muster und beispiele, mit denen man flash lernen kann:
H.G.Seib