News orizzontali dinamiche in Flash

- Letture: 2.690

Ecco un bel tutorial per visualizzare delle News orizzontali in Flash prendendo il testo da un file esterno XML.

Come testo possiamo inserire collegamenti ipertestuali utilizzando il tag <a href> e abbiamo la scelta di formattare il testo con il grassetto, sottolineato, italico.

Inoltre non avremo più il problema di caratteri non visualizzati poichè speciali, in quanto è possibile codificare il carattere da codice.

Questo è il file news.XML altamente personalizzabile, come abbiamo visto in precedenza, con i tag HTML

<?xml version="1.0" encoding="utf-8"?>
<root>
<lang id="it">
<content time="03/07/2007">
<text1>
<![CDATA[E' possibile inserire <a href="http://www.gdesign.it/pages/html/struttura/atag.php" mce_href="http://www.gdesign.it/pages/html/struttura/atag.php" target="_blank">collegamenti ipertestuali</a> con il TAG href... Possono essere inseriti le tipiche formattazione come il <b>grassetto</b>, <u>sottolineato</u>, <i>italic</i>... i colori <font color="#FF0000">ROSSO</font>, <font color="#FFFFFF">BIANCO</font>, <font color="#0000FF">BLU</font>... possiamo inserire caratteri speciali © - Ô - Ñ - & - %
]]>
</text1>
<docu>
<![CDATA[60]]>
</docu>
</content>
</lang>
</root>

Andiamo a vedere il codice insieme:

Ecco il codice più importante per le nostre news:

onClipEvent (enterFrame) {
if (_parent.scrolling) {
if (this._x<2-txt_component.my_field._width-10) {
this._x = 0;
} else {
this._x -= 1; //velocità nella news
}
}
}

Vediamo ora come codificare un carattere speciale:

Alla linea 162 troveremo una funzione kill_entities :)

Qui sono scritti dei clicli while i quali verificano se il carattere speciale è stato inserito, se lo trova lo converte nel codice HTML corretto.

while (_loc1.indexOf("&") != "-1") {
_loc1 = _loc1.substring(0, _loc1.indexOf("&"))+"&"+_loc1.substring(_loc1.indexOf("&")+5);
}

In questo caso viene verificato se è stato isnerito una e commerciale “&” e viene convertita nel codice compatibile a HTML “&”.

Infatti come avrete notato anche il tag <a href> viene “intercettato” dando ai link questo colore ovviamente modificabile da codice.

Scarica il sorgente
Guarda il Tutorial

Stratega, Docente, Speaker con più di 12 anni di esperienza in strategie creative multicanale. Oggi sono Managing Partner di ThinkingHat, Innovation Studio specializzato in tecnologie emergenti per aziende e brand audaci.

31 Commenti

  1. Ma secondo te se voglio farlo venire Fuori riga per riga cioè tipo effetto giornale…
    Prima una riga che poi scompare…
    Poi un’altra riga…
    Usando la stessa tecnologia?
    Io intanto ci provo ;-)
    Se hai qualche suggerimento!
    Cmq grazie e buona giornata ;-)

  2. Simpatico tutorial, non sarebbe meglio fare in modo che se l’utente si mette sopra con il mouse lo scrolling si ferma?

  3. Ciao allora ci avevo gia pensato, ma per fermare le news, devi trasformre il clip in pulsante e cosi facendo annulleresti i link presenti…

    Cercherò di risolvere…

  4. ciao sommo, ho scaricato il tutorial ma non riesco a trovare la riga in cui si modifica la velocità di scorrimanto del testo….vorrei rallentarlo

  5. Vincenzo

    Ciao Julius, come sempre sei sempre il migliore!
    Posso chiederti come faccio ad inserire più news nel file xml?
    Ci provo, ma evidentemente qualcosa non va… Aspetto tue notizie! Grazie!

  6. Ciao GRANDISSIMO!!!
    Come posso fare per aumentare la dimensione del font o cambiare addirittura font?
    Grazie in anticipo..
    Ciao Julius

  7. Ciao! Come sempre sono molto interessanti i tuoi tutorial. Non riesco a capire perchè trasportando il codice dal tuo flash incollando in un altro con action script 2 e player settato a 7 o 8 non va. Il tuo utilizza il player 6 con acrion script 1. Penso sia per questo non funzioni. COnosci altri script che vanno con 8?
    Grazie in anticipo!

    Serena

  8. Ciao! Complimenti per i tutorials!
    Sto cercando di ridimensionare la lunghezza delle news ma non ci riesco…
    mi aiuti? :)

  9. Ciao

    con txt_holder.txt_component.my_field._width viene calcolata quanto è lunga la striga…

    Se è + lunga di scroll_width impostato a 719 viene azionato lo scrolling

    TI basta cambiare lo scroll oppure ridimensionare l’swf o utilizzare una maschera…

  10. wow velocissimo! :)
    errore mio… mi sono dimenticata di dirti un pezzo…

    ho il filmato è di 900px width ma la news mi serve di 600px … che non vada da lato a lato insomma
    possibilmente senza maschere o altro
    io ho provato a cambiare qualcosa nello script ma senza risultato :/

  11. Il testo verrà sempre visualizzato in quanto calcolata la larghezza viene duplicato il clip filmato e messo in coda…

  12. elisabetta

    ciao,
    se voglio averle verticali che scorrono automaticamente e editabili personalizzando con bold, italic ecc?
    è possibile?
    Elisabetta

  13. ciao julius, ti ringrazio per questo tutorial!
    io ho provato a mettere una maschera ma poi non compaiono piu le news!!
    come posso fare?

  14. ciao non riesco a capire come impostare la larghezza della scritta ho provato a modificare il clip txt_holder ma non cambia niente..come faccio??grazie…

  15. con action script 2 e player settato a 7 o 8 non va. Il tuo utilizza il player 6 con acrion script 1. Penso sia per questo non funzioni. COnosci altri script che vanno con 8?
    Grazie in anticipo!

    kadaff

  16. Ciao Julius,sei sempre un grande!Volevo chiederti come posso aggiungere altre news?Ho provato in diversi modi ma non ne vengo fuori….ti prego aiutami!!!!

  17. Julius, scusa, come posso invertire il senso di “marcia” delle news e fare in modo tale che il testo, una volta finito, riparta in loop senza vedere dei “buchi” ?

    Grazie..

  18. Ciao Julius,
    sto lavorando su Dreamweaver CS3, in che formato bisogna importare le news orizzontali? Ho caricato tutto il contenuto della cartella compreso il file .xml, ma mi visualizza solo la linea e non il testo.
    Grazie,
    Filippo

  19. Ciao Julius,
    Gentilmente come faccio ad inserire più news nel file xml?
    Ho fatto varie prove, ma nulla. In attesa…Grazie!

Commenti