- Home
- Categorie
- Digital Marketing
- Grafica, Visual Design & UX
- Elenco dinamico in Flash+XML
-
Ciao,
per prima cosa usa l'XML formattato in questo modo:<?xml version="1.0" encoding="UTF-8"?> <archive> <song posizione="01" file="dati/mp3/01.mp3" artista="Paperino" titolo="Che bella Paperina"></song> <song posizione="02" file="dati/mp3/02.mp3" artista="Bugs Bunny" titolo="Evviva le carote"> </song> <song posizione="03" file="dati/mp3/03.mp3" artista="Pietro" titolo="Topolinno ti scasso"></song> </archive>
Poi crei un array dove metti tutte le clip 'riga' che contengono i campi di testo e poi ti ho preparato uno script:
var clips_array:Array=new Array(riga_0_mc,riga_1_mc,riga_2_mc); var posizioni_array:Array=new Array(); var artisti_array:Array=new Array(); var titoli_array:Array=new Array(); var xml:XML=new XML(); xml.ignoreWhite=true; xml.onLoad=function(ok:Boolean) { if(ok) { var node:XMLNode=this.firstChild; var n:Number=node.childNodes.length; for(var i:Number=0;i<n;i++) { posizioni_array.push(node.childNodes*.attributes['posizione']); artisti_array.push(node.childNodes*.attributes['artista']); titoli_array.push(node.childNodes*.attributes['titolo']); } initText(); } else trace('XML error!'); } xml.load('lista.xml'); function initText() { for(var i:Number=0;i<clips_array.length;i++) { clips_array*.nomeCampoDiTestoPosizione.text=posizioni_array*; clips_array*.nomeCampoDiTestoArtista.text=artisti_array*; clips_array*.nomeCampoDiTestoTitolo.text=titoli_array*; } }
-
Grazie Flep! Giusto qualche domandina
@Flep said:
Poi crei un array dove metti tutte le clip 'riga' che contengono i campi di testo
Come faccio???
Ti spiego cosa avevo fatto io in Flash, o meglio ti posto il codice:var container:MovieClip = setUpContainer(); var ln:Number = 15; var spacer:Number = 10; var duplicate:MovieClip; for (var i:Number = 1; i<ln; i++) { var newY:Number = i*(container._height+spacer); duplicate = container.duplicateMovieClip("clip-"+i, i, {_y:newY}); //trace(duplicate); // _level0.clip-[number] } function setUpContainer():MovieClip { var mc:MovieClip = this.createEmptyMovieClip("container", this.getNextHighestDepth()); var w:Number = 440; var h:Number = 20; mc.beginFill(0x99943E, 80); mc.lineTo(w, 0); mc.lineTo(w, h); mc.lineTo(0, h); mc.lineTo(0, 0); mc.endFill(); return mc; }
Tecnicamente questa roba mi crea 15 righe di 440x20 pixel spaziate di 10 pixel. Basta che copi il codice in un fotogramma qualsiasi di un movie vuoto per vedere l'effetto che vorrei. Come faccio però a integrare il tuo codice con questo che avevo già creato? O a creare lo stesso effetto grafico in qualche altra maniera? Alla fine dovrebbe risultare una roba tipo http://www.djilcubano.com/images/example.jpg
Il tuo codice dove va messo? Nella timeline principale?
Scusami ma mi sento molto ignorante in materia. Grazie in anticipo per l'aiuto.
Ciao ciao
-
Ciao cecco,
diventerebbe così:var clips_array:Array=new Array(); var posizioni_array:Array=new Array(); var artisti_array:Array=new Array(); var titoli_array:Array=new Array(); var container:MovieClip=setUpContainer(); var ln:Number=16; var spacer:Number=10; var duplicate:MovieClip; var xml:XML=new XML(); for (var i:Number = 1; i<ln; i++) { var newY:Number = i*(container._height+spacer); duplicate = container.duplicateMovieClip("clip-"+i, i, {_y:newY}); clips_array.push(duplicate); var field_0:TextField=duplicate.createTextField('positione_txt',duplicate.getNextHighestDepth(),0,0,0,0); var field_1:TextField=duplicate.createTextField('artista_txt',duplicate.getNextHighestDepth(),0,0,0,0); var field_2:TextField=duplicate.createTextField('titolo_txt',duplicate.getNextHighestDepth(),0,0,0,0); setText(field_0); setText(field_1); setText(field_2); field_1._x=field_0._x+field_0._width+30; field_2._x=250; // _level0.clip-[number] } xml.ignoreWhite=true; xml.onLoad=function(ok:Boolean) { if(ok) { var node:XMLNode=this.firstChild; var n:Number=node.childNodes.length; for(var i:Number=0;i<n;i++) { posizioni_array.push(node.childNodes*.attributes['posizione']); artisti_array.push(node.childNodes*.attributes['artista']); titoli_array.push(node.childNodes*.attributes['titolo']); } initText(); } else trace('XML error!'); } xml.load('lista.xml'); function initText() { for(var i:Number=0;i<clips_array.length;i++) { clips_array*.positione_txt.text=posizioni_array*; clips_array*.artista_txt.text=artisti_array*; clips_array*.titolo_txt.text=titoli_array*; //trace(clips_array*.positione_txt.text); } } function setUpContainer():MovieClip { var mc:MovieClip = this.createEmptyMovieClip("container", this.getNextHighestDepth()); var w:Number = 440; var h:Number = 20; mc.beginFill(0x99943E, 80); mc.lineTo(w, 0); mc.lineTo(w, h); mc.lineTo(0, h); mc.lineTo(0, 0); mc.endFill(); return mc; } function setText(t:TextField):Void { t.setNewTextFormat(getFormat()); t.multiline=false; t.selectable=false; t.autoSize=true; t.embedFonts=true; } function getFormat():TextFormat { var format:TextFormat=new TextFormat(); format.font='Arial'; format.color=0x0; format.size=12; return(format); }
-
Flep, posso dirti una cosa?
S E I U N G R A N D E !!!!!!!!!!!
Grazie grazie!! Funziona alla perfezione.
Non capisco solo perchè la prima casella in alto rimane vuota e le scritte partono dalla seconda. Però ho risolto così: ho piazzato questa riga in fondo al tuo codice:this.container._visible = false;
Se esiste un modo migliore o il mio non va bene dimmelo, a me sembra ok.
Un'ultima richiesta (spero :)).. E' possibile fare in modo che al clic effettuato ad esempio sul titolo parta il sample audio corrispondente indicato nell'xml?
Grazie ancora.
Cecco
-
Ciao,
questo:
this.container._visible = false;
va bene, forse si puòfare di meglio ma il tempo è quello che è...Per riprodurre il sound di ogni voce, l' XML diventa così:
<?xml version="1.0" encoding="UTF-8"?> <archive> <song posizione="01" file="dati/mp3/01.mp3" artista="Paperino" titolo="Che bella Paperina" url="http://www.miosito.it/brano_1.mp3"></song> <song posizione="02" file="dati/mp3/02.mp3" artista="Bugs Bunny" titolo="Evviva le carote" url="http://www.miosito.it/brano_2.mp3"> </song> <song posizione="03" file="dati/mp3/03.mp3" artista="Pietro" titolo="Topolinno ti scasso" url="http://www.miosito.it/brano_3.mp3"></song> <song posizione="04" file="dati/mp3/01.mp3" artista="Paperino" titolo="Che bella Paperina" url="http://www.miosito.it/brano_4.mp3"></song> <song posizione="05" file="dati/mp3/02.mp3" artista="Bugs Bunny" titolo="Evviva le carote" url="http://www.miosito.it/brano_5.mp3"> </song> <song posizione="06" file="dati/mp3/03.mp3" artista="Pietro" titolo="Topolinno ti scasso" url="http://www.miosito.it/brano_6.mp3"></song> <song posizione="07" file="dati/mp3/01.mp3" artista="Paperino" titolo="Che bella Paperina" url="http://www.miosito.it/brano_7.mp3"></song> <song posizione="08" file="dati/mp3/02.mp3" artista="Bugs Bunny" titolo="Evviva le carote" url="http://www.miosito.it/brano_8.mp3"> </song> <song posizione="09" file="dati/mp3/03.mp3" artista="Pietro" titolo="Topolinno ti scasso" url="http://www.miosito.it/brano_9.mp3"></song> <song posizione="10" file="dati/mp3/01.mp3" artista="Paperino" titolo="Che bella Paperina" url="http://www.miosito.it/brano_10.mp3"></song> <song posizione="11" file="dati/mp3/02.mp3" artista="Bugs Bunny" titolo="Evviva le carote" url="http://www.miosito.it/brano_11.mp3"> </song> <song posizione="12" file="dati/mp3/03.mp3" artista="Pietro" titolo="Topolinno ti scasso" url="http://www.miosito.it/brano_12.mp3"></song> <song posizione="13" file="dati/mp3/01.mp3" artista="Paperino" titolo="Che bella Paperina" url="http://www.miosito.it/brano_13.mp3"></song> <song posizione="14" file="dati/mp3/02.mp3" artista="Bugs Bunny" titolo="Evviva le carote" url="http://www.miosito.it/brano_14.mp3"> </song> <song posizione="15" file="dati/mp3/03.mp3" artista="Pietro" titolo="Topolinno ti scasso" url="http://www.miosito.it/brano_15.mp3"></song> </archive>
E lo script diventa così:
var clips_array:Array=new Array(); var posizioni_array:Array=new Array(); var artisti_array:Array=new Array(); var titoli_array:Array=new Array(); var url_array:Array=new Array(); var container:MovieClip=setUpContainer(); var ln:Number=16; var spacer:Number=10; var s:Sound; var xml:XML=new XML(); for (var i:Number = 1; i<ln; i++) { var newY:Number = i*(container._height+spacer); var duplicate:MovieClip=container.duplicateMovieClip("clip-"+i,i,{_y:newY}); duplicate.id=i; setEvent(duplicate); clips_array.push(duplicate); var field_0:TextField=duplicate.createTextField('positione_txt',duplicate.getNextHighestDepth(),0,0,0,0); var field_1:TextField=duplicate.createTextField('artista_txt',duplicate.getNextHighestDepth(),0,0,0,0); var field_2:TextField=duplicate.createTextField('titolo_txt',duplicate.getNextHighestDepth(),0,0,0,0); setText(field_0); setText(field_1); setText(field_2); field_1._x=field_0._x+field_0._width+30; field_2._x=250; // _level0.clip-[number] } xml.ignoreWhite=true; xml.onLoad=function(ok:Boolean) { if(ok) { var node:XMLNode=this.firstChild; var n:Number=node.childNodes.length; for(var i:Number=0;i<n;i++) { posizioni_array.push(node.childNodes*.attributes['posizione']); artisti_array.push(node.childNodes*.attributes['artista']); titoli_array.push(node.childNodes*.attributes['titolo']); url_array.push(node.childNodes*.attributes['url']); } trace(url_array); initText(); } else trace('XML error!'); } xml.load('lista.xml'); function initText() { for(var i:Number=0;i<clips_array.length;i++) { clips_array*.positione_txt.text=posizioni_array*; clips_array*.artista_txt.text=artisti_array*; clips_array*.titolo_txt.text=titoli_array*; //trace(clips_array*.positione_txt.text); } } function setUpContainer():MovieClip { var mc:MovieClip = this.createEmptyMovieClip("container", this.getNextHighestDepth()); var w:Number = 440; var h:Number = 20; mc.beginFill(0x99943E, 80); mc.lineTo(w, 0); mc.lineTo(w, h); mc.lineTo(0, h); mc.lineTo(0, 0); mc.endFill(); return mc; } function setText(t:TextField):Void { t.setNewTextFormat(getFormat()); t.multiline=false; t.selectable=false; t.autoSize=true; t.embedFonts=true; } function getFormat():TextFormat { var format:TextFormat=new TextFormat(); format.font='Arial'; format.color=0x0; format.size=12; return(format); } function setEvent(m:MovieClip):Void { m.onPress=function():Void { s.stop(); s=new Sound(); s.loadSound(url_array[this.id],true); s.start(); } }
-
Ciao Flep, scusami ancora..
Ho riscontrato un piccolo bug con l'ultimo codice, ho provato a ragionarci un pò ma mi risulta difficile capire come sistemarlo.
Cliccando sui tasti per far partire l'mp3, ho notato che la prima riga fa partire il brano 2 anzichè il primo; così la 2 fa partire il brano 3 e così via...
C'è un modo per ovviare questo problema? Anche perchè il brano 15 diventa undifined, non esistendo il file corrispondente.Cmq finora il tuo aiuto è stato fondamentale, e sono sicuro lo sarà nuovamente. Ti ringrazio ancora una volta per la disponibilità.
Ciao ciao
-
Il problema era il codice che mi avevi passato utilizzava duplicateMovieClip e un ciclo sbagliato.
Te l'ho sistemato:var clips_array:Array=new Array(); var posizioni_array:Array=new Array(); var artisti_array:Array=new Array(); var titoli_array:Array=new Array(); var url_array:Array=new Array(); var container:MovieClip=this.createEmptyMovieClip('container_mc',this.getNextHighestDepth()); var ln:Number=15; var spacer:Number=10; var s:Sound; var xml:XML=new XML(); for (var i:Number=0;i<ln;i++) { var newY:Number=i*(container._height+spacer); var duplicate:MovieClip=container.createEmptyMovieClip('clip_'+i+'_mc',container.getNextHighestDepth()); setUpContainer(duplicate); duplicate._y=duplicate._height*i+5*i; duplicate.id=i; setEvent(duplicate); clips_array.push(duplicate); var field_0:TextField=duplicate.createTextField('positione_txt',duplicate.getNextHighestDepth(),0,0,0,0); var field_1:TextField=duplicate.createTextField('artista_txt',duplicate.getNextHighestDepth(),0,0,0,0); var field_2:TextField=duplicate.createTextField('titolo_txt',duplicate.getNextHighestDepth(),0,0,0,0); setText(field_0); setText(field_1); setText(field_2); field_1._x=field_0._x+field_0._width+30; field_2._x=250; } xml.ignoreWhite=true; xml.onLoad=function(ok:Boolean) { if(ok) { var node:XMLNode=this.firstChild; var n:Number=node.childNodes.length; for(var i:Number=0;i<n;i++) { posizioni_array.push(node.childNodes*.attributes['posizione']); artisti_array.push(node.childNodes*.attributes['artista']); titoli_array.push(node.childNodes*.attributes['titolo']); url_array.push(node.childNodes*.attributes['url']); } initText(); } else trace('XML error!'); } xml.load('lista.xml'); function initText() { for(var i:Number=0;i<clips_array.length;i++) { clips_array*.positione_txt.text=posizioni_array*; clips_array*.artista_txt.text=artisti_array*; clips_array*.titolo_txt.text=titoli_array*; } } function setUpContainer(mc:MovieClip):Void { mc.beginFill(0x99943E,80); mc.lineTo(Stage.width,0); mc.lineTo(Stage.width,20); mc.lineTo(0,20); mc.lineTo(0,0); mc.endFill(); } function setText(t:TextField):Void { t.setNewTextFormat(getFormat()); t.multiline=false; t.selectable=false; t.autoSize=true; t.embedFonts=true; } function getFormat():TextFormat { var format:TextFormat=new TextFormat(); format.font='Arial'; format.color=0x0; format.size=12; return(format); } function setEvent(m:MovieClip):Void { m.onPress=function():Void { s.stop(); s=new Sound(); s.loadSound(url_array[this.id],true); s.start(); } }
-
Flep, non so che dire. E' esattamente come volevo: perfetto.
Non avrei saputo come fare altrimenti.. L'unica cosa che ero riuscito a fare era pure sbagliata
Grazie dell'aiuto.
Ciao ciao!!
-
Scusa **Flep **se intervengo in questa discussione...
Dici che si potrebbe fare la stessa cosa con delle immagini (quindi facendo piu' o meno quanto avevo chiesto in questo post: http://www.giorgiotave.it/forum/flash-actionscript/38015-gestione-immagini-movimento.html)?
Intendo sfruttando questo script e creando un xml contenente i percorsi delle immagini da visualizzare... altri suggerimenti in merito sarebbero molto graditi!Grazie!
-
Si potrebbe fare, solo che la cosa è più complessa in quanto devi caricare dei files esterni e dargli un preload per ognuno, quindi bisognerebbe lavorare per classi. In più devi fare un push in un Array di ogni immagine caricata per tenerne traccia e richiamarla quando e come ti occorre.
Mi servirebbe una mezzoretta per farti un esempio ma al momento mezzora per me è come trovare una pepita d'oro in una stalla
-
@Flep said:
Si potrebbe fare, solo che la cosa è più complessa in quanto devi caricare dei files esterni e dargli un preload per ognuno, quindi bisognerebbe lavorare per classi. In più devi fare un push in un Array di ogni immagine caricata per tenerne traccia e richiamarla quando e come ti occorre.
Mi servirebbe una mezzoretta per farti un esempio ma al momento mezzora per me è come trovare una pepita d'oro in una stalla
Direi che sei fantastico! Ottimi consigli che girero' subito agli amici del forum per vedere se qualcuno puo' darmi una mano a renderli operativi (anche a pagamento s'intende...), poi magari vi passo il codice (A GRATIS!!!) come ringraziamento...
Speriamo qualcuno riesca a sviluppare il codice!
-
Bè se cerchi qualcuno che te la faccia a pagamento, io sono disponibile.
-
@Flep said:
Bè se cerchi qualcuno che te la faccia a pagamento, io sono disponibile.
Be', ti chiedo scusa se non l'avevo specificato... sono in contatto con un altro utente ma vista la tua esperienza potrei affidare a te la cosa!
Ci sentiamo in privato, OK? Ti mando subito un PM!
-
Hey Flep, sono tornato!!! Sei contento?
Vorrei fare un'implementazione allo script, solo che come al solito non sono capace di ottenere quello che voglio, oppure ottengo cose diverse..La domanda è: sarebbe possibile fare in modo che cliccando su un brano compaia qualcosa, un pallino, un'altoparlante, una qualsiasi cosa per far capire che quella traccia sta andando? L'ideale sarebbe un movieclip, io ho provato con attachMovie ma non ne sono uscito.. Soprattutto perchè quando l'utente clicca su un brano dopo averne già ascoltato uno il movieclip dovrebbe sparire. L'idea è una cosa simile..
http://www.djjosephb.com/esempio.html
Grazie tante.
Ciao ciao
Cecco
-
Ciao,
metti all'inizio dello script:
var clip_mc:MovieClip;Poi nell'azione on Press scrivi:
clip_mc.removeMovieClip(); clip_mc.attachMovie('nome_clip','nuovo_nome_clip',_root.getNextHighestDepth()); clip_mc._x=m._x; clip_mc._y=m._y;
Sistema la _x e la _y a tuo piacere
-
Non so se sbaglio qualcosa, ma non va..
Io ho fatto un movieclip e gli ho dato l'identificatore circle_mc
Poi ho fatto le modifiche che mi hai detto e il codice è diventato questo:var clips_array:Array = new Array(); var posizioni_array:Array = new Array(); var artisti_array:Array = new Array(); var titoli_array:Array = new Array(); var url_array:Array = new Array(); var container:MovieClip = this.createEmptyMovieClip('container_mc', this.getNextHighestDepth()); var clip_mc:MovieClip; var ln:Number = 18; var spacer:Number = 10; var s:Sound; var xml:XML = new XML(); for (var i:Number = 0; i<ln; i++) { var newY:Number = i*(container._height+spacer); var duplicate:MovieClip = container.createEmptyMovieClip('clip_'+i+'_mc', container.getNextHighestDepth()); setUpContainer(duplicate); duplicate._y = duplicate._height*i+10*i; duplicate.id = i; setEvent(duplicate); clips_array.push(duplicate); var field_0:TextField = duplicate.createTextField('positione_txt', duplicate.getNextHighestDepth(), 5, 2, 0, 0); var field_1:TextField = duplicate.createTextField('artista_txt', duplicate.getNextHighestDepth(), 5, 2, 0, 0); var field_2:TextField = duplicate.createTextField('titolo_txt', duplicate.getNextHighestDepth(), 5, 2, 0, 0); setText(field_0); setText(field_1); setText(field_2); field_1._x = field_0._x+field_0._width+40; field_2._x = 230; } xml.ignoreWhite = true; xml.onLoad = function(ok:Boolean) { if (ok) { var node:XMLNode = this.firstChild; var n:Number = node.childNodes.length; for (var i:Number = 0; i<n; i++) { posizioni_array.push(node.childNodes*.attributes['posizione']); artisti_array.push(node.childNodes*.attributes['artista']); titoli_array.push(node.childNodes*.attributes['titolo']); url_array.push(node.childNodes*.attributes['url']); } initText(); } else { trace('XML error!'); } }; xml.load('produzioni/dance/dance.xml'); function initText() { for (var i:Number = 0; i<clips_array.length; i++) { clips_array*.positione_txt.text = posizioni_array*; clips_array*.artista_txt.text = artisti_array*; clips_array*.titolo_txt.text = titoli_array*; } } function setUpContainer(mc:MovieClip):Void { mc.beginFill(0x99943E, 80); mc.lineTo(440, 0); mc.lineTo(440, 20); mc.lineTo(0, 20); mc.lineTo(0, 0); mc.endFill(); } function setText(t:TextField):Void { t.setNewTextFormat(getFormat()); t.multiline = false; t.selectable = false; t.autoSize = true; t.embedFonts = true; } function getFormat():TextFormat { var format:TextFormat = new TextFormat(); format.font = "myfont"; format.color = 0xFFFFFF; format.size = 8; return (format); } function setEvent(m:MovieClip):Void { m.onPress = function():Void { s.stop(); s = new Sound(); s.loadSound(url_array[this.id], true); s.start(); clip_mc.removeMovieClip(); clip_mc.attachMovie('circle_mc', 'circle'+i+'_mc', _root.getNextHighestDepth()); clip_mc._x = m._x+32; clip_mc._y = m._y+3; }; }
Ma niente.. Cosa posso fare?
Grazie, ciao.
-
Questo non va bene:
'circle'+i+'_mc'la i è undefined, non sei dentro un ciclo.
Fai così:
dai nome identificatore 'mc_circle' e nuovo nome 'circle_mc'
-
Ok, fatto.. Non va
Non compare nulla, è come se non l'avessi nemmeno aggiunto.
Ed ora??? Non riesco proprio ad uscirne..
-
Fai dei trace.
Cerca di capire dove è il problema.Scrivi
s.stop();
s = new Sound();
s.loadSound(url_array[this.id], true);
s.start();
clip_mc.removeMovieClip();
clip_mc.attachMovie('circle_mc', 'circle'+i+'_mc', _root.getNextHighestDepth());
trace(clip_mc);
clip_mc._x = m._x+32;
clip_mc._y = m._y+3;
-
Già fatto... Mi restituisce undefined.
Ma sei sicuro che questo
var clip_mc:MovieClip;
vada bene così? Io e le variabili non siamo proprio amici amici, ma a me sembra che manchi qualcosa.. Altrimenti cosa può essere?