scrollen eines dynamisch erstellten Thumbnailblocks

[Beezle-Bug]

Hallo,
ich erzeuge mit folgendem Skript einen Block von 4 x n Thumbnails, die dynamisch nach- und nebeneinander aufgereiht werden, klappt ganz gut ;-) Lasst euch nicht von den _x und _y Werten verwirren, die sind deshalb so lang, damit sich die Bilder neben- und untereinander aufreihen.

PHP-Code:

MovieClip.prototype.attache = function() {
    trace("attache"); //Die Funktion wird später bei "menu" angefügt
    for (t=1; t<=20; t++) {
        var thumb = createEmptyMovieClip("tmb"+t, t);
        var nr = t;
        while (nr.toString().length<2) {
            //damit aus 1,2,...,9 folgendes wird: 01,02,...,09
            nr = "0"+nr;
        }
        if (t<=9) {
            thumb.id = "0"+t;
        } else {
            thumb.id = t;
        }
        thumb.createEmptyMovieClip("bild", 1);
        thumb.bild.loadMovie("thumbs/"+nr+dateiname);//dateiname ist die Variable für eine Endung wie "_bild.jpg", die ganze Adresse schaut also dann so aus: "thumbs/02_bild.jpg"
        thumb._y = tmbheight*Math.floor((t-1)/tmbzahl); //tmbheigt und tmbwidth beziehen sich auf die thumbnails
        thumb._x += leftalign+tmbwidth*(t-1)-Math.floor((t-1)/tmbzahl)*tmbzahl*tmbwidth;
        thumb._alpha = tmbalpha;
        //Mouse actions
        thumb.onRollOver = function() { //Das thumbnail wird von alpha=80 auf alpha=100 gefaded
            this.fadeIn(10);
        };
        thumb.onRollOut = function() {//und wieder langsam zurück
            this.fadeOut(5);
        };
        thumb.onPress = function() {
            this._parent.con.goOut(2);//der container "con" in den das große Bild geladen wird, faded aus
            this._parent.btn.goOut(5);//sowie ein button
            this._parent.con.import(this.id);//und das nächste Bild wird im Hintergrund in con geladen
        };
    }

//und danach folgen die Definitionen der Funktionen 


Das Problem besteht jetzt darin, dass es einfach zu viele Thumbs für eine Bildschirmseite sind, und ich den Block als ganzes gerne nach oben und nach unten fahren lassen möchte (ob automatisch oder manuell ist jetzt nicht so wichtig)

Das ist der Lösungsansatz, aber irgendwie funktioniert der nicht:

PHP-Code:

this.createEmptyMovieClip("menu", 2000);
this.menu.attache(); //attache obrige Funktion
with(this.menu) {
_x = 100;
_y = 0;
/*------
Rechteck zeichnen um die Bewegung zu sehen
    lineStyle(1, 0x333333, 100);
    beginFill(0xff0000, 20);
    lineTo(0, 20);
    lineTo(0, 0);
    lineTo(20, 0);
    lineTo(20, 20);
    endFill();
*/
}
//onEnterFrame --> Bewegung
var umkehrpunkt = Stage.height/2;
this.onEnterFrame = function () {
    var diff = _ymouse-umkehrpunkt;
    trace(this.menu._y);
    if (diff>0 && _xmouse<=500) {
        this.menu._y -= diff*diff/5000;
    } else if (diff<0 && _xmouse<=500) {
        this.menu._y += diff*diff/5000;
    } 


Wenn ich "menu" ein Rechteck zeichnen lasse, fährt das wunderschön hoch und runter. Aber ich will eigentlich, dass der Block an Thumbnails IN dem mc "menu" erstellt wird und somit hoch und runterfährt. (Hier kommt noch ein 2. Problem zum tragen: Wenn ich auf eines der Thumbnails klicke, und damit das mainimg in den container "con" lade, bewegt sich das Rechteck nicht mehr...)

Ich hab mir überlegt, dass es vielleicht daran liegen könnt, dass den thumbs in der attach-funktion dynamisch Positionswerte zugeschrieben werden, und sich diese _x und _y Angaben einfach über die unteren Veränderungen von +=3 hinwegsetzen.
Aber wenn ich die Lösung wüsste würd ich jezt nicht hier reinschreiben...

Bitte beeilt euch, wenn ihr mir helfen könnt oder noch mehr details braucht, das Projekt ist ziemlich wichtig :-/

[Beezle-Bug]

kann mir bitte jemand helfen

[Majo]

das kommt mir ziemlich bekannt vor?!?

so sollte es funktionieren:

var depth = 0;
var rows = 3;
var cols = 5;
var breite = 50;
var hoehe = 50;
MovieClip.prototype.attache = function() { 
    trace("attache"); //Die Funktion wird später bei "menu" angefügt 
    for( var i=0; i<rows; i++){
        for( var j=0; j<cols; j++){
            ++depth;   
            var thumb = this.createEmptyMovieClip("tmb"+depth,depth); 
            var nr = depth; 
            while (nr.toString().length<2) { 
             //damit aus 1,2,...,9 folgendes wird: 01,02,...,09 
                nr = "0"+nr; 
            } 
            if (depth<=9) { 
                thumb.id = "0"+depth; 
            } else { 
                thumb.id = depth; 
            } 
            thumb.createEmptyMovieClip("bild", 1); 
            thumb.bild.loadMovie("thumbs/"+nr+dateiname);//dateiname ist die Variable für eine Endung wie "_bild.jpg", die ganze Adresse schaut also dann so aus: "thumbs/02_bild.jpg" 
            thumb._y = i*50;
            thumb._x = j*50;
            thumb._alpha = tmbalpha; 
            //Mouse actions 
            thumb.onRollOver = function() { //Das thumbnail wird von alpha=80 auf alpha=100 gefaded 
                this.fadeIn(10); 
         }; 
            thumb.onRollOut = function() {//und wieder langsam zurück 
                this.fadeOut(5); 
            }; 
            thumb.onPress = function() { 
                this._parent.con.goOut(2);//der container "con" in den das große Bild geladen wird, faded aus 
                this._parent.btn.goOut(5);//sowie ein button 
                //this._parent.con.import(this.id);//und das nächste Bild wird im Hintergrund in con geladen 
            }; 
        } 
    }
}
 
this.createEmptyMovieClip("menu", 2000); 
this.menu.attache(); //attache obrige Funktion 
 
//onEnterFrame --> Bewegung 
var umkehrpunkt = Stage.height/2; 
this.onEnterFrame = function () { 
    var diff = _ymouse-umkehrpunkt; 
     
    if (diff>0 && _xmouse<=500) { 
        this.menu._y -= diff*diff/5000; 
    } else if (diff<0 && _xmouse<=500) { 
        this.menu._y += diff*diff/5000; 
    }  
} 

[Beezle-Bug]

Hi erstmal danke für die flotte Antwort!
(ist ja super, gleich den chef persönlich da zu haben ;-)

Aber außer dass mein code jetzt ein gutes stück übersichtlicher geworden ist, hat sich nichts getan

Der Thumbblock klebt jetzt links oben in der Ecke (musste den _y Wert noch ändern

PHP-Code:

thumb._y = tmbheight*i-tmbheight; 


)

und mein menüdummy fährt munter auf und ab, aber leer....

Bei deinem Original sind die Bilder ja über ein Arrey reingekommen, hier jetzt über create Movieclips, macht das einen unterschied?

Alle functionen sind ja nur für's faden und laden in die container zuständig, können also keine Schuld haben. Evtl ist auch bei den _parent, _root, _level0 Pfaden der Wurm drin?
arrrg das muss doch wohl zu schaffen sein ;-)

PS: Es muss ja nicht mal so ein smoother slide sein, ich würde mich auch schon mit einem Button beknügen, bei dem einfach alles um 3 Reihen nach unten rutscht

[Majo]

haste den code kopiert?
der funktioniert!
menu._x und menu._y kannste doch einstellen

[Beezle-Bug]

Ich nehm alles zurück, der Code funktioniert!
wenn ich ihn in einen leeren flash packe - aber in meinem Wust scheint irgendwo noch eine Störvariable zu sitzten, da klappts nicht ;-)

Werd diese Nacht wohl damit verbringen, sie zu finden...

merci nochmal

[Beezle-Bug]

So der Fehler ist gefunden, die Lösung noch nicht.
Den bestimmt tollen Preloader hab ich aufgrund des zu gigantischen as wegen gegen was leichteres erstzt (sry*), aber anscheinend war das doch nicht so eine gute Idee.
Vielleicht kannst du, oder jemand anderes, mir trotzdem helfen.

Folgendes liegt in der _root./_level0:

PHP-Code:

//----------------------------------------------
//Preloader
//----------------------------------------------
this.ladebalken.laden = function(id, fin) {
    con._alpha = 0;
    info.txt.text = "Hier steht die Beschreibung zu Bild "+id;
    this._visible = true;
    this.balken._xscale = fin;
    this.strich._x = this.balken._width;
    this.strich.prozenttext.text = fin+" %";
    this.progress_txt.text = "loading : Bild"+id+" - "+Math.round(_level0.con.getBytesLoaded()/1024)+" kb / "+Math.round(_level0.con.getBytesTotal()/1024)+" kb   ";
};
this.ladebalken.fertig = function(id, fin) {
    this.progress_txt.text = "loaded : Bild"+id;
    this._visible = false;
    this.onEnterFrame = function() {
        if (con._alpha<=100) {
            con._alpha += 10;
        } else {
            trace("laden fertig");
            delete this.onEnterFrame;
        }
    };
}; 


Und dieser Schnipsel ist eingebettet in die Funktion attache, liegt also in den Klammern von dem anfänglich geposteten AS und wird bei "this.onPress" aufgerufen, wie in dem allererstem Skript:

PHP-Code:

MovieClip.prototype.import = function(id) {
        this.visible = true;
        this._alpha = 0;
        this.loadMovie("pics/"+id+dateiname);
        onEnterFrame = function () {
            // Preloader, kontinuierliche Überprüfung des Ladevorgangs
            var fin = int(_level0.con.getBytesLoaded()*100/_level0.con.getBytesTotal());
            // Prozentwerte berechnen
            trace("fin="+fin);
            _level0.ladebalken.laden(id, fin);
            if (fin>=100 && _level0.con._width>0 && _level0.con._height>0) {
                // wenn alles geladen wurde...
                delete this.onEnterFrame;
                _level0.ladebalken.fertig(id, fin);
                // dann den Event wieder löschen
            }
        };
    }; 


Was passt da mit der Verknüpfung nicht? Muss da noch ein _parent mehr rein, weil die funktion "attache" ja von dem erstelltem MC "menu" ausgeführt wird?

Das Problem ist konkret folgendes: Alles funktioniert ;-) (Also, scrollen des Thumbnailblocks und das reinladen und reinfaden der zugehörigen Bilder in den Container "con")
NUR: Nachdem das 1. Bild geladen ist, funktioniert die Scroll Funktion nicht mehr Es werden aber weiterhin die richtigen Bilder in den con geladen. Irgendwas scheint mir da evtl auch ein onEnterFrame zu nichte zu machen, oder so.?
Ich komm einfach nicht voran.

[Majo]

nenn deinen prototypen nicht import, das ist ein reserviertes wort

MovieClip.prototype.import = function(id) { 
        this.visible = true; 
        this._alpha = 0; 
        this.loadMovie("pics/"+id+dateiname); 
        onEnterFrame = function () { 
            // Preloader, kontinuierliche Überprüfung des Ladevorgangs 
            var fin = int(_level0.con.getBytesLoaded()*100/_level0.con.getBytesTotal()); 
            // Prozentwerte berechnen 
            trace("fin="+fin); 
            _level0.ladebalken.laden(id, fin); 
            if (fin>=100 && _level0.con._width>0 && _level0.con._height>0) { 
                // wenn alles geladen wurde... 
                delete this.onEnterFrame;//<- das zerstört deinen slider 
                _level0.ladebalken.fertig(id, fin); 
                // dann den Event wieder löschen 
            } 
        }; 
    }; 

zweimal onEnterFrame....

ps: das loader-as hat doch nur 13 kb?!?

[Beezle-Bug]

Hi Majo, hi ihr Flasher da draußen.

Die Frage hat nichts mehr mit dem da drüber zu tun, spielt aber im selben Codeblock. Hier werden ja nacheinander Thumbnails reingeladen und in Reihen und Spalten sortiert. Von 1 bis 26, oder was ich halt angebe. Da alle Bilder "thumbs/"+nr+dateiname heißen ist jeder eindeutig identifizierbar, anhand von der Nummer und kriegt die, der Nummer zugewiesene Position.

Was ist aber jetzt, wenn ein Bild, z.B. Nr.8 nicht im Ordner ist? naja, ich weiß es: der Platz bleibt leer. Das schaut aber ziemlich blöd aus ,-) Also, wie kann ich flash sagen dass, wenn ein Bild nicht da ist, es eine Nummer höher schauen soll usw.?

Hier nochmal die Stelle, um die es geht:

PHP-Code:

MovieClip.prototype.attache = function() {
    trace("attache");
    //Die Funktion wird später bei "menu" angefügt 
    for (var i = 0; i<rows; i++) {
        for (var j = 0; j<cols; j++) {
            ++depth;
            var thumb = this.createEmptyMovieClip("tmb"+depth, depth);
            var nr = depth;
            while (nr.toString().length<2) {
                //damit aus 1,2,...,9 folgendes wird: 01,02,...,09 
                nr = "0"+nr;
            }
            thumb.id = depth;
            thumb.createEmptyMovieClip("bild", 1);
            thumb.bild.loadMovie("thumbs/"+nr+dateiname); 


merci