Flashforum - Die Community zu Adobe Flash, Flex AIR. Web Design und Inspiration.

mojave · 21-04-2006, 20:21

eine einfache SlideShow:

usage:

PHP-Code:

  var slideShow:SlideShow = new SlideShow(mc,arrayBilderNamen,sekunden,pfadZuBildern,initialisierungsObjekt);

es kann ebenfalls ein objekt ohne konstruktorparameter erzeugt und über setter initialisiert werden.

zur laufzeit: setBilder(aBilder:Array); initialisiert die slidshow mit neuen bildern. so kann man zwischen verschiedenen slideshows switchen. bietet sich vielleicht an für etwas wie (urlaubsbilder, hansgeburtstagsbilder, bananebilder)

PHP-Code:

  import mx.transitions.*;
import mx.transitions.easing.*;

class SlideShow{

    private var mcTarget:MovieClip;
    private var aBilder:Array;
    private var aHolder:Array;
    private var oProp:Object;
    private var sPath:String;
    private var nCurrent:Number;
    private var seconds:Number;
    private var nInterval:Number;

    private var mlLoader:MovieClipLoader;
    private var mlListener:Object;
    
    private var isStarted:Boolean;


    //
    //    CONSTRUCTOR
    //
    public function SlideShow(mcTarget:MovieClip,aBilder:Array,seconds:Number,sPath:String,oProp:Object){
    
        setTarget(mcTarget);
        setSeconds(seconds);
        setPath(sPath);
        setProperties(oProp);
        setBilder(aBilder);//startet slideshow
        
    }

    //
    //    END CONSTRUCTOR
    //
    //    ========================================================================
    //                PRIVATE FUNCTIONS
    //    ========================================================================
    //
        
    private function setup(Void):Void{
        tr("SlideShow: setup()");
        mlLoader = new MovieClipLoader();        
        initListeners();
        createBilderHolder();
        nCurrent = 0;
    }
    
    
    private function createBilderHolder(Void):Void{
        for(var i:Number = 0;i<aHolder.length;i++){
            aHolder[i].removeMovieClip();
        }
        aHolder = new Array();
        for(var i:Number = 0; i< aBilder.length; i++){
            var target:MovieClip = mcTarget.createEmptyMovieClip("mcHolder_"+i,mcTarget.getNextHighestDepth());
            aHolder[i] = target;
            loadBild(aBilder[i],target);
        }
    }
    
    private function loadBild(src:String,target:MovieClip):Void{
        tr("SlideShow: loadBild("+src+")")
        mlLoader.loadClip (this.getPath()+src, target);
        mlLoader.addListener(mlListener);
    }
    

    private function next(Void):Void{
        tr("SlideShow: next()")
        if(!isStarted){
            isStarted = true;
            (aHolder.length<=1)? fadeInOutImage(aHolder[0],false) : fadeInOutImage(aHolder[0],true);    
            return;
        }
        
        clearInterval(nInterval);
        nCurrent = (nCurrent<aHolder.length-1)? ++nCurrent : 0;
        fadeInOutImage(aHolder[nCurrent],true);    
    }
    
    
    
    private function fadeInOutImage(src:MovieClip,hasNext:Boolean):Void{
        tr("SlideShow: fadeInOutImage("+src+")");
        var scope = this;
        clearInterval(nInterval);
        src._alpha = 100;
        TransitionManager.start(src,{type:PixelDissolve,direction:0,duration:1,easing:Regular.easeOut,xSections:20,ySections:20});
        
        if(!hasNext)
        return;
        
        nInterval = setInterval(function(){
                clearInterval(scope.nInterval);
                scope.next();
                TransitionManager.start(src,{type:PixelDissolve,direction:1,duration:1,easing:Regular.easeOut,xSections:20,ySections:20});
        },seconds);
    }
    
    
    
    private function initListeners():Void{
        var scope:SlideShow = this;
        mlListener = new Object();
        mlListener.onLoadStart = function(mcLoaded:MovieClip){
            mcLoaded._alpha = 0;
        }
        //mlListener.onLoadProgress  = function(mcLoaded:MovieClip){}
        //mlListener.onLoadComplete = function(mcLoaded:MovieClip, httpStatus:Number) {}
        //mlListener.onLoadError = function(mcLoaded:MovieClip, errorCode:String, httpStatus:Number) {}
        mlListener.onLoadInit = function(mcLoaded:MovieClip){
            scope.tr(mcLoaded,"  geladen");
            mcLoaded._alpha = 0;
            for(var i in scope.oProp){
                mcLoaded[i] = scope.oProp[i];
            }
            if(mcLoaded._name == 'mcHolder_0'){
                scope.start();
            }
        }
    }
    
    
    private function deleteEmptyArrayValue(a:Array):Array{
        for (var i:Number = 0; i<a.length;i++){
            if(a[i] == undefined || a[i] == ''){
                a.splice(i,1);
            }
        }
        return a;
    }
    
    
    //
    //    ========================================================================
    //            PUBLIC FUNCTIONS
    //    ========================================================================
    //
    
    //start slideshow
    public function start(Void):Void{
        tr("SlideShow: start()")
        this.stop();
        next();
    }
    
    //pause slideshow
    public function pause(Void):Void{
        clearInterval(nInterval);
    }
    
    //stop slideshow
    public function stop(Void):Void{
        clearInterval(nInterval);
        isStarted = false;
        nCurrent = 0;
    }
    
    //trace
    public function tr ()    {
        trace (arguments.join (" : "));
    }


    //
    //    ========================================================================
    //            SETTER GETTER
    //    ========================================================================
    //
    
    //target
    public function setTarget(value:MovieClip):Void{
        this.mcTarget = value;
    }
    public function getTarget(Void):MovieClip{
        return this.mcTarget;
    }
    
    //bilder
    public function setBilder(a:Array):Void{
        tr("SlideShow: setBilder("+a+")");
        this.stop();
        this.aBilder = deleteEmptyArrayValue(a);
        if(aBilder != null && aBilder.length>=1)        
        setup();
    }
    public function getBilder(Void):Array{
        return this.aBilder;
    }
    
    //seconds
    public function setSeconds(value:Number):Void{
        this.seconds = value*1000;
    }
    public function getSeconds():Number{
        return this.seconds;
    }
    
    //pfad
    public function setPath(value:String):Void{
        if(value == null || value == '')
            value = './';
        this.sPath = value;
    }
    public function getPath(Void):String{
        return this.sPath;
    }
    
    //Probs
    public function setProperties(value:Object):Void{
        this.oProp = value;
    }
    public function getProperties(Void):Object{
        return this.oProp;
    }

    
}

download:

mojave · 13-05-2006, 23:59

hier noch mal zum ansehen: klick

und das bsp zum download:

bobo_k1 · 29-06-2006, 12:03

Ich hab da mal ne Frage - ich würde gerne die Klasse dynamisch befüllen über ein xml-file. Kannst du mir eventuell auf die Sprünge helfen wie ich das realisere?

Gruss Boris

mojave · 29-06-2006, 12:12

du musst einfach die daten aus deinem xml file lesen und die bildnamen in einem array speichern und diesen dann der slideshow übergeben.

deineSlideShow.setBilder(bildArray);

bobo_k1 · 29-06-2006, 15:56

also die Bilder liest die Slideshow wunderbar ein - das sehe ich im trace-Panel. Aber leider spielt sie nicht ab. So sieht mein Code aus (also der Teil mit der Slideshow).

PHP-Code:

  var slidershow:SlideShow = new SlideShow();

slidershow.setTarget(loader2);

slidershow.setBilder(itemIMG);

Gruss Boris

PS: deine Website ist ein Augenschmaus

bobo_k1 · 29-06-2006, 16:07

Braucht das Ding eigentlich zwingend eine 8er-Umgebung. Ich würde es so gerne für den 6-er exportieren.

mojave · 29-06-2006, 16:43

nein die 8ter ist nicht notwendig. die 7er ist noch drin. man braucht as2 unterstützung. mit flash player 6 kompilliert sehe ich auch keine bilder bei meinem beispiel.

ansonsten solltest du die sekunden noch setzen.

PHP-Code:

  setTarget(mcTarget);
        setSeconds(seconds);
        setPath(sPath);//pfad zu den bildern. nicht unbedingt setzen
        setProperties(oProp);//props obj für dem moviecliploader - nicht unbedingt setzen
        setBilder(aBilder);//startet slideshow

edit:

in meinem bsp habe ich folgendermaßen instanziiert/initialisiert:

PHP-Code:

  import de.sonntagsfarben.animation.SlideShow;
var aBilder:Array = ['1.gif','2.gif','3.gif','4.gif'];
var slideShow:SlideShow = new SlideShow(mcHolder,aBilder,4,'bilder/',null);

download:
[STUFF] SlideShow

suicidegirl · 06-07-2006, 14:45

ich versuche gerade diese diashow zu adaptieren und bekomme es einfach nicht hin das array für die bilder dynamisch zu füllen. bei mir sieht es so aus:

PHP-Code:

  var aBilder:Array = [];

//

meinXML = new XML();

meinXML.ignoreWhite = true;

meinXML.load(pfad);

meinXML.onLoad = function(status) {

    if (status) {

        tempxml = meinXML.firstChild.childNodes;

        initPics();

        delete meinXML;

    }

};

function initPics() {

    for (var i = 1; i<=tempxml.length; i++) {

        var pic = tempxml[i-1].attributes.picGross;

        aBilder.push(pic);

    }

}

var slideShow:SlideShow = new SlideShow(mcHolder, aBilder, 4, '/demo2/bilder/', null);

kann jmd. sagen, was ich falsch mach?

mojave · 06-07-2006, 17:15

vielleicht:

PHP-Code:

  /demo2/bilder/

umwandeln in:

PHP-Code:

  demo2/bilder/

und was sagt:

PHP-Code:

  trace(aBilder);

?

besitzt dein film überhaupt einen mc: mcHolder

suicidegirl · 06-07-2006, 18:50

mcHolder ist vorhanden. mit den verschiedenen pfad angaben habe ich es auch schon probiert. hat alles irgendwie nicht hingehauen. auch mit hart verdrahteten http://...-pfaden.

suicidegirl · 07-07-2006, 09:48

irgendwie schaff ich es nicht, dass array zu füllen. kann mir jemand sagen, warum das so nicht kalppt? die var pic enthält den korrekten dateinamen, nur wird es so nicht ins array aufgenommen?!?!

PHP-Code:

  import de.sonntagsfarben.animation.SlideShow; 

var tempxml; 

var fehler; 

var ordner = "http://www.domain.de/demo2/bilder/"; 

var pfad = "http://www.domain.de/cms/serv/xml.php"+_root.parameter; 

var aBilder:Array = new Array(); 

function initPics() { 

    for (var i = 1; i<=tempxml.length; i++) { 

        var pic = tempxml[i-1].attributes.picGross; 

        _root.aBilder.push(pic); 

        fehler += pic; // ergibt die richtigen bilder 

        fehler += _root.aBilder[i]; // bilder nicht ins array eingefügt!!! 

        fehler += "\n"; 

    } 

} 

meinXML = new XML(); 

meinXML.ignoreWhite = true; 

meinXML.load(pfad); 

meinXML.onLoad = function(status) { 

    if (status) { 

        tempxml = meinXML.firstChild.childNodes; 

        fehler = ""; 

        initPics(); 

        delete meinXML; 

    } else { 

        fehler = "Leider keine Bilder vorhanden."; 

    } 

}; 

var slideShow:SlideShow = new SlideShow(mcHolder, _root.aBilder, 4, ordner, null); 

stop();

kugelfunk · 07-07-2006, 11:24

Der Einfachheit halber kann man auch statt einer XML-Datei ein LoadVars-Objekt benutzen, das die Namen der Bilder aus einem simplen Textfile ausliest, welches wiederum dynamisch per PHP erstellt wird. Dadurch umgeht man das manuelle Anlegen einer XML- oder Textdatei. Bei jedem Aufruf werden automatisch alle Bilder in einem bestimmten Ordner an den Flashfilm übergeben (genauer gesagt an das Array, also identisch zu dem, wie es auch in den vorigen Posts gemacht wurde).

PHP-Script namens "bilder.php":

PHP-Code:

  <?
/**
 * Liest die Bilder aus einem Unterverzeichnis "bilder" und gibt sie als komma-separierten String aus
 *
 */
 
$handle = opendir("./bilder/");
$filenames = array();

while($file = readdir($handle)) {
   if($file == '.' || $file == '..' || substr($file, -3)!="jpg") continue;
   $filenames[] = $file;
}

closedir($handle);

sort($filenames, SORT_STRING); //Bilder alphabetisch sortieren?
echo "bilder=";
if(count($filenames) < 1 || empty($filenames[0])) {
   echo 'null';
}
else
$gesamt = "";
{
    for($i=0; $i < count($filenames); $i++)
       {
        $gesamt .= $filenames[$i];
        if($i < count($filenames) - 1)
        {
            $gesamt .= ",";
        }
    }

    echo $gesamt;
}
?>

Das LoadVars-Objekt innerhalb des Flash-Scripts einfügen:

PHP-Code:

  lv = new LoadVars();
lv.onLoad = bilderLaden;
lv.load("bilder.php");

//Funktion, die aufgerufen wird, sobald Flash die Bildernamen bekommen hat
function bilderLaden(success:Boolean):Void
{
    if(success)
    {
        aBilder = this.lv.bilder.split(","); //Bildernamen an Array übergeben
        //Code zum Starten der Slideshow hier einfügen
    }
    else
    {
        trace("Fehler beim Laden aus bilder.php");
    }
}

xlive · 18-07-2006, 16:16

hi,

so funzt das einlesen aus der xml:

PHP-Code:

  import de.sonntagsfarben.animation.SlideShow;

var tempxml:XMLNode;

var pic:XMLNode;

var amountNodes:Number;

var fehler;

var ordner:String = "bilder/";

var pfad:String = "data/img.xml";

var aBilder:Array = new Array();

function initPics()

{

    //trace ("length: " + tempxml.length);

    for (var i = 0; i<amountNodes; i++)

    {

        //var pic = tempxml[i-1].attributes.picGross;

        pic = meinXML.firstChild.childNodes[i].firstChild.nodeValue;

        //trace("pic: "+pic);

        aBilder.push(pic);

        //trace("aBilder: "+aBilder);

        fehler += pic;

        // ergibt die richtigen bilder  

        fehler += aBilder[i];

        // bilder nicht ins array eingefügt!!!  

        fehler += "\n";

    }

    startShow();

}

var meinXML:XML = new XML();

meinXML.ignoreWhite = true;

meinXML.load(pfad);

meinXML.onLoad = function(status)

{

    if (status)

    {

        tempxml = meinXML.firstChild;

        amountNodes = meinXML.firstChild.childNodes.length;

        trace ("amountNodes: " + amountNodes);

        //bildname = mein_xml.firstChild.childNodes[paktBild].attributes.name;

        fehler = "";

        initPics();

        delete meinXML;

    }

    else

    {

        fehler = "Leider keine Bilder vorhanden.";

    }

};

startShow = function ():Void

{

    //trace("array: "+aBilder);

    var slideShow:SlideShow = new SlideShow(mcHolder, aBilder, 5, ordner, null);

};

jetzt soll das elegante script noch um drei punkte aufgebohrt werden.
1. bei klick auf die bilder soll jeweils auf die passende url verlinkt werden die in der xml als attribut steht.
2. ein Stop-button
3. und ein Play-button
sollen für den betrachter die interaktion ermöglichen.

wer einen guten lösungsansatz hat?!

grüße xlive

xlive · 25-07-2006, 15:12

hi,

das einlesen der xml sowie die verlinkung funktionieren. leider funzt das mit dem play-btn nicht so recht. das bild bei dem gestoppt wurde ist dann weiterhin zu sehen?!

PHP-Code:

  import de.sonntagsfarben.animation.SlideShow;

var tempxml:XMLNode;

var pic:XMLNode;

var link:XMLNode;

var amountNodes:Number;

var fehler;

var ordner:String = "bilder/";

var pfad:String = "data/img.xml";

var aBilder:Array = new Array();

var aLink:Array = new Array();

var slideShow:SlideShow;

function initPics()

{

    //trace ("length: " + tempxml.length);

    for (var i = 0; i<amountNodes; i++)

    {

        pic = meinXML.firstChild.childNodes[i].firstChild.nodeValue;

        link = meinXML.firstChild.childNodes[i].attributes.link;

        aLink.push(link);

        aBilder.push(pic);

        //

        fehler += pic;

        // ergibt die richtigen bilder  

        fehler += aBilder[i];

        // bilder nicht ins array eingefügt!!!  

        fehler += "\n";

    }

    startShow();

}

var meinXML:XML = new XML();

meinXML.ignoreWhite = true;

meinXML.load(pfad);

meinXML.onLoad = function(status)

{

    if (status)

    {

        tempxml = meinXML.firstChild;

        amountNodes = meinXML.firstChild.childNodes.length;

        fehler = "";

        initPics();

        delete meinXML;

    }

    else

    {

        fehler = "Leider keine Bilder vorhanden.";

    }

};

startShow = function ():Void

{

    slideShow = new SlideShow(mcHolder, aBilder, aLink, 6, ordner, null);

};

//

//

mcHolder.onRelease = function()

{

    getURL(slideShow.getNode(), "_blank");

};

btnPlay.onRelease = function()

{

    slideShow.starts();

};

btnPause.onRelease = function()

{

    slideShow.pause();

};

PHP-Code:

  /*

* SlideShow

* @author: Sönke Kluth

* 

* falls flash mit seiner sicherheit spinnt: 

* System.security.allowDomain("http://domain");

*/

import mx.transitions.*;

import mx.transitions.easing.*;

class de.sonntagsfarben.animation.SlideShow

{

    private var mcTarget:MovieClip;

    private var aBilder:Array;

    private var aLink:Array;

    private var aHolder:Array;

    private var oProp:Object;

    private var sPath:String;

    private var nCurrent:Number;

    private var seconds:Number;

    private var nInterval:Number;

    private var mlLoader:MovieClipLoader;

    private var mlListener:Object;

    private var isStarted:Boolean;

    private var xmlLink;

    //

    //CONSTRUCTOR

    public function SlideShow(mcTarget:MovieClip, aBilder:Array, aLink:Array, seconds:Number, sPath:String, oProp:Object)

    {

        setTarget(mcTarget);

        setSeconds(seconds);

        setPath(sPath);

        setProperties(oProp);

        setBilder(aBilder);

        setLink(aLink);

        //startet slideshow

    }

    //

    //    END CONSTRUCTOR

    //

    //    ========================================================================

    //                                PRIVATE FUNCTIONS

    //    ========================================================================

    //

    private function setup(Void):Void

    {

        //tr("SlideShow: setup()");

        mlLoader = new MovieClipLoader();

        initListeners();

        createBilderHolder();

        nCurrent = 0;

    }

    private function createBilderHolder(Void):Void

    {

        for (var i:Number = 0; i<aHolder.length; i++)

        {

            aHolder[i].removeMovieClip();

        }

        aHolder = new Array();

        for (var i:Number = 0; i<aBilder.length; i++)

        {

            var target:MovieClip = mcTarget.createEmptyMovieClip("mcHolder_"+i, mcTarget.getNextHighestDepth());

            aHolder[i] = target;

            loadBild(aBilder[i], target);

        }

    }

    private function loadBild(src:String, target:MovieClip):Void

    {

        //tr("SlideShow: loadBild("+src+")");

        mlLoader.loadClip(this.getPath()+src, target);

        mlLoader.addListener(mlListener);

    }

    private function next(Void):Void

    {

        //tr("SlideShow: next()");

        if (!isStarted)

        {

            isStarted = true;

            (aHolder.length<=1) ? fadeInOutImage(aHolder[nCurrent], false) : fadeInOutImage(aHolder[nCurrent], true);

            return;

        }

        clearInterval(nInterval);

        nCurrent = (nCurrent<aHolder.length-1) ? ++nCurrent : 0;

        fadeInOutImage(aHolder[nCurrent], true);

    }

    private function fadeInOutImage(src:MovieClip, hasNext:Boolean):Void

    {

        //tr("SlideShow: fadeInOutImage("+src+")");

        setNode(nCurrent);

        var scope = this;

        clearInterval(nInterval);

        src._alpha = 100;

        TransitionManager.start(src, {type:Fade, direction:0, duration:2, easing:Regular.easeOut});

        if (!hasNext)

        {

            return;

        }

        nInterval = setInterval(function ()

        {

            clearInterval(scope.nInterval);

            scope.next();

            TransitionManager.start(src, {type:Fade, direction:1, duration:2, easing:Regular.easeOut});

        }, seconds);

    }

    private function initListeners():Void

    {

        var scope:SlideShow = this;

        mlListener = new Object();

        mlListener.onLoadStart = function(mcLoaded:MovieClip)

        {

            mcLoaded._alpha = 0;

        };

        //mlListener.onLoadProgress  = function(mcLoaded:MovieClip){}

        //mlListener.onLoadComplete = function(mcLoaded:MovieClip, httpStatus:Number) {}

        //mlListener.onLoadError = function(mcLoaded:MovieClip, errorCode:String, httpStatus:Number) {}

        mlListener.onLoadInit = function(mcLoaded:MovieClip)

        {

            //scope.tr(mcLoaded, "  geladen");

            mcLoaded._alpha = 0;

            for (var i in scope.oProp)

            {

                mcLoaded[i] = scope.oProp[i];

            }

            if (mcLoaded._name == 'mcHolder_0')

            {

                scope.start();

            }

        };

    }

    private function deleteEmptyArrayValue(a:Array):Array

    {

        for (var i:Number = 0; i<a.length; i++)

        {

            if (a[i] == undefined || a[i] == '')

            {

                a.splice(i, 1);

            }

        }

        return a;

    }

    //

    public function setNode(nCurrent:Number)

    {

        //trace("xmlLink: "+ xmlLink);

        xmlLink = aLink[nCurrent];

    }

    //

    public function getNode()

    {

        //trace ("getNode()");

        return xmlLink;

    }

    //

    //    ========================================================================

    //                                PUBLIC FUNCTIONS

    //    ========================================================================

    //

    public function starts(Void):Void

    {

        //this.stop();

        next();

    }

    //start slideshow

    public function start(Void):Void

    {

        //tr("SlideShow: start()");

        this.stop();

        next();

    }

    //pause slideshow

    public function pause(Void):Void

    {

        clearInterval(nInterval);

    }

    //stop slideshow

    public function stop(Void):Void

    {

        clearInterval(nInterval);

        isStarted = false;

        nCurrent = 0;

    }

    //trace

    public function tr()

    {

        trace(arguments.join(" : "));

    }

    //

    //    ========================================================================

    //                                SETTER GETTER

    //    ========================================================================

    //

    //target

    public function setTarget(value:MovieClip):Void

    {

        this.mcTarget = value;

    }

    public function getTarget(Void):MovieClip

    {

        return this.mcTarget;

    }

    //bilder

    public function setBilder(a:Array):Void

    {

        //tr("SlideShow: setBilder("+a+")");

        this.stop();

        this.aBilder = deleteEmptyArrayValue(a);

        if (aBilder != null && aBilder.length>=1)

        {

            setup();

        }

    }

    public function getBilder(Void):Array

    {

        return this.aBilder;

    }

    //---

    //link

    public function setLink(l:Array):Void

    {

        //tr("SlideShow: setLink("+l+")");

        this.stop();

        this.aLink = deleteEmptyArrayValue(l);

        if (aLink != null && aLink.length>=1)

        {

            setup();

        }

    }

    public function getLink(Void):Array

    {

        return this.aLink;

    }

    //---

    //seconds

    public function setSeconds(value:Number):Void

    {

        this.seconds = value*1000;

    }

    public function getSeconds():Number

    {

        return this.seconds;

    }

    //pfad

    public function setPath(value:String):Void

    {

        if (value == null || value == '')

        {

            value = './';

        }

        this.sPath = value;

    }

    public function getPath(Void):String

    {

        return this.sPath;

    }

    //LoaderListener

    public function setProperties(value:Object):Void

    {

        this.oProp = value;

    }

    public function getProperties(Void):Object

    {

        return this.oProp;

    }

}

*gezipte dateien sind im anhang.

grüße xlive

xlive · 26-07-2006, 10:50

so funzt es. hier die geänderten zeilen. einfach die entsprechenden methoden ändern.

PHP-Code:

  private var oCurrent:Number;

 
    private function next(Void):Void

    {

        if (!isStarted)

        {

            isStarted = true;

            (aHolder.length<=1) ? fadeInOutImage(aHolder[nCurrent], false) : fadeInOutImage(aHolder[nCurrent], true);

            return;

        }

        oCurrent = nCurrent;

        clearInterval(nInterval);

        nCurrent = (nCurrent<aHolder.length-1) ? ++nCurrent : 0;

        fadeInOutImage(aHolder[nCurrent], true);

    }

    

    

    public function starts(Void):Void

    {

        next();

        TransitionManager.start(aHolder[oCurrent], {type:Fade, direction:1, duration:1, easing:Regular.easeOut});

    }

grüße xlive

21-04-2006, 20:21	#1 (permalink)
mojave dreizeiler Registriert seit: Sep 2004 Ort: Berlin Beiträge: 1.411	[STUFF] SlideShow eine einfache SlideShow: usage: PHP-Code: `var slideShow:SlideShow = new SlideShow(mc,arrayBilderNamen,sekunden,pfadZuBildern,initialisierungsObjekt);` es kann ebenfalls ein objekt ohne konstruktorparameter erzeugt und über setter initialisiert werden. zur laufzeit: setBilder(aBilder:Array); initialisiert die slidshow mit neuen bildern. so kann man zwischen verschiedenen slideshows switchen. bietet sich vielleicht an für etwas wie (urlaubsbilder, hansgeburtstagsbilder, bananebilder) PHP-Code: import mx.transitions.; import mx.transitions.easing.; class SlideShow{ private var mcTarget:MovieClip; private var aBilder:Array; private var aHolder:Array; private var oProp:Object; private var sPath:String; private var nCurrent:Number; private var seconds:Number; private var nInterval:Number; private var mlLoader:MovieClipLoader; private var mlListener:Object; private var isStarted:Boolean; // // CONSTRUCTOR // public function SlideShow(mcTarget:MovieClip,aBilder:Array,seconds:Number,sPath:String,oProp:Object){ setTarget(mcTarget); setSeconds(seconds); setPath(sPath); setProperties(oProp); setBilder(aBilder);//startet slideshow } // // END CONSTRUCTOR // // ======================================================================== // PRIVATE FUNCTIONS // ======================================================================== // private function setup(Void):Void{ tr("SlideShow: setup()"); mlLoader = new MovieClipLoader(); initListeners(); createBilderHolder(); nCurrent = 0; } private function createBilderHolder(Void):Void{ for(var i:Number = 0;i<aHolder.length;i++){ aHolder[i].removeMovieClip(); } aHolder = new Array(); for(var i:Number = 0; i< aBilder.length; i++){ var target:MovieClip = mcTarget.createEmptyMovieClip("mcHolder_"+i,mcTarget.getNextHighestDepth()); aHolder[i] = target; loadBild(aBilder[i],target); } } private function loadBild(src:String,target:MovieClip):Void{ tr("SlideShow: loadBild("+src+")") mlLoader.loadClip (this.getPath()+src, target); mlLoader.addListener(mlListener); } private function next(Void):Void{ tr("SlideShow: next()") if(!isStarted){ isStarted = true; (aHolder.length<=1)? fadeInOutImage(aHolder[0],false) : fadeInOutImage(aHolder[0],true); return; } clearInterval(nInterval); nCurrent = (nCurrent<aHolder.length-1)? ++nCurrent : 0; fadeInOutImage(aHolder[nCurrent],true); } private function fadeInOutImage(src:MovieClip,hasNext:Boolean):Void{ tr("SlideShow: fadeInOutImage("+src+")"); var scope = this; clearInterval(nInterval); src._alpha = 100; TransitionManager.start(src,{type:PixelDissolve,direction:0,duration:1,easing:Regular.easeOut,xSections:20,ySections:20}); if(!hasNext) return; nInterval = setInterval(function(){ clearInterval(scope.nInterval); scope.next(); TransitionManager.start(src,{type:PixelDissolve,direction:1,duration:1,easing:Regular.easeOut,xSections:20,ySections:20}); },seconds); } private function initListeners():Void{ var scope:SlideShow = this; mlListener = new Object(); mlListener.onLoadStart = function(mcLoaded:MovieClip){ mcLoaded._alpha = 0; } //mlListener.onLoadProgress = function(mcLoaded:MovieClip){} //mlListener.onLoadComplete = function(mcLoaded:MovieClip, httpStatus:Number) {} //mlListener.onLoadError = function(mcLoaded:MovieClip, errorCode:String, httpStatus:Number) {} mlListener.onLoadInit = function(mcLoaded:MovieClip){ scope.tr(mcLoaded," geladen"); mcLoaded._alpha = 0; for(var i in scope.oProp){ mcLoaded[i] = scope.oProp[i]; } if(mcLoaded._name == 'mcHolder_0'){ scope.start(); } } } private function deleteEmptyArrayValue(a:Array):Array{ for (var i:Number = 0; i<a.length;i++){ if(a[i] == undefined \|\| a[i] == ''){ a.splice(i,1); } } return a; } // // ======================================================================== // PUBLIC FUNCTIONS // ======================================================================== // //start slideshow public function start(Void):Void{ tr("SlideShow: start()") this.stop(); next(); } //pause slideshow public function pause(Void):Void{ clearInterval(nInterval); } //stop slideshow public function stop(Void):Void{ clearInterval(nInterval); isStarted = false; nCurrent = 0; } //trace public function tr () { trace (arguments.join (" : ")); } // // ======================================================================== // SETTER GETTER // ======================================================================== // //target public function setTarget(value:MovieClip):Void{ this.mcTarget = value; } public function getTarget(Void):MovieClip{ return this.mcTarget; } //bilder public function setBilder(a:Array):Void{ tr("SlideShow: setBilder("+a+")"); this.stop(); this.aBilder = deleteEmptyArrayValue(a); if(aBilder != null && aBilder.length>=1) setup(); } public function getBilder(Void):Array{ return this.aBilder; } //seconds public function setSeconds(value:Number):Void{ this.seconds = value1000; } public function getSeconds():Number{ return this.seconds; } //pfad public function setPath(value:String):Void{ if(value == null \|\| value == '') value = './'; this.sPath = value; } public function getPath(Void):String{ return this.sPath; } //Probs public function setProperties(value:Object):Void{ this.oProp = value; } public function getProperties(Void):Object{ return this.oProp; } } download: Geändert von mojave (18-11-2006 um 02:52 Uhr)*

13-05-2006, 23:59	#2 (permalink)
mojave dreizeiler Registriert seit: Sep 2004 Ort: Berlin Beiträge: 1.411	hier noch mal zum ansehen: klick und das bsp zum download: Geändert von mojave (18-11-2006 um 02:52 Uhr)

29-06-2006, 12:03	#3 (permalink)
bobo_k1 Trennschleifer Registriert seit: Apr 2004 Ort: Hamburg Beiträge: 1.282	Slideshow dynamisch befüllen Ich hab da mal ne Frage - ich würde gerne die Klasse dynamisch befüllen über ein xml-file. Kannst du mir eventuell auf die Sprünge helfen wie ich das realisere? Gruss Boris

29-06-2006, 15:56	#5 (permalink)
bobo_k1 Trennschleifer Registriert seit: Apr 2004 Ort: Hamburg Beiträge: 1.282	also die Bilder liest die Slideshow wunderbar ein - das sehe ich im trace-Panel. Aber leider spielt sie nicht ab. So sieht mein Code aus (also der Teil mit der Slideshow). PHP-Code: `var slidershow:SlideShow = new SlideShow(); slidershow.setTarget(loader2); slidershow.setBilder(itemIMG);` Gruss Boris PS: deine Website ist ein Augenschmaus

29-06-2006, 16:43	#7 (permalink)
mojave dreizeiler Registriert seit: Sep 2004 Ort: Berlin Beiträge: 1.411	nein die 8ter ist nicht notwendig. die 7er ist noch drin. man braucht as2 unterstützung. mit flash player 6 kompilliert sehe ich auch keine bilder bei meinem beispiel. ansonsten solltest du die sekunden noch setzen. PHP-Code: `setTarget(mcTarget); setSeconds(seconds); setPath(sPath);//pfad zu den bildern. nicht unbedingt setzen setProperties(oProp);//props obj für dem moviecliploader - nicht unbedingt setzen setBilder(aBilder);//startet slideshow` edit: in meinem bsp habe ich folgendermaßen instanziiert/initialisiert: PHP-Code: `import de.sonntagsfarben.animation.SlideShow; var aBilder:Array = ['1.gif','2.gif','3.gif','4.gif']; var slideShow:SlideShow = new SlideShow(mcHolder,aBilder,4,'bilder/',null);` download: [STUFF] SlideShow Geändert von mojave (29-06-2006 um 16:47 Uhr)

29-06-2006, 12:12	#4 (permalink)
mojave dreizeiler Registriert seit: Sep 2004 Ort: Berlin Beiträge: 1.411	du musst einfach die daten aus deinem xml file lesen und die bildnamen in einem array speichern und diesen dann der slideshow übergeben. deineSlideShow.setBilder(bildArray);

29-06-2006, 16:07	#6 (permalink)
bobo_k1 Trennschleifer Registriert seit: Apr 2004 Ort: Hamburg Beiträge: 1.282	Braucht das Ding eigentlich zwingend eine 8er-Umgebung. Ich würde es so gerne für den 6-er exportieren.

06-07-2006, 14:45	#8 (permalink)
suicidegirl Neuer User Registriert seit: May 2005 Beiträge: 99	ich versuche gerade diese diashow zu adaptieren und bekomme es einfach nicht hin das array für die bilder dynamisch zu füllen. bei mir sieht es so aus: PHP-Code: var aBilder:Array = []; // meinXML = new XML(); meinXML.ignoreWhite = true; meinXML.load(pfad); meinXML.onLoad = function(status) { if (status) { tempxml = meinXML.firstChild.childNodes; initPics(); delete meinXML; } }; function initPics() { for (var i = 1; i<=tempxml.length; i++) { var pic = tempxml[i-1].attributes.picGross; aBilder.push(pic); } } var slideShow:SlideShow = new SlideShow(mcHolder, aBilder, 4, '/demo2/bilder/', null); kann jmd. sagen, was ich falsch mach?

06-07-2006, 17:15	#9 (permalink)
mojave dreizeiler Registriert seit: Sep 2004 Ort: Berlin Beiträge: 1.411	vielleicht: PHP-Code: `/demo2/bilder/` umwandeln in: PHP-Code: `demo2/bilder/` und was sagt: PHP-Code: `trace(aBilder);` ? besitzt dein film überhaupt einen mc: mcHolder Geändert von mojave (06-07-2006 um 17:17 Uhr)

06-07-2006, 18:50	#10 (permalink)
suicidegirl Neuer User Registriert seit: May 2005 Beiträge: 99	mcHolder ist vorhanden. mit den verschiedenen pfad angaben habe ich es auch schon probiert. hat alles irgendwie nicht hingehauen. auch mit hart verdrahteten http://...-pfaden.

07-07-2006, 09:48	#11 (permalink)
suicidegirl Neuer User Registriert seit: May 2005 Beiträge: 99	irgendwie schaff ich es nicht, dass array zu füllen. kann mir jemand sagen, warum das so nicht kalppt? die var pic enthält den korrekten dateinamen, nur wird es so nicht ins array aufgenommen?!?! PHP-Code: import de.sonntagsfarben.animation.SlideShow; var tempxml; var fehler; var ordner = "http://www.domain.de/demo2/bilder/"; var pfad = "http://www.domain.de/cms/serv/xml.php"+_root.parameter; var aBilder:Array = new Array(); function initPics() { for (var i = 1; i<=tempxml.length; i++) { var pic = tempxml[i-1].attributes.picGross; _root.aBilder.push(pic); fehler += pic; // ergibt die richtigen bilder fehler += _root.aBilder[i]; // bilder nicht ins array eingefügt!!! fehler += "\n"; } } meinXML = new XML(); meinXML.ignoreWhite = true; meinXML.load(pfad); meinXML.onLoad = function(status) { if (status) { tempxml = meinXML.firstChild.childNodes; fehler = ""; initPics(); delete meinXML; } else { fehler = "Leider keine Bilder vorhanden."; } }; var slideShow:SlideShow = new SlideShow(mcHolder, _root.aBilder, 4, ordner, null); stop();

07-07-2006, 11:24	#12 (permalink)
kugelfunk Neuer User Registriert seit: Sep 2004 Beiträge: 632	Der Einfachheit halber kann man auch statt einer XML-Datei ein LoadVars-Objekt benutzen, das die Namen der Bilder aus einem simplen Textfile ausliest, welches wiederum dynamisch per PHP erstellt wird. Dadurch umgeht man das manuelle Anlegen einer XML- oder Textdatei. Bei jedem Aufruf werden automatisch alle Bilder in einem bestimmten Ordner an den Flashfilm übergeben (genauer gesagt an das Array, also identisch zu dem, wie es auch in den vorigen Posts gemacht wurde). PHP-Script namens "bilder.php": PHP-Code: <? /** * Liest die Bilder aus einem Unterverzeichnis "bilder" und gibt sie als komma-separierten String aus * / $handle = opendir("./bilder/"); $filenames = array(); while($file = readdir($handle)) { if($file == '.' \|\| $file == '..' \|\| substr($file, -3)!="jpg") continue; $filenames[] = $file; } closedir($handle); sort($filenames, SORT_STRING); //Bilder alphabetisch sortieren? echo "bilder="; if(count($filenames) < 1 \|\| empty($filenames[0])) { echo 'null'; } else $gesamt = ""; { for($i=0; $i < count($filenames); $i++) { $gesamt .= $filenames[$i]; if($i < count($filenames) - 1) { $gesamt .= ","; } } echo $gesamt; } ?> Das LoadVars-Objekt innerhalb des Flash-Scripts einfügen: PHP-Code: lv = new LoadVars(); lv.onLoad = bilderLaden; lv.load("bilder.php"); //Funktion, die aufgerufen wird, sobald Flash die Bildernamen bekommen hat function bilderLaden(success:Boolean):Void { if(success) { aBilder = this.lv.bilder.split(","); //Bildernamen an Array übergeben //Code zum Starten der Slideshow hier einfügen } else { trace("Fehler beim Laden aus bilder.php"); } } Geändert von kugelfunk (08-07-2006 um 09:07 Uhr)*

18-07-2006, 16:16	#13 (permalink)
xlive FBx Registriert seit: May 2003 Beiträge: 968	hi, so funzt das einlesen aus der xml: PHP-Code: import de.sonntagsfarben.animation.SlideShow; var tempxml:XMLNode; var pic:XMLNode; var amountNodes:Number; var fehler; var ordner:String = "bilder/"; var pfad:String = "data/img.xml"; var aBilder:Array = new Array(); function initPics() { //trace ("length: " + tempxml.length); for (var i = 0; i<amountNodes; i++) { //var pic = tempxml[i-1].attributes.picGross; pic = meinXML.firstChild.childNodes[i].firstChild.nodeValue; //trace("pic: "+pic); aBilder.push(pic); //trace("aBilder: "+aBilder); fehler += pic; // ergibt die richtigen bilder fehler += aBilder[i]; // bilder nicht ins array eingefügt!!! fehler += "\n"; } startShow(); } var meinXML:XML = new XML(); meinXML.ignoreWhite = true; meinXML.load(pfad); meinXML.onLoad = function(status) { if (status) { tempxml = meinXML.firstChild; amountNodes = meinXML.firstChild.childNodes.length; trace ("amountNodes: " + amountNodes); //bildname = mein_xml.firstChild.childNodes[paktBild].attributes.name; fehler = ""; initPics(); delete meinXML; } else { fehler = "Leider keine Bilder vorhanden."; } }; startShow = function ():Void { //trace("array: "+aBilder); var slideShow:SlideShow = new SlideShow(mcHolder, aBilder, 5, ordner, null); }; jetzt soll das elegante script noch um drei punkte aufgebohrt werden. 1. bei klick auf die bilder soll jeweils auf die passende url verlinkt werden die in der xml als attribut steht. 2. ein Stop-button 3. und ein Play-button sollen für den betrachter die interaktion ermöglichen. wer einen guten lösungsansatz hat?! grüße xlive Geändert von xlive (18-07-2006 um 17:39 Uhr)

26-07-2006, 10:50	#15 (permalink)
xlive FBx Registriert seit: May 2003 Beiträge: 968	so funzt es. hier die geänderten zeilen. einfach die entsprechenden methoden ändern. PHP-Code: private var oCurrent:Number; private function next(Void):Void { if (!isStarted) { isStarted = true; (aHolder.length<=1) ? fadeInOutImage(aHolder[nCurrent], false) : fadeInOutImage(aHolder[nCurrent], true); return; } oCurrent = nCurrent; clearInterval(nInterval); nCurrent = (nCurrent<aHolder.length-1) ? ++nCurrent : 0; fadeInOutImage(aHolder[nCurrent], true); } public function starts(Void):Void { next(); TransitionManager.start(aHolder[oCurrent], {type:Fade, direction:1, duration:1, easing:Regular.easeOut}); } grüße xlive

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln