Bilder dynamisch laden + Maske

[retsamneknurD]

Hallo,

ich versuche vergeblich, eine vielzahl von Bildern in einen Container zu laden, welcher eine Maske besitzt.
Der Container ist wie folgt aufgebaut und wird via attachMovie eingefügt:

Container
-> Maske
-> innerMC

Das AS2 dazu:

			for (var i = 0; i < total; i++) {
				if (!tempcount) {
					var tempcount:Number = 0;
				}
				var image = this.childNodes[0].childNodes[counter + skipSettings].childNodes[0].firstChild.nodeValue;

				var clone = _root.container.innerMC.duplicateMovieClip ("innerMC" + tempcount, _root.container.getNextHighestDepth ());
				loadMC (i,image,clone);
				
				var theMask = clone._parent.innerMask;

				theMask.swapDepths(clone)
				clone.setMask ("innerMask");
				moveMC (clone,200 * counter,0);
				counter++;
				tempcount++;
			}

Es ist noch viel Baustelle, also nicht wundern falls ihr noch etwas falsches findet.

Vielen vielen Dank!

Es ist noch viel Baustelle

Baustelle ist gut... Das sieht eher nach einem Handgranaten-Wurfstand aus... Fang mal mit dem setMask an, der Parameter ist kein String, sondern ein Instanzname. Welchen Wert hat "image"? Was macht "loadMC"? Was macht "moveMC"? Wieso nimmst du einen duplicateMovieClip? Liegt der MC denn schon auf der Bühne?

[retsamneknurD]

Sorry, ich habe ewigkeiten nichts mehr in Flash gemacht und versuch mich gerade wieder (unfreiwillig) mit dem schwierigsten aufzufrischen.
Ich poste mal das gesamte AS.
Sorry ein Wurfgranatenstand, weil sich viel neuwissen mit altwissen verschmisst, und dadurch das viele Funktionen nicht funktionier haben, ist viel Testen dabei

Aber bin dir super Dankbar, das überhaupt drüberschaust, habe angst das ich das ding nicht fertig bekomme.

import com.greensock.*;
import com.greensock.easing.*;

var total:Number;

var xml:XML = new XML ();
xml.ignoreWhite = true;

function loadXML (xmlFile) {
	xml.load (xmlFile);
	xml.onLoad = function (success) {
		if (success) {
			var setPath = this.childNodes[0].childNodes[0].attributes;

			var time = setPath.time;
			var speed = setPath.speed;
			var colorhover = setPath.colorhover;
			var scale = setPath.scale;
			var target = setPath.target;
			var border = setPath.border;
			var breite = setPath.breite;
			var hoehe = setPath.hoehe;
			var total = xml.firstChild.childNodes.length;
			var counter = 0;
			var skipSettings = 1;
			var zIndex = _root.getNextHighestDepth ();
			var startXPos = 0;
			var padding = 10;
			_global.GetMainMC = attachMovie ("emptyMC", "container", 1);
			
			for (var i = 0; i < total; i++) {
				if (!tempcount) {
					var tempcount:Number = 0;
				}
				var image = this.childNodes[0].childNodes[counter + skipSettings].childNodes[0].firstChild.nodeValue;

				var clone = _root.container.innerMC.duplicateMovieClip ("innerMC" + tempcount, _root.container.getNextHighestDepth ());
				loadMC (i,image,clone);
				
				var theMask = clone._parent.innerMask;
				theMask.swapDepths(clone)
				clone.setMask ("innerMask");
				moveMC (clone,200 * counter,0);
				counter++;
				tempcount++;
			}
		}
	};
}

function nextPic () {
	trace ("der MC = " + _global.GetMainMC);
	_global.GetMainMC._x -= 200;
}

function moveMC (mcName, breite, padding) {
	var newBreite:Number = breite;
	mcName._x += (newBreite + padding);
}


function loadMC (count, url, MC) {
	var image = "\"" + url + "\"";
	var mcLoader = new MovieClipLoader ();
	mcLoader.loadClip (url,MC);
	mcLoader.onLoadProgress = function () {
	};
	mcLoader.onLoadComplete = function () {
		scaleIt (MC);
	};
}

function scaleIt (mc) {
	mc.onEnterFrame = function () {
		if (mc._width <= 1) {
		} else {
			mc._width = 200;
			mc._yscale = mc._xscale;
			mc._y += (200 / 2) - (mc._height / 2);
			delete (mc.onEnterFrame);
		}
	};
}

function onFinishTween (film):Void {
	var zindex = film.getDepth ();
	film.swapDepths (zindex - 10);
	TweenLite.to (film,0.001,{_alpha:100, _x:0});
	film.fm_button.enabled = 1;
}

loadXML ('gallery.xml');
stop ();

Ziel des ganzen, eine Bildgallerie, die fünf Container auf der Bühne hat.
Jeder Container wird dupliziert.
Jeder Container hat den gleichen Inhalt, alle Bilder nebeneinander, mit Mausklick auf einen Button wird einfach das Bild nach "breite" links verschoben.

Klingt banal, ist aber für mich schwer zum umsetzen

[retsamneknurD]

Hilfe

Bin wirklich für alle kleinen Steps dankbar.

[Minsk]

was funktioniert denn an deinem code nicht?

[ING]

hab jetzt auch nicht den ganzen code studiert aber es ist echt ein schlachtfeld eine fehlerquelle ist schon mal das zuweisen der maske bevor das bild geladen ist, außerdem erstellst du für jedes bild einen neuen moviecliploader und und und...

les dich am besten noch mal schlau über den moviecliploader, ist absolute grundlage für ein projekt wie du es vorhast.

[retsamneknurD]

Sorry, ich schäm mich ja auch dafür wie mein "Wissen" sich zusammenstückelt. Aber wenn solche Projekte nur alle 1-2 Jahre vorkommen, kann man sich vielleicht vorstellen wieso.

Das Hauptproblem ist momentan die SetMask. Wobei das wirklich nur der Anfang ist

Ok, ich befolge deinen Rat sehr gerne und schau mir den MovieClipLoader an.

[la_pantera]

hallo,
ich habe ebenfalls ein problem, dass das thema "bilder dynamisch laden" betrifft.
vor einiger zeit habe ich von einem flasher ein bildlaufband programmiert bekommen, was allerdings nicht so richtig funktioniert.
(ich habe ihn natürlich für seine arbeit bezahlt, doch jetzt erreiche ich ihn nicht mehr…)
bilder werden per action script dynamisch geladen und als bildlaufband in einer endlosschleife ausgegeben.

das script funktioniert offline einwandfrei, doch wenn ich die daten online stelle, werden die bilder, so scheint es, alle an ein und dieselbe position geladen. nach einem refresh des browsers klappt es dann auch online. (siehe test)

ich schaffe es zwar, einzelne parameter zu verändern (bildanzahl, ablaufgeschwindigkeit,…), doch den eigentliche fehler finde ich nicht und vor allem verstehe ich ihn auch nicht!

var bildanzahl = 10;
// stellen sie die anzahl der bilder hier ein. die bilder müssen durchnummeriert sein.
var i = 1;
// zählervariable.
var pfad = "";
// legen sie den pfad zu den Bildern hier fest.
var abstand = 7;
// legen sie den abstand zwischen den bildern hier fest.
var breite = 3467;
// stellen sie hier die gesamtbreite des laufbandes ein.
var hoehe = 230;
// stellen sie hier die höhe des laufbandes ein.
var gesamtbreite;
// reitenvariable.
var speed = 2;
// stellen sie hier das tempo des laufbandes ein.
maske._width = breite;
// maskenvariable.
maske._height = hoehe;
maske.swapDepths(1000);
this.setMask(maske);


laden = function (){ 
	if (i<=bildanzahl){
		this.createEmptyMovieClip('pic'+i, i);
		this['pic'+i].loadMovie(pfad+i+'.jpg', 0);
		this.onEnterFrame = function(){
			this['pic'+i]._x = this['pic'+(i-1)]._x+this['pic'+(i-1)]._width+abstand;
			delete this.onEnterFrame;
			i++;
			laden();
		};
	}else{
		
		this.gesamtbreite = this._width;
		move();
		for (k=1; k<=bildanzahl; k++){
{
	
}
}
}
};
move = function (){ 
	this.onEnterFrame = function(){
		speed1 = 1*speed;
		for (j=1; j<=bildanzahl; j++) {
			var mc = this['pic'+j];
			mc._x -= speed1;
			if (mc._x>=breite) {
				mc._x -= gesamtbreite;
			}
			if (mc._x<=-mc._width) {
				mc._x += gesamtbreite;
			}
		}
	};
};
laden();

wo liegt mein denkfehler? nachdem ich schon viel zeit damit verbracht habe, eine lösung zu finden, hoffe ich auf einen guten tipp oder lösungsansatz. für euch liegt das problem vielleicht auf der hand…

vielen dank schonmal

this['pic'+i]._x = this['pic'+(i-1)]._x+this['pic'+(i-1)]._width+abstand;

Die Zeile wird das Problem sein, denn das vorherige Bild wird noch nicht geladen sein, du versuchst aber schon auf dessen Breite zuzugreifen...

Ich würde das mit einer Ladefunktion mit einem MovieClipLoader versuchen, der loadMovie ist sowieso veraltet. Und dann nicht in einer for-Schleife alle gleichzeitig laden, sondern hintereinander. Hier mal ein kleiner Ansatz:

PHP-Code:

//Zähler
var index:Number = 0;

//Liste der Bilder
var urls:Array = new Array("bild1.jpg", "bild2.jpg","bild3.jpg");

//Liste der MCs
var mcs:Array = new Array();
var len:Number = urls.length;

//leere MCs erzeugen
for(var i=1;i<=len;i++){
   this.mcs.push(this.createEmptyMovieClip("con"+i,i));
   this["con"+i]._x = (i*100);//evtl. positionieren, das muss dann angepasst werden!
}

//erstes Bild laden
var mclListener:Object = new Object();
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(mclListener);
mcLoader.loadClip(urls[index], mcs[index]);


//fertiggeladen
mclListener.onLoadInit = function(mc:MovieClip) {
    trace("fertig, mc="+mc);
   index++;
   if (index < len) {//sind noch weitere zu laden?
       mcLoader.loadClip(urls[index], mcs[index]);
   }
   else{
      //alles geladen, dann die move-Funktion...
   }
}

this.stop(); 


[la_pantera]

hallo holger,
vielen dank für die prompte antwort.
morgen werde ich direkt deinen ansatz ausprobieren, jetzt gerade habe ich keine zeit …

gruß. sabine

[la_pantera]

ich habe deinen ansatz übernommen und ihn anstelle der laden-funktion eingesetzt, den rest des scriptes habe ich beibehalten. und natürlich habe ich die bildbezeichnungen angepaßt. soweit passiert noch nix.

Zitat von agedoubleju

PHP-Code:


//leere MCs erzeugen
for(var i=1;i<=len;i++){
   this.mcs.push(this.createEmptyMovieClip("con"+i,i));
   this["con"+i]._x = (i*100);//evtl. positionieren, das muss dann angepasst werden!
} 


heißt dass, das meine bilder alle gleich breit sein sollten, also bei 300px breite würde ich (i*300) eintragen? und wie würde ich noch einen 7px abstand einfügen können? (i*300+i*7)?

Zitat von agedoubleju

PHP-Code:

//erstes Bild laden
var mclListener:Object = new Object();
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(mclListener);
mcLoader.loadClip(urls[index], mcs[index]);


//fertiggeladen
mclListener.onLoadInit = function(mc:MovieClip) {
    trace("fertig, mc="+mc);
   index++;
   if (index < len) {//sind noch weitere zu laden?
       mcLoader.loadClip(urls[index], mcs[index]);
   }
   else{
      //alles geladen, dann die move-Funktion...
   }
}

this.stop(); 


wie von dir angemerkt, habe ich hier meine ursprüngliche move-funktion hinkopiert, aber es klappt gar nicht… muss ich die noch irgendwie anpassen?
muss ich jetzt andere variabeln einsetzen?

ich habe versucht, das script irgendwie hinzubiegen, doch bekomme ich noch nichtmals die bilder geladen, geschweige denn die bewegung…
(die bilder liegen auf der gleichen ebene wie die flash-datei)

ein hilfloser gruß. sabine