Ciao..
Per chi desidera inserire nel proprio sito, un sottofondo musicale creato in flash,sicuramente troverà utilissimi questi due esempi.
Come dico sempre, possono esistere tanti modi per creare animazioni in flash, ma io cerco sempre di creare esempi semplici, che sono alla portata di tutti, sia principianti che .....
Iniziamo...


Esempio 1
In questo esempio ho creato un file flash che tramite actionscript carica un file MP3 che si trova nella libreria. Il file MP3 parte in automatico e dopo viene gestito con i pulsanti "PLAY", "STOP" e "Controllo VOLUME". (Il brano MP3 inserito, è la base midi che ho creato tempo fa per una canzone composta da una mia amica).
Il file flash è costruito da tre pulsanti (play, stop, volume) e da un brano MP3 che si trova nella libreria.
1 - Aprite Flash.
2 - Andate su: > File > Importa > Importa nella Libreria.
3 - Scegliete il brano(wav o Mp3) e cliccate su "APRI".
4 - Aprite il panello Libreria andando su > Finestra > Libreria, o tramitte la combinazione CTRL+L dove trovate il file MP3 appena importato.
5 - Cliccate con il tasto destro del mouse sul file MP3 e dalla finestra che si apre cliccate sulla voce "CONCATENAMENTO".
6 - Nel panello "Proprietà del Concatenamento" spuntate la casella "Esporta per Actionscript" e lasciate invariate le altre opzioni.
NB: Notate bene e ricordatevi il nome che si trova (che potete cambiare a vostra scelta) nella casella "Identificatore", perche vi servirà nel codice actionscript per identificare il file da caricare.
7 - Create il pulsante "Play", assegnando come "Nome istanza" "play_btn".
8 - Create il pulsante "Stop", assegnando come "Nome istanza" "stop_btn".
9 - Create un Nuovo Livello > Inserisci > Linea temporale > Livello e chiamatelo "Actions Button". Aprite il panello Azioni (F9) e inserite il codice sotto:

//codice che carica il file sound
var song_sound:Sound = new Sound();
song_sound.attachSound("T'Aspetto");
song_sound.start(0, 99999);

//codice pulsanti
_root.play_btn._visible=false;
play_btn.onRelease = function() {
song_sound.start();
this._visible=false;
_root.stop_btn._visible=true;
};
stop_btn.onRelease = function() {
song_sound.stop();
this._visible=false;
_root.play_btn._visible=true;
};

Sostituite il nome "T'Aspetto"(che è l'Identificatore del mio file MP3) con l'Identificatore del vostro file MP3.
Se volete inserire anche un pulsante "Controllo Volume", vi basta:
1 - Create un pulsante(io ho creato un retangolo di Altezza 30px e Largheza 10px e l'ho convertito in Pulsante)
2 - Assegnate al pulsante appena creato come "Nome Istanza" > maniglia_btn
3 - Selezionate il pulsante appena creato e convertitelo in "Clip Filmato"
4 - Assegnate al Clip Filmato appena creato come "Nome Istanza" > volume_mc
Cosi abbiamo un Clip Filmato con dentro un Pulsante
5 - Create un Nuovo Livello e chiamatelo "Actions Controllo Volume". Aprite il panello Azioni (F9) e inserite il codice sotto:

//codice barra volume
this.createTextField("volume_txt", 10, 130, 64, 200, 20);
volume_mc.top = volume_mc._y;
volume_mc.bottom = volume_mc._y;
volume_mc.left = volume_mc._x;
volume_mc.right = volume_mc._x + 100;
volume_mc._x += 100;

volume_mc.maniglia_btn.onPress = function() {
startDrag(this._parent, false, this._parent.left, this._parent.top, this._parent.right, this._parent.bottom);
};
volume_mc.maniglia_btn.onRelease = function() {
stopDrag();
var level:Number = Math.ceil(this._parent._x - this._parent.left);
this._parent._parent.song_sound.setVolume(level);
this._parent._parent.volume_txt.text = level;
};
volume_mc.maniglia_btn.onReleaseOutside = slider_mc.maniglia_btn.onRelease;

Per provare il lavoro appena finito andate su > Controllo > Prova Filmato o tramitte la combinazione CTRL+INVIO.
Esempio 1:





Esempio 2
In questo esempio ho creato un file flash che tramite actionscript carica un file esterno MP3, che possiamo gestirlo tramitte i pulsanti play e stop.
1 - Create il pulsante Play
2 - Aprite il panello Azioni(F9) e inserite il codice sotto:

on (press) {
mio_sound.start();
}

3 - Create il pulsante Stop
4 - Aprite il panello Azioni e inserite il codice sotto:

on (press) {
mio_sound.stop();
}

5 - Create un nuovo livello. Aprite il panello Azioni(F9) e inserite il codice sotto:

var mio_sound:Sound = new Sound();
mio_sound.loadSound("QUI INSERIRE IL NOME DEL FILE MP3.mp3", true);
mio_sound.onSoundComplete = function() {
mio_sound.start(0, 99999);
};

NB: Al posto della scritta in rosso "QUI INSERIRE IL NOME DEL FILE MP3", dovete inserire il nome del file MP3 che si trova nel vostro hard disk, o potete inserire l'url del file mp3.. Nel esempio sotto l'audio non inizia automaticamente, ma dovete premere il pulsante play, altrimenti non si capirebbe niente tra i due esempi: Invece il vostro sottofondo musicale partirà automaticamente quando si carica la pagina..
Per provare il lavoro appena finito andate su > Controllo > Prova Filmato o tramitte la combinazione CTRL+INVIO. Enjoy...
Esempio 2 (NB: Se il brano non parte immediatamente, non è colpa del mio script, ma del server che lo ospita, perciò dovete avere un po di pazienza)



Seguite il Videotutorial, che vi spiega passo dopo passo tutti i passaggi:


Tutorial Parte 1


Tutorial Parte 2


Tutorial Parte 3


Articoli correlati per categorie




 Abbonati gratis a questo blog      

23 commenti

  1. stella // 5 aprile 2009 10:05  

    Ciao bestar, buona domenica. Per te è facile, ma per me...è arabo!

  2. bestar // 5 aprile 2009 18:37  

    Ciao Stella..niente è facile, ma anke niente è difficile se t'impegni...
    buona domenica a te..
    penso ke per te andrebbe bene questo post:

    http://bestar-space.blogspot.com/2009/03/aggiungere-la-terza-colonna.html

    fammi sapere..
    ciauzzzzzzzz...

  3. Pensieri e parole // 22 aprile 2009 22:39  

    Grazie per la visita,il mio blog nn è kosi interessante kome il tuo,anke x me kome dice Stella è ostrogoto...Ciao a presto da Deny...

  4. Anonimo // 13 maggio 2009 20:14  

    ciao ho messo una song come spiegavi tu...ma quando faccio prova filmato,all 80% dellla song sovrppone la stessa song e continua a sovrapporre all infinito.perche?
    io volevo solo inserire una song a un immagine senza tasti play e stop,che si riproduca allinfinito.

  5. bestar // 14 maggio 2009 18:12  

    ciao anonimo...
    se vuoi inserire una song senza tasti play e stop ad un immagine segui le istruzioni fino al punto 6, poi inserisci il codice sotto nel frame del immagine:
    ____________________________________________
    stop();
    var song_sound:Sound = new Sound();
    song_sound.attachSound("T'Aspetto");
    song_sound.start(0, 99999);
    ___________________________________________

    e vedrà che funziona...
    fammi sapere...
    ciao

  6. simo185 // 5 agosto 2009 15:23  

    ciao bestar, complimenti per il tuo videotutorial \"Gestire con flash la musica di sottofondo del sito o blog\", veramente ben fatto, utile soprattutto a chi sta imparando; tra quelli che ho trovato in rete è senz\'altro quello spiegato meglio, grazie.

    L\'ho applicato passo per passo, creando un file per AS 2 (uso il CS3), ma siccome sono agli inizi, non riesco a realizzarlo completamente, ti scrivo per cercare di capire cosa sbaglio:

    ho realizzato play e stop e li ho trasformati in simboli pulsanti con istanza play_btn e stop_btn
    nel livello actions ho messo:
    var song_sound:Sound = new Sound ();
    song_sound.attachSound(\"amon_tobin.mp3\");
    song_sound.start(0, 99999);

    play_btn.onRelease = function() {
    song_sound.start();

    };
    stop_btn.onRelease = function() {
    song_sound.stop();

    };

    quando provo a verificare il funzionamento non mi permette di agire sui pulsanti stop e play, non mi compare neanche la manina, per cui il brano si sente, ma non riesco a fermarlo

    ho controllato la sintassi del codice e non mi da errore - forse il problema è su come ho realizzato i pulsanti? (non è la prima volta che creo pulsanti e finora non mi hanno mai dato problemi e comunque ho seguito le tue istruzioni)

    inoltre volevo chiederti, se volessi lasciare il file.mp3 nella stessa cartella del file flash, senza caricarlo in libreria, cosa dovrei cambiare? ti ringrazio

  7. bestar // 5 agosto 2009 15:26  

    ciao Simo...
    grazie per i complimenti...
    :) :) :) :) >>>>>>>>>>>>>>>>>>>
    allora...vediamo se posso esserti d'aiuto...
    per prima cosa, controlla bene il codice:
    tu hai inserito questo codice:
    song_sound.attachSound(\"amon_tobin.mp3\");
    L'errore sta negli slash \\, che comporta un blocco del codice...per questo motivo, tu riesci a sentire la musica, ma non riesci ad usare i pulsanti, perche il codice si blocca alla fine del attachSound e se ci hai fatto caso il seguito del codice risulta tutto di colore verde....percio non hai sbagliato a creare i pulsanti, ma solo l'errore sopra citato...anche se provi a verificare il funzionamento del codice, flash non vede nessun errore...
    comunque inserisci il codice sotto e fammi sapere se funziona:
    ____________________________________________________

    var song_sound:Sound = new Sound ();
    song_sound.attachSound("amon_tobin.mp3");
    song_sound.start(0, 99999);
    play_btn.onRelease = function() {
    song_sound.start();

    };
    stop_btn.onRelease = function() {
    song_sound.stop();

    };
    _____________________________________________________

    un'altra cosa: se vuoi lasciare il file.mp3 nella stessa cartella del file flash, senza caricarlo in libreria, devi soltanto seguire la seconda parte del tutorial...appena finisce il primo esempio, sotto c'è un'altro esempio, che spiega passo-passo come caricare file esterni...sicuramente non ci hai fatto caso...
    se hai bisogno di consigli non esitare a scrivere...se posso ti aiuterò volentieri...
    a presto...
    bestar

  8. simo185 // 6 agosto 2009 17:06  

    grazie per la tua risposta Bestar; non ho fatto caso agli slash ... (non ricordavo nemmeno di averli messi!!) ieri ho poi rifatto tutto da capo ed ha funzionato, cmq grazie perchè ora so dove era l'errore - ho visto che c'è anche un altra spiegazione nel tuo blog, grazie, poi la guardo con calma ...

    scusa se ancora approfitto della tua generosità ... sono proprio alle prime armi ...
    tutto funziona, ma se salvo l'swf (è fatto con as2) e lo porto nella libreria del file index (che è as3) non funziona ... è come un' immagine piatta ... forse è meglio che faccio tutto nel file index? posso utilizzare un file as2 in un file as3? o è meglio che anche la index la faccio in as2?

    e poi volevo chiederti: se invece di stoppare il suono (che poi ricomincia da capo) lo volessi mettere in pausa in modo che riprenda da dove è stato interotto?

    ed ancora: ho tagliato l'audio in modo che riprenda e finisca senza interruzione, cercando 2 punti simili ... ma vorrei che all'inizio, solo quando si apre la pagina del sito, la musica iniziasse in "fadein" per poi alzarsi e continuare sempre uguale ... come posso fare?

    TI RINGRAZIO PER LA TUA DISPONIBILITA' - DAVVERO GRAZIE :-))

  9. bestar // 6 agosto 2009 19:38  

    ciao Simo...
    1 - as2 o as3....
    Un unico file SWF non può combinare codice ActionScript 1.0 o 2.0 con codice ActionScript 3.0.
    è un discorso lungo...dovresti far riferimento alla guida e alle nuove funzioni di as3...
    in parole povere, non puoi inserire un clip filmato con il codice as2 integrato, dentro il clip, in as3...puoi importare un'animazione ma senza codice as2...
    se proprio hai bisogno di inserire un file swf creato in as2 in un file as3, puoi usare la classe Loader, cioè la "vecchia" - loadMovie(); o loadMovieNum(); dell'as2

    2 - per mettere in pausa un suono:
    crea 2 pulsanti:
    play > con nome istanza > inizio
    pausa > con nome istanza > pausa
    importa nella libreria il file audio e in Proprietà Concatenamento inserisci come Identificatore il nome > audio
    nel primo fotogramma inserisci il cod as2 sotto:
    -----------------------------------------

    suono=new Sound(this);
    suono.attachSound("audio");

    pausa.onRelease=function(){
    suono.stop();
    };
    inizio.onRelease=function(){
    suono.start(suono.position/1000,999);
    };

    --------------------------------------------

    spero di essere stato chiaro e d'aiuto...
    se hai dei problemi chiedi pure...
    ciao.....

  10. simo185 // 7 agosto 2009 00:39  

    ciao bestar, tutto funziona, grazie -
    ho fatto un mix dei codici, ora funziona la pausa, il play riprende da dove la musica è stata interrotta, ed il suono inizia quando si dà il via al filmato -
    ho usato istanza "play_btn" per play e istanza "stop_btn" per pausa/stop

    questo è il codice che ho messo:

    suono=new Sound(this);
    suono.attachSound("amon_tobin.mp3");
    suono.start(0, 99999);

    //codice pulsanti
    _root.play_btn._visible=false;

    play_btn.onRelease = function() {
    suono.start(suono.position/1000,999);
    this._visible=false;
    _root.stop_btn._visible=true;
    };

    stop_btn.onRelease = function() {
    suono.stop();

    this._visible=false;
    _root.play_btn._visible=true;
    };

    ----------------------
    ma ora il problema è che non funziona la barra di controllo del volume;
    inoltre mi piacerebbe mettere la barra verticale anzichè in orizzontale, ma malgrado gli "esperimenti" non sono riuscita a capire dove agire ...

    ho seguito il tuo esempio, con istanza "maniglia_btn" per il pulsante ed istanza "volume_mc" per il Clip filmato - ho tolto i numerini che indicavano il volume e il testo "volume" - per il resto mi sembra uguale al tuo

    questo il codice:

    volume_mc.top = volume_mc._y;
    volume_mc.bottom = volume_mc._y;
    volume_mc.left = volume_mc._x;
    volume_mc.right = volume_mc._x + 100;
    volume_mc._x += 100;

    volume_mc.maniglia_btn.onPress = function() {
    startDrag(this._parent, false, this._parent.left, this._parent.top, this._parent.right, this._parent.bottom);
    };
    volume_mc.maniglia_btn.onRelease = function() {
    stopDrag();
    var level:Number = Math.ceil(this._parent._x - this._parent.left);
    this._parent._parent.song_sound.setVolume(level);
    this._parent._parent.volume_txt.text = level;
    };
    volume_mc.maniglia_btn.onReleaseOutside = slider_mc.maniglia_btn.onRelease;

    perché non funziona?

    inoltre se la misura del mio rettangolo per lo scorrimento è inferiore a 10 pixel, dovrò modificare anche il valore 100 se no vado oltre il rettangolo - giusto?

    grazie ancora best ...

  11. bestar // 7 agosto 2009 15:19  

    ciao Simo185....
    1 - se guardi bene la variabile che hai assegnato al sound: suono=new Sound(this);
    è diversa dalla variabile della barra di controllo del volume:>
    this._parent._parent.song_sound.setVolume(level); - per questo il Controllo Volume non funziona
    il codice corretto è:
    this._parent._parent.suono.setVolume(level);
    e vedrai che funziona....

    2 - se vuoi la barra di controllo del volume in verticale devi invertire le proprietà _x e _y
    ed il codice corretto per avere la barra di controllo del volume in verticale diventa:
    _____________________________________________
    //codice barra volume in verticale
    volume_mc.top = volume_mc._y + 100;
    volume_mc.bottom = volume_mc._y;
    volume_mc.left = volume_mc._x;
    volume_mc.right = volume_mc._x ;
    volume_mc._y += 0;

    volume_mc.maniglia_btn.onPress = function() {
    startDrag(this._parent, false, this._parent.left, this._parent.top, this._parent.right, this._parent.bottom);
    };
    volume_mc.maniglia_btn.onRelease = function() {
    stopDrag();
    var level:Number = Math.ceil(this._parent._y - this._parent.top);
    this._parent._parent.suono.setVolume(level);
    };
    volume_mc.maniglia_btn.onReleaseOutside = slider_mc.maniglia_btn.onRelease;

    _____________________________________________

    sperando di essere stato chiaro e d'aiuto........ciauzzzzzzzzzzzzzzzzz

  12. simo185 // 7 agosto 2009 21:15  

    grazie bestar - hai spiegato alla perfezione - tutto funziona che è una meraviglia - posso dire di aver davvero imparato qualcosa - grazie di cuore :-))

  13. oscar aguilar // 25 settembre 2009 16:07  

    Hola!

    Mi nombre es Oscar Aguilar,  a través de la web encontré tu página
    y me pregunto si te gustaría  intercambiar enlaces
    con una de mis webs. Actualmente tengo una web de Modelos Famosas y
    estoy buscando otras páginas relacionadas para enlazar a mi web.

    Tu enlace estarìa en:

    http://www.cantantesybiografias.com/

    Si te interesa, por favor agrega a tu página la siguiente información
    de mi enlace y hazme saber cuando este listo para colocar tu enlace
    inmediatamente.

    Mi información es:

    Titulo: Video de Chicas

    Por favor el titulo enlazado a esta URL:

    http://www.chicasybikinis.com/

    Descripción(opcional):

    Fotos de alta calidad de las chicas mas bellas.


    Quedo a la espera de tu respuesta.

    Oscar Aguilar
    oscar.aguilar@cantantesybiografias.com

    Webmaster

    PD - Con el fin de seguir las políticas anti-spam, si no deseas recibir
    más solicitudes de este tipo por favor  llena el siguiente formulario:
    HTTP://WWW.NOMOREMAILS.COM  o manda un mail a: STOP@NOMOREMAILS.COM y
    evitaremos contactarte nuevamente.

  14. luis-brianza // 26 ottobre 2009 22:34  

    sera bestar mi puoi dire che programma flash usi per gestire la musica nel blog?perchè ho visto che ne esistono diversi io o flash slideshow maker professional ciao e grazie.

  15. bestar // 27 ottobre 2009 11:21  

    CIAO LUIS..
    IL PROGRAMMA FLASH CHE USO SI CHIAMA PROPRIO - ADOBE FLASH...
    NON CONFONDERE IL LETTORE FLASH CHE SERVE PER VISUALIZZARE I PROGETTI FLASH CREATI CON IL SOFTWARE CHE SI CHIAMA PROPRIO FLASH DELLA CASA ADOBE..
    PER SAPERNE DI PIU, TI LSCIO IL LINK SOTTO:
    http://bestar-space.blogspot.com/2009/01/adobe-flash-un-software-grafico.html

  16. luis-brianza // 27 ottobre 2009 13:33  

    grazie bestar vado a vedere se lo trovo ciao.

  17. MB // 9 febbraio 2010 17:27  

    Vorrei sapere se funziona anche con ActionScript 3.0 o e solo per l'actionScript 2.0 ?

  18. bestar // 10 febbraio 2010 21:34  

    Ciao MB...
    non funziona con AS3...è solo per AS2...
    fammi sapere se hai bisogno...

  19. CS // 14 novembre 2010 17:12  

    Ciao! sto progettando un sito in html e mi è stato chiesto di inserire un sottofondo musicale gestibile dall'utente. essendo un po' alle prime armi, ho fatto delle ricerche e ho letto che è meglio creare un player in flash.
    a questo punto, dopo aver letto il tuo tutorial, vorrei sapere se il player, ad ogni cambiamento di pagina, possa ricordarsi il punto della track che stava riproducendo o meno...altrimenti sai mica come si può risolvere questo problema?
    ti ringrazio già per la risposta e per l'utilissimo tutorial!!! :)

  20. Z10 // 1 novembre 2011 17:49  

    Ciao a tutti, ho seguito passo passo il primo esempio e tutto è filato liscio. Ho necessità però che il mio clip audio si riproduca in loop. Quando faccio partire il filmato, parte anche l'audio ma una volta arrivato a termine si interrompe, io vorrei che si ripetesse.

    Help me!! :)   :)

    Grazie mille

  21. bestar // 1 novembre 2011 20:20  

    @Z10
    basta aggiungere un loop :<span>

    song_sound.start(</span><span>0, 99999</span><span>);</span>

    fammi sapere...

  22. Anonimo // 14 maggio 2012 12:01  

    Complimenti per il tutorial, chiaro ed efficace.
    Sicuramente un buon script per inserire musica nel nostro sito web. Volevo chiederti se era possibile inserire diversi brani e farli partire singolarmente, magari inserendo un nuovo tasto.

    Se puoi fammi sapere, grazie

  23. lorenzo // 14 maggio 2012 19:16  

    Sono riuscito a completare il tutorial e costruire il lettore musicale. Funziona abbastanza bene, però il livello del volume non è molto sensibile .. molte volte bisogna mettere il puntatore sopra di questo con estrema precisione, altrimenti non prende. Inoltre, in alcune situazioni bisogna cliccare due volte per confermare il livello volume. E' possibile migliorare questa funzione?
    Grazie

Posta un commento