La mia ricerca di applicazioni flash non si ferma mai, ed ecco una simulazione del menu stile iTunes in flash.

Il risultato è molto soddisfacente, ho modificato un pò il codice e più avanti implementerò altre opzioni.

Itunes Menu in Flash

Le cover vengono prese da una cartella esterna tramite un file XML, ridimensionate e posizionate nel menu iTunes.

Andiamo a vedere insieme il codice XML

<albuminfo>
<artLocation>cover/3.jpg</artLocation>
<trackName>Robbie William</trackName>
<artist>Intensive Care</artist>
</albuminfo>

  • artLocation: Percorso della cover
  • trackName: Titolo album
  • artis: Nome dell’autore

iTunes menu è disponibile solo per la versione 8 di Flash

Scarica il sorgente
Guarda il Tutorial

Implementazioni aggiuntive

  • Guarda il Tutorial iTunes Menu con link dinamici
    (Nel file .ZIP troverete la versione con i link dinamici)
Author

Sono un Creative Strategist con più di 10 anni di esperienza in strategie digitali. Il mio ruolo di Stratega consiste nell’ideare e sviluppare concept creativi per progetti multicanale, individuando le attivazioni e dinamiche di Marketing da applicare attraverso un approccio strategico.

242 Commenti

  1. ciao i complimenti sono ovvi per il grande lavoro…

    vorrei chiederti se è possibile rendere le immagini linkabili direttamente eliminando il pulsantino play, in modo che cliccando sull’immagine si vada direttamente al url indicato nel xml

    grazie per le risposte…

  2. Ciao Julius, salto gli ovvi complimenti x il tuo sito e vado diretto al punto: come faccio a diminuire l’altezza del riflesso delle cover?
    Grazie

  3. Dimenticavo… ho modificato la maschera come hai suggerito, ma il riflesso viene tagliato, io la voglio semplicemente ridurre di altezza ;D

  4. ho risolto con la maschera, ma c’è un as che mi moltiplica il riflesso di un mc senza che lo diplico fisicamente?

  5. rieccomiiiii Julius :) come vedi sono riuscita a cavarmela anche stavolta,
    il link delle coverflow ecc. è spettacolare..
    come sempre però ho bisogno del tuo aiuto :
    come posso variare lo sfondo delle mie cover, ossia se salvo le img in png, di default l’img ha sfondo bianco, avrei bis che fosse nero.. come e dove posso settare il codice?
    grazie mille
    Buona serata

  6. Ciao Julius, ma il tuo link è unico per tutti, ma si può fare che ogni immagine ha il suo collegamento ed in particolare esegue un “filmato” da un certo frame in poi (tipo gotoandplay)??

    Grazie mille, sei un mostro!!

    ;-)

  7. Antonino

    Ciao Julius,
    ti rinnovo i complimenti per il sito e per l’ingegno.
    Forse ho trovato da cosa è dovuto il problema della cpu:
    ho modificato un pò il codice e mi sono accorto che se si esclude la parte che crea il riflesso dell’immagine il problema della cpu non persiste. Io ho infatti utilizzato il menu caricando dei jpg con il riflesso creato in photoshop e la cpu viaggia al 20% tenendo conto che ho flash e altri programmi aperti e ti assicuro che la macchina su cui lavoro non è un mostro di potenza.
    Spero possa essere utile, magari è il giusto compromesso per provare ad integrare i video (ci sto provando ma non sono molto pratico nell’ambito video)!

    Ciao e Grazie ancora!
    Antonino

  8. Ciao Julius davvero interessante, io piu’ che altro stavo cercando di capire come posso simulare lo stesso effetto delle copertene che si piegano quando non sono selezionate. Ho provato con un tween xscaleTo ma l’effetto e’ poco reale… simula ma non e’ proprio reale come in qeusto player. Stavo guardando il codice ma non capisco dove sia la parte di codice che gestisce questo effetto…. potresti darmi delucidazioni? Grazie in anticipo

    PS: ho visto che forse e’ import flash.display.*; import flash.geom.*; ma non vedo dove le richiami e se sono queste.

    grazie in anticipo!!!

  9. Ciao Julius,
    come posso togliere il riflesso dal codice, visto che mi ciuccia tutta la CPU?
    grazie e complimenti

  10. come si fa a far si che le immagini non siamo ridimensionata.Ho delle immagini 300×150 e mi vengono distorte.

  11. ciao…è possibile far muovere le cover a seconda di come muovo il mouse? cioè se muovo il mouse a sinistra le cover ruotano a destra e viceversa? grazie mille!!!

  12. Ho un problema:
    se inserisco questo codice

    //Carico il menu iTunes nel clip di nome istanza box
    loadMovie("itunes_menu.swf", _root.box);
    //tutti i riferimenti a _root nel filmato caricato punteranno a _root del loader anziché a _root del filmato caricato:
    _root.box._lockroot = true;

    Nel mio fla che è più grande rispetto a itunes_menu.swf non funziona più. Ho esguito la procedura consigliata dai commenti. Ma nulla. Qualcuno ha risolto. Grazie.

    Serena

  13. Ciao Julius..

    non è necessario farti i complimenti.. perchè ormai.. se mi serve qualcosa in flash che sia bello, e semplice.. vengo sempre qui… :D 6 un Grande!!

    Piccolo quesito su questo fantastico menu..

    Avre necessità di mettere le scritte e il “tastino del Play” davanti al riflesso..
    oppure togliere la trasparenza.. (non so come l’hai fatto)
    perchè così è poco visibile.. spero si possa fare.. :)

    Ciao!!

  14. Ciao inanzittutto complimenti, ma volevo porre un quesito…se io lo adatto a uno 1000px per 600px non si vede piu la foto centrale e tutte quelle di destra come mai!? che valori devo cambiare grazie!

  15. PabloWablo

    Ciao julius
    complimenti perla galleria…è fantastica…
    io ho un problema con la galleria con i link….
    non funziona, non si apre la pagina…come posso fare??
    Grazie mille

  16. Ciao,
    Scusa avevo visto in questo sito tempo fa un tutorial simile però x i video..xo nn lo trovo +…mi potresti dire dove è?:-) Sorry

  17. Ciao Julius, davvero complimenti, ormai mi affido sempre ai tuoi consigli x i miei lavori :D
    volevo chiederti una cosa: ma non si potrebbe integrare lightbox?
    avevo pensato di farlo lanciare tramite il pulsantino play ma da xml non so proprio come si fa!…help
    grazie ancora^.^

  18. ho provato ad inserire il file swf all’interno di un altrofile swf posizionandolo sul livello2
    fin qui tutto Ok.
    il problema è quando entro in un altro menu dove sovrascrivo il livello 2 con un altro file swf.quando poi ritorno a caricare il file swf (con l’animazione itunes) seul livello 2 lo screller del mouse mi scorre di 2 in 2.Se rifaccio la stessa operazione (carico escarico level2) lo scroller mi santa di 4 in 4.Com’è possibile?

  19. Ciao e ancora complimenti per il sito!
    ho provato a caricare tutti i file come descritto…ma non mi funzionano i link…
    che significa link dinamico?? io nel file xml ho inserito i link alle pagine che volevo linkare ma non carica niente…
    Ho provato a caricare anche il tuo file originale per paura di aver sbagliato qualcosa ma mi da il solito problema…non carica i link!! dove sbaglio??

  20. Ciao Julius e ciao a tutti, ho scaricato e caricato nel sito l’animazione in flash solo che non riesco a trovare il modo corretto per ingrandirla, poiché ho bisogno che le foto che carico si vedano 800x600pixel. come faccio potreste spiegarmelo in maniera semplice e precisa?

    grazie mille a tutti

    RAVA

  21. neanche a me carica i link :( mi dice: undefined

    una parte del codice xml:

    Alessandro_Siani.jpg
    Alessandro_Siani.jpg
    url statico

  22. come faccio per ingrandire il tutto? cioè che le foto vengano almeno 800×600? fatemi sapere

    grazie mille è importante.

  23. Ciao Julius e ciao a tutti,
    Sono in fortissimo imbarazzo…ho realizzato un complesso progetto basato su una serie di gallery utilizzando il tuo tutorial e tutto funziona…in locale, In realta’ adesso che sto’ facendo le prove online e …devo consegnare, mi sono accorto che il tutto e’ di una lentezza mostruosa…ho fatto una serie di prove e verifiche e nonostante abbia modificato alquanto il tuo esempio inserendo diversi campi di testo dinamici (6) associati all’xml ho verificato che in termini percentuale l’assorbimento di cpu tra l’originale ed il mio non e’ poi cosi’ diverso…40% ca contro 50%!!!
    Ovviamente seppur scenico e molto bello, e’ quasi inservibile cosi’ com’e, pertanto chiedo a te a qualcuno che ha avuto lo stesso problema, su cosa e come eventualmente agire per rendere fruibile l’applicazione.
    Grazie di cuore per l’impegno che profondi nei tuoi obbiettivi.

  24. Ciao Julius.
    Anch’io mi unisco ai complimenti di TUTTI quanti. Sei davvero pazzesco!
    E volevo pure sottoporti il mio quesito: stò realizzando un sito in flash fullscreen che puoi vedere all’indirizzo http://www.treativa.com/bozze/iradium/ …funziona tutto perfettamente, anche l’itunes menu in flash che ho caricato sul livello 1 come da tue indicazioni… MA… ho notato che quando la dimensione della finestra del browser supera i 1500 px di larghezza le immagini “shelve” (passami questo termine) sul lato dx si sovrappongono alla copertina frontale principale (guarda pure la bozza dal link che ti ho scritto qui sopra)… Ho provato anche sul tuo file .fla originale e succede lo stesso.. COME MAI? C’è un modo per risolvere la questione?
    Grazie mille in anticipo.
    Riccardo.

  25. complimenti julius,
    I tuoi lavori in flash sono veramente belli!!!
    Ne ho già utilizzato qualcuno su un sito, adesso ho provato a mettere il menu itune su blogger di google, caricando il file su di un altro server, ma non sono riuscito a farlo funzionare .
    Potresti dirmi se è possibile vederlo su blogger o no, e spiegarmi come fare

  26. Serena ha scritto:

    Ho un problema:
    se inserisco questo codice

    //Carico il menu iTunes nel clip di nome istanza box
    loadMovie(“itunes_menu.swf”, _root.box);
    //tutti i riferimenti a _root nel filmato caricato punteranno a _root del loader anziché a _root del filmato caricato:
    _root.box._lockroot = true;
    Nel mio fla che è più grande rispetto a itunes_menu.swf non funziona più. Ho esguito la procedura consigliata dai commenti. Ma nulla. Qualcuno ha risolto. Grazie.
    Serena

    idem ….come si fa??? hai risolto??

  27. Avete reimpostato la larghezza dello Stage?

    Una volta richiamato liTunes in un altro con loockroot blocchiamo la root ma poi per non avere problemi di ridimensionamento dello stage dobbiamo indicare all’iTunes delle dimensioni fisse

    L’iTunes si modifica inizialmente in base alla larghezza dello stage in cui è..una volta richiamato in un altro le proporzioni cambiano

    Vi invito ad entrare nel progetto iTunesMenu è indicare delle dimensioni fisse per Stage.width e Stage.height

  28. Francesca

    Ciao Julius,
    ho letto tutti i messaggi postati ma non ho ho trovato nulla che poteva aiutarmi quindi chiedo direttamente a te…
    Vorrei utilizzare questo movie come photogallery. Non devo nè importarla nè richiamarla da un movie flash ma seplicemente aprirla in una pagina html.
    Ho un paio di domande:

    1) Ho provato a ingrandire le immagini ma aumentando fuoriescono dal movie che non riesce a contenerle in altezza. Come si fa a ingrandire il movie?
    2) Perchè aprendo l’swf pubblicato non riesco a vedere le immagini? è come se non venissero richiamate… Al contrario, se pubblico l’swf facendo CTRL+INVIO dal .fla, vedo il movie caricarsi correttamente.

    Spero tu possa rispondermi in tempi brevi.

    Ciao e buon lavoro

  29. Tyler Durden

    ciao Julius. Spendo un grazie per quello che fai su questo sito….. ho le lacrime agli occhi!
    Vorrei chiederti, premettendo che sono nuovo di flash e non ho esperienza per nulla, ho inserito il menù i_tunes con link in una pagina html di frontpage. tutto a meraviglia! non riesco a rendere effettivi i link!!
    non funzionano ne quelli tuoi ne quelli che ho messo io!
    il mio scopo e di fare aprire una pagina html cliccando sul play o sulla foto.
    Puoi aiutarmi?

  30. Ciao Julius, impossibile non farti i complimenti prima di scriverti, sei un EROE :)
    Io ho questo problema, ho bisogno di aggiungere una cornice alle immagini mi aiuti a capire dove e come mettere mano?! Il codice è parecchio ostico per una come me che è alle prime armi con AS…mi serve questo aiuto per chiudere un lavoro!!!
    Grazie mille per tutto quello che fai.
    Buonagiornata.

  31. julius ciao, ma come fanno ad avere la trasparenza le icone se al posto di jpg carico delle png????
    non mi funziona e sto diventando scemo!!!

    help me!
    :D

  32. Tyler Durden

    Ciao Julius!!
    Ciao a Tutti!
    Ho utilizzato diversi esempi e devo dire che anche uno digiuno di flash come me può combinare qualcosa e di questo ti ringrazio.

    Volevo sapere se era possibile fare aprire i link sulla stessa finestra e scheda, senza che se ne aprino di nuove. questo vale un po per tutti i menù e gallerie da me utilizzate.
    Grazie a tutti.

  33. ciao Julius

    fantastico il tuo sito e grazie di tutti i tutorial

    una domanda
    è possibile associare il link direttamente all’immagine e non al bottone…..?

    grazie

  34. cibernella

    Ciao Julius, ciao a tutti :-)
    Qualcuno sa dirmi dove andare a modificare nelle azioni per far si che, caricando il file swf, si vedano anche 1 o 2 foto solamente? Si lo so che non ha senso ma ho creato un serie di pagine tutte con questo metodo, mi piaceva seguire la stessa logica anche dove c’è una sola immagine o due.
    Grazie :-)

  35. Ciao Julius, complimenti per tutto il lavoro che fai ma soprattutto perchè lo condividi con tutti.

    Ho una domanda da farti, come faccio a modificare
    il comando che richiama dall’ XML
    con e con ???

    Ti spiego meglio, ho un xml che si aggiorna automaticamente con questi parametri, e mi piacerebbe inserirli nel tuo tutorial.

    fammi sapere grazie

Commenti