Autor |
Nachricht |
labrar
Threadersteller
Dabei seit: 04.04.2006
Ort: -
Alter: 49
Geschlecht:
|
Verfasst Mi 08.11.2006 14:47
Titel [Tutorial] Gallerie mit Actionscript |
|
|
Hallo.
Hier möchte ich euch kurz ein Script vorstellen mit dem ihr eine Gallerie erstellen könnt.
Das wichtigste ist kommentiert.
Die Thumbs werden in mehreren Reihen/Spalten dargestellt. Das ganze ist ziemlich einfach gehalten und soll mehr zum lernen, als zur eigentlichen Verwendung anregen.
Sämtliche Buttons usw werden dynamisch erzeugt als einfach das Actionscript ins erste Frame und ab dafür.
Schritt 1.
Bilder für die Gallerie in einen Ordner packen und diesen dann via FTP auf euren Server. Nennt den Ordner "Bilder"
Schritt 2.
Folgendes Script in einer Textdatei speichern und diese als "ausgabe.php" ebenfalls auf euren Server laden.
Code: |
<?php
$ord="Bilder";
$files=opendir($ord);
while($pics=readdir($files)){
if($pics!="." && $pics!=".."){
$picarr[]="$ord/".$pics;
echo "&bilder=".implode("|",$picarr);
}}
?>
|
Schritt 3. folgendes AS ins erste Schlüsselbild eines neuen Filmes (600 auf 500 Pixel) und diesen ebenfalls veröffentlicht auf den Server uns Spaß haben.
Code: |
//Variablen für Reihen Spalten usw. Diese Werte können verändert werden
thmbmaxbreite = 90;
//Entspricht der maximalen Breite bzw Höhe der angelegten Thumbs
picmaxbreite = 300;
//Entspricht der maximalen Breite bzw Höhe des angezeigten Bildes
thbreihen = 4;
//Thumbreihen
thbspalten = 3;
//Thbspalten
//Pfeile zum durchklicken der thumbfelder ertsellen
pfeile = function () {
this.createEmptyMovieClip("pflinks", 101);
pflinks.lineStyle(2, 0x0000FF, 60);
pflinks.beginFill(0xFF0000, 100);
pflinks.moveTo(100, 100);
pflinks.lineTo(200, 200);
pflinks.lineTo(100, 200);
pflinks.endFill();
pflinks._rotation = 45;
pflinks._xscale = 20;
pflinks._yscale = 20;
this.createEmptyMovieClip("pfrechts", 102);
pfrechts.lineStyle(2, 0x0000FF, 60);
pfrechts.beginFill(0xFF0000, 100);
pfrechts.moveTo(100, 100);
pfrechts.lineTo(200, 200);
pfrechts.lineTo(100, 200);
pfrechts.endFill();
pfrechts._rotation = 225;
pfrechts._xscale = 20;
pfrechts._yscale = 20;
pflinks._y = ywert;
pfrechts._y = ywert+85;
pflinks._x = 90;
pfrechts._x = 200;
if (a == felder) {
pfrechts._visible = false;
} else {
pfrechts._visible = true;
}
if (a>1) {
pflinks._visible = true;
} else {
pflinks._visible = false;
}
pfrechts.onPress = function() {
if (a<felder) {
a++;
galstart();
}
};
pflinks.onPress = function() {
if (a>1) {
a--;
galstart();
}
};
};
//Bilderanzeige
this.createEmptyMovieClip("anzeige", 500);
bilderanzeige = function () {
for (j=0; j<thmbscount; j++) {
mc = this["thmbholder"+j];
mc.id = j;
mc.onPress = function() {
anzeige.unloadMovie();
anzeige.loadMovie(pics[this.id*a]);
this.onEnterFrame=function(){
if(anzeige._width>1 ){
ogw=anzeige._width;
skalierung=100/ogw*picmaxbreite;
anzeige._xscale=skalierung;
anzeige._yscale=skalierung;
if(anzeige._width==picmaxbreite){
delete this.onEnterFrame;
anzeige._x=thmbmaxbreite*thbspalten;
}
}
}
};
}
};
//Bilder einladen und anordnen in der Funktion galstart();
var a = 1;
//Damit steuern wir uns später durch die Thumbs
galstart = function () {
//Function definieren
//preloader erstellen
this.createEmptyMovieClip("loader", 105);
loader.lineStyle(2, 0x0000FF, 60);
loader.beginFill(0xFF0000, 100);
loader.moveTo(100, 100);
loader.lineTo(200, 100);
loader.lineTo(200, 110);
loader.lineTo(100, 110);
loader.endFill();
loader._visible = false;
this.createTextField("tx", 400, loader._x, loader._y, 100, 40);
tx.color = 0xFF0000;
//Variablen automatisch anhand der oben eingegebenen Werte erstellen
thmbsanzahl = pics.length;
//anzahl ausgelesenen Bilder
thmbscount = Math.ceil(thbreihen*thbspalten);
//anzahl der auf einmal angezeigten Thumbs
felder = Math.round(thmbsanzahl/thmbscount);
//Einladen der Bilder in dynmaisch erstellte mcs
for (i=0; i<thmbscount; i++) {
//solange i kleiner ist als angezeigte Thumbs Anzahl
this.createEmptyMovieClip("thmbholder"+i, i);
//erstelle leere mcs
this["thmbholder"+i].loadMovie(pics[i*a]);
//lade Bilder
this["thmbholder"+i]._alpha = 0;
//Bilder unsichtbar bis die Größen und Anordnung eingerichtet sind
checker = 0;
//Um die mcs nacheinander zu skalieren
this.onEnterFrame = function() {
//Durchlaufe Frame bis alles skaliert
if (this["thmbholder"+checker]._width>1) {
//wenn Bild 1 geladen bzw Breite größer 1
orgw = this["thmbholder"+checker]._width;
//Abfragen wie breit
//Skalieren des Thumbs
sklaliervorgabe = 100/orgw*thmbmaxbreite;
// Vorgabe der Breite in Prozent aufgrund des eingegebenen maxbreite Wertes
if (this["thmbholder"+checker]._width>thmbmaxbreite) {
this["thmbholder"+checker]._xscale = sklaliervorgabe;
//Skaliere Breite
this["thmbholder"+checker]._yscale = sklaliervorgabe;
//Skaliere Höhe
//Gegenprüfung für die Höhe
if (this["thmbholder"+checker]._height>thmbmaxbreite) {
// Wenn zu hoch
orgh = this["thmbholder"+checker]._height;
//Höhe auslesen
skalierhoehenvorgabe = 100/orgh*thmbmaxbreite;
// Vorgabe der Höhe in Prozent aufgrund des eingegebenen maxbreite Wertes
this["thmbholder"+checker]._xscale = skalierhoehenvorgabe;
//Skaliere Breite erneut angepasst
this["thmbholder"+checker]._yscale = skalierhoehenvorgabe;
//Skaliere Höhe
}
}
if (this["thmbholder"+checker]._width<=thmbmaxbreite) {
//&& this["thmbholder"+checker]._height<=thmbmaxbreite){//wenn die Größen den Vorgaben entsprechen
checker++;
// gehe zu nächstem Bild
}
//Preloaderanzeige
p = Math.round(100/thmbscount*checker);
if (p>1) {
loader._visible = true;
loader._width = p;
tx.text = "Lade Bilder "+p+"%";
}
trace("Fortschritt="+p);
trace(checker+" zu "+this["thmbholder"+checker]._height+" zu "+this["thmbholder"+checker]._width);
if (checker == thmbscount) {
//Wenn alle Bilder skaliert sind
delete this.onEnterFrame;
//stoppe die Schleife
bilderanzeige();
loader.removeMovieClip();
//preloader entfernen
tx.removeTextField();
ywert = thbreihen*thmbmaxbreite;
pfeile();
//Und ordne in Spalten und Reihen an
aktuellermc = 0;
for (s=0; s<thbreihen; s++) {
for (h=0; h<thbspalten; h++) {
this["thmbholder"+aktuellermc]._x = h*(thmbmaxbreite+2);
this["thmbholder"+aktuellermc]._y = s*(thmbmaxbreite+2);
this["thmbholder"+aktuellermc]._alpha = 100;
aktuellermc++;
xwert = this["thmbholder"+aktuellermc]._x+this["thmbholder"+aktuellermc]._width;
}
}
}
}
};
}
};
//Bilderquelle auslesen
pc = new LoadVars();
pc.onLoad = function(geladen) {
if (geladen) {
pics = this.bilder.split("|");
trace(pics);
galstart();
} else {
trace("Loading failed");
}
};
pc.sendAndLoad("ausgabe.php", pc, "POST");
[/quote] |
//edit by barett
Bitte keine Eyecatcher im Titel
Zuletzt bearbeitet von Barett am Mi 28.02.2007 19:56, insgesamt 1-mal bearbeitet
|
|
|
|
|
vulnerability
Dabei seit: 12.11.2005
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 29.01.2007 09:12
Titel kleine kritik..großer Dank |
|
|
Hallo,
danke für die tolle Arbeit, die du hier geleistet hast....ich will nur eine weitere Empefehlung machen ..ein Preview des Endergebnisses wäre meiner Meinung nach hier sehr angebracht....vielleicht ein Screenshot od. ähnliches.
Danke
|
|
|
|
|
Anzeige
|
|
|
l'Audiophile
Dabei seit: 16.09.2004
Ort: Berlin
Alter: 43
Geschlecht:
|
Verfasst Mo 29.01.2007 18:29
Titel
|
|
|
Habs mir jetzt nich genau angeschaut aber dennoch Respekt für die ganze Arbeit.
Gruß PJ
|
|
|
|
|
labrar
Threadersteller
Dabei seit: 04.04.2006
Ort: -
Alter: 49
Geschlecht:
|
Verfasst Mi 14.02.2007 23:43
Titel
|
|
|
Danke für das Lob
Ja stimmt. Ich guschdel mal ein paar Bilder zusammen und mach mal nen Link dazu
|
|
|
|
|
Sunlifestyle
Dabei seit: 20.12.2005
Ort: Hoyerswerda bei Dresden
Alter: -
Geschlecht:
|
Verfasst Mo 26.02.2007 23:22
Titel
|
|
|
gibt es die Galerie schon irgendwo online ?
|
|
|
|
|
labrar
Threadersteller
Dabei seit: 04.04.2006
Ort: -
Alter: 49
Geschlecht:
|
Verfasst Di 27.02.2007 00:38
Titel
|
|
|
Sorry ich wollte was hochladen zum zeigen aber ich finde nicht die Zeit ein paar Sinnvolle Bilder zusammenzugruschteln und das dann hochzuschieben.
Das Ding funzt aber. Gewinnt keinen Schöheitspreis aber um das geht es hierbei auch nicht.
Also keine Angst
Wenn einer Interesse daran hat dann kann er sich das ja in 3 Minuten zusammenkopieren und hochschieben
sofern er Bilder zur Hand hat natürlich
So long
|
|
|
|
|
messywrk
Dabei seit: 17.10.2006
Ort: Düsseldorf
Alter: 44
Geschlecht:
|
Verfasst Mi 28.02.2007 19:51
Titel
|
|
|
nur weil ich das jetzt hier grade so las..
erstmal sehr nett das du deinen code in einem Forum postest und vielen Dank dafür!
ich wollte nur noch der vollständigkeit halber den Link zu einer anderen OpenSource Gallery dazusetzen..
aber nich falsch verstehen, das is n ganz anderes Kaliber - erfordert MySQL und PHP und so weiter..
quasi nur für die die das jetzt geblickt haben und ma gucken wollen wie der code von etwas "komplexerem" aussieht
http://www.sephiroth.it/file_detail.php?id=139
|
|
|
|
|
|
|
|
Ähnliche Themen |
[Suche] Tutorial für Flash + ActionScript
Flash-Gallerie
Gallerie mit GoLive
Gallerie mit Fireworks 8
Slide Gallerie
simple gallerie
|
|