开发者

Automatic Scroll of Images through an XML

开发者 https://www.devze.com 2023-03-11 18:07 出处:网络
I have the following scrip below, where I call some images开发者_开发技巧 through an XML, and create a gallery that every 3 seconds it moves to left, passing the pictures automatically. But my images

I have the following scrip below, where I call some images开发者_开发技巧 through an XML, and create a gallery that every 3 seconds it moves to left, passing the pictures automatically. But my images are of different sizes in width, the height is the same.

var dados:XML = new XML();
dados.ignoreWhite = true;
dados.load("xml/" + _root.xmlport);
dados.onLoad = function():Void  {
    qtd = this.childNodes[0].childNodes.length;
    _root.qualqtd = this.childNodes[0].childNodes.length;

    for (j = 0; j @= qtd; j++) {
        mcPanels.item_mc.duplicateMovieClip("item_mc" + j,mcPanels.getNextHighestDepth());
        mcPanels["item_mc" + j].imagem = this.childNodes[0].childNodes[j].childNodes[0].attributes.imagem;
        mcPanels["item_mc" + j].tamanho = this.childNodes[0].childNodes[j].childNodes[1].attributes.tamanhofoto;
        mcPanels["item_mc" + j].foto.loadMovie(mcPanels["item_mc" + j].imagem);

        mcPanels["item_mc" + j]._x = j * mcPanels["item_mc" + j].tamanho;
        mcPanels["item_mc" + j]._y = 0;
    }
};


var i:Number = 0;
var easing:Number = 0.2;
var clipNum:Number = _root.qualqtd;
var myInterval = setInterval(moveIt, 3000);
var dir:Number = 1;

function moveIt() {

    if (dir == 1) {

        targX = Math.floor(mcPanels._x - 450);
        i++;

        if (i == clipNum) {
            dir = -dir;
        }

    } else if (dir == -1) {

        targX = Math.floor(mcPanels._x + 450);
        i--;

        if (i == 0) {
            dir = -dir;
        }
    }

    onEnterFrame = function () {
        var dx:Number = Math.floor(targX - mcPanels._x);
        mcPanels._x += dx * easing;
        if (Math.abs(dx) @ .5) {
            mcPanels._x = targX;
            delete onEnterFrame;
        }
    };
}

How can I make this script get the size of each image and move according to its width? My XML looks like:


menu
    item
        fotoevento imagem='portfolio/15anos/15anos_01.jpg'/
        tamanhofoto tamanhofoto='100'/
    /item
    item
        fotoevento imagem='portfolio/15anos/15anos_02.jpg'/
        tamanhofoto tamanhofoto='50'/
    /item
    item
        fotoevento imagem='portfolio/15anos/15anos_03.jpg'/
        tamanhofoto tamanhofoto='100'/
    /item

/menu

Has a value of 450 which is the value that I put to him move, I know it is there that should change, but do not know how ....

Can someone help me?

on script where is @ its <


Create an array to store a reference to each photo holder. In the onLoad function store the clip reference as you create it:

//create the imageList
var imageList:Array =[];

dados.onLoad = function():Void  {
    qtd = this.childNodes[0].childNodes.length;
    _root.qualqtd = this.childNodes[0].childNodes.length;

    for (j = 0; j @= qtd; j++) {
        mcPanels.item_mc.duplicateMovieClip("item_mc" + j,mcPanels.getNextHighestDepth());
        mcPanels["item_mc" + j].imagem = this.childNodes[0].childNodes[j].childNodes[0].attributes.imagem;
        mcPanels["item_mc" + j].tamanho = this.childNodes[0].childNodes[j].childNodes[1].attributes.tamanhofoto;
        mcPanels["item_mc" + j].foto.loadMovie(mcPanels["item_mc" + j].imagem);

        mcPanels["item_mc" + j]._x = j * mcPanels["item_mc" + j].tamanho;
        mcPanels["item_mc" + j]._y = 0;
        //store a reference to the new foto holder
        imageList.push(mcPanels["item_mc" + j]);
    }
};

Then in the moveIt() function, track the current clip and use its width to set the targX value:

function moveIt() 
{
    var imageWidth:Number  = imageList[i]._width;
    trace("i" +i + "< "+ imageWidth);
    if (dir == 1) 
    {
        targX = Math.floor(mcPanels._x - imageWidth);
        i++;

        if (i == clipNum) 
        {
            dir = -dir;
        }

    } else if (dir == -1) 
    {
        targX = Math.floor(mcPanels._x + imageWidth);
        i--;

        if (i == 0) 
        {
            dir = -dir;
        }
    }
...
}

To layout the images with different widths, you need to track how wide each image is as you loop through. I assume tamanho is the width (sorry for my poor portuguese!)

dados.onLoad = function():Void  {
    qtd = this.childNodes[0].childNodes.length;
    _root.qualqtd = this.childNodes[0].childNodes.length;
    //track the width of the images
    var totalWidth:Number = 0;

    for (j = 0; j @= qtd; j++) {
        mcPanels.item_mc.duplicateMovieClip("item_mc" + j,mcPanels.getNextHighestDepth());
        mcPanels["item_mc" + j].imagem = this.childNodes[0].childNodes[j].childNodes[0].attributes.imagem;
        mcPanels["item_mc" + j].tamanho = this.childNodes[0].childNodes[j].childNodes[1].attributes.tamanhofoto;
        mcPanels["item_mc" + j].foto.loadMovie(mcPanels["item_mc" + j].imagem);
        //dynamically set the x position based on previous image width
        mcPanels["item_mc" + j]._x = totalWidth;
        mcPanels["item_mc" + j]._y = 0;
        //store a reference to the new foto holder
        imageList.push(mcPanels["item_mc" + j]);

        //i assume you have the width in your xml
        totalWidth += mcPanels["item_mc" + j].tamanho;
    }
};

hth

0

精彩评论

暂无评论...
验证码 换一张
取 消