PageFlip v2 Dinamico

- Letture: 9.811

Da un po’ di tempo mi ero dedicato alla prima versione di PageFlip, ovvero quella non dinamica, il “Libro che si sfoglia” come tutti ormai lo hanno battezzato.

Girovagando per il web ho trovato un’altra versione, Opensource, che si interfaccia con un file XML, rendendo il PageFlip assolutamente dinamico e agevole.


Esaminiamo il file XML

<page src='pages/page1.jpg' canTear='false' />
<page src='pages/page2.jpg' canTear='false' />
<page src='pages/page3.jpg' canTear='false' />
<page src='pages/page4.jpg' canTear='false' />

Come vedete il codice è molto semplice nel tag content troviamo altezza e larghezza delle pagine la trasparenza e la possibilità di rendere la copertina rigida o flessibile (hcover) come tutte le altre pagine.

Le pagine esterne possono essere .jpg oppure .swf, per quanto riguarda le jpg non ce niente da dire, basta creare un immagine di dimensioni della pagina è verra caricata, tramite Xml, come una delle nostre pagine.

Per quanto riguarada invece le pagine esterne .swf, ricordo che vi è una ampia scelta di utilizzo, infatti possiamo inserire audio, video e animazionidi qualsiasi tipo.

Inoltre è possibile settare alcuni parametri come isSpread=”true” per dividere una pagina in 2 e preLoad=”true” per effettuare, come dice il termine, un preloading della pagina esterna.

Andando avanti… nel tag page troviamo ovviamente src ossia la directory della nostra pagina esterna ( .jpg o .swf), e poi un tag canTear ovvero la possibilità di poter strappare la pagina, si avete capito bene strappare in tutti i sensi la pagina!!

Non chiedetemi l’utilità, ma essendo un opzione del PageFlip v2, perchè tenerla all oscuro?? :D

Ho notato che ora è disponibile, in versione demo, il Pageflip v 3.26 in cui sono stati realizzati opzioni nuove, come lo zoom delle pagine, la stampa, il controllo del suono e la visualizzazione delle varie pagine a tutto schermo.

) Scarica i File source esempio con video
) Scarica i File source esempio senza video
) Guarda il Tutorial

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

243 Commenti

  1. Lo so ke è ardua da spiegare cosi ma…. il problema della velina l’ho risolto (per il momento) eliminando gli effetti ombra ecc….

    Appena metto online una copia del libro nuovo con le polaroid ke fanno capolino fuori dalle pagine provo a spiegarmi meglio!

    Grazie comunque!

  2. Julius ascolta non mi arriva nulla a quell’e-mail perfavore manda il tutto a quest’altra… ti ringrazio anticipatamente sei un angelo!!!

  3. ciao Julius,
    inutile farti infiniti apprezzamenti per quello che fai qui, ormai ne avrai a migliaia di complimenti!
    ho letto un paio di post simili al mio quesito: il preload è troppo lento!
    ho una 40ina di jpg ridotti al minimo ma è ancora troppo lento!
    avrei bisogno di risolvere questo problema…
    mi sembra di aver capito che forse hai mandato via mail la soluzione a veronika.
    saresti così gentile da illuminare anche me?????
    grazie infinite

  4. Ciao Julius,
    inutile altri complimenti sei fortissimo!
    Anch’io ho i problema del preload (stesso di lele+veronika) troppo lento con appena 16 pagine.swf da 300kb l’una! Puoi inviarmi un aiutino anche x mail va benissimo grazie!

    PS: Veronika e lele forse se a voi già è stata inviata la risposta x mail su questo problema potreste inoltrarmela x non rompere ancora a julius che ne dite?
    Grazie anticipatamente x l’aiuto….
    mame78@gmail.com

  5. Ciao Julius,
    ho un “piccolo” problemino con il caricamento. Mi spiego meglio. Un cliente ha un catalogo di 300 pagine e fin qui nessun problema. Il tutto funziona bene su firefox, ma quando vado ad aprirlo su ie6 stenta ad uscire dal preload e quelle volte che esce carica solo le pagine del preload senza caricare le altre. Inoltre alle volte carica solo la pagina di destra e non quella di sinistra.
    ciao e grazie in anticipo!

  6. Ciao sto leggendo i tuoi articoli che trovo molto interessanti
    Volevo chiederti un informazione sul pageflip
    E’ possibile far leggere da un file pdf?

  7. @luke3d purtroppo questa versione ha vari bug

    @Danilo Si è possibile ma per ora i servizi sono a pagamento…

  8. quindi per fare questo effetto devo trasformare le pagine del pdf in img .jpg?
    almeno credo sia l’unica soluzione
    grazie per la risposta

  9. ho un problema, quando carico il filmato page flip su un sito e lo chiusdo mediante un tasto attraverso funzione unloadMovie……

    il problema nasce quando provo sul sito a riaprire nuovamente il filmato e quando lo riapre, non mi fa piu’ muovere le pagine….

    come mai?

  10. Francesco

    ciao juluis, innanzitutto ti faccio i complimenti per il servizio che offri!
    vorrei chiederti una delucidazione su un problema che mi è stato posto!
    io sto utilizzando pageflip v 213, prende le pagine da un file xml!
    dovrei creare un album per un allevamento di cani. il cliente ha chiesto di far visualizzare le schede dei cani, però vorrebbe far visualizzare i testi da un db mysql!
    ti faccio un esempio:
    ogni cane occuperà 2 pagine (pag 4 e pag 5) nella pagina 4 verra visualizzata la foto del cane con il nome, nella pagina 5 verranno visualizzati i testi che appartengono a quel cane! io ho proposto di creare le singole pagine in swf o gif o jpg, il cliente mi ha detto se si poteva generare in automatico la pagina del testo (pag 5) senza dover creare un swf o una gif o una jpg!
    domanda:
    è possibile far generare in automatico un file swf con asp o php?
    hai una soluzione a questo problema?

    grazie

  11. Ma io non ne ho mai avuto la necessità, so che esiste una libreria opensouce PHP chiamata MING, che genera swf da istruzioni php, mai vista ne usata, prova a cercare su google…

  12. Ciao Julius, ti faccio i miei complimenti per il sito, spero che tu possa aiutarmi,
    sto lavorando sul pageflip, ma ho un problema con i pulsanti: quando metto un pulsante sulla pagina 3, lo vedo anche nella pagina 1.
    So che ti hanno gia posto questa domanda, ho provato ad inserire questo script: btn.enabled = (_root.getPN(2) == _root.page);
    ma nn cambia nulla,
    come devo fare?
    grazie mille,
    Daniele

  13. Fabrizio

    Ciao Julius, mi chiamo Fabrizio e sto impazzendo per poter inserire su PageFlip v2.1 un’animazione “simpatica”. In pratica:

    > utilizzando PageFlip 2.1 ho creato un album di 24 pagine che contengono 11 fotografie (escluse le copertine)
    > dalle pagine con le foto, ho creato un link ad un popup HTML contenente del testo.

    L’animazione “simpatica” che vorrei aggiungere (ma non riesco in nessun modo) è questa: cliccando con il mouse sulla foto (ad esempio a pagina 2 e 3 dell’album), l’immagine di sfondo di pagina 2 e 3 dovrebbe deformarsi come quando si da’ un pugno ad un giornale aperto, e da quel “buco” far apparire in dissolvenza il “popoup” con il testo in html. Quando il popup viene chiuso, l’immagine di sfondo di pagina 2 e 3 ritorna “normale e posso quindi continuare a sfogliare l’album, andando a pagina 4-5, cliccare e… come sopra…

    Come posso realizzarlo?

    Ti ringrazio per ogni suggerimento che potrai darmi.

    Ciao,
    Fabry

  14. ciao Julius,
    ho un problema: il preload è troppo lento!
    ho più di 100 pagine da caricare,ma con ie 7 non va

    potresti gentilmente mandarmi via mail la soluzione che hai mandato a veronika.
    grazie per tutto quello che fai.

  15. Ciao julius,
    sto provando a inserire un TEXT SCROLL nelle pagine del vecchio PageFlip non dinamico… ma non ne vuole sapere di andare….
    Ribadisco ke sono alle primissime armi con flash…
    ma le sto tentando tutte… e se non va non va!!! :-)
    Mi daresti un dritta? Bye

  16. Francesco

    Ciao Julius, ho un problema con un form per l’invio di informazioni da una pagina di flippage….
    puoi vedere il lavoretto che sto facendo al seguente indirizzo http://www.delbusento.it/1/ il problema è alla penultima pagina dove c’è un form.
    quando si va a cliccare su un campo per selezionarlo e poi successivamente per cliccare invio, si fa sempre l’effetto che gira la pagina e non mi fa inserire ne inviare nulla…. provate e vedete cosa succede

    come posso risolverlo?

    grazie

  17. Ciao Julius,
    sei un GRANDE.
    Potresti sapere come far si che le pagine vengano caricate solo quando sono visusalizzate ?

    Puoi aiutarmi ?

    grazie sempre

  18. Ciao Julius,
    dimenticavo di drti che la domanda posta precedentemente

    Potresti sapere come far si che le pagine vengano caricate solo quando sono visusalizzate ?

    te l’ho posta in quanto la ram man mano che uso le mie 30 pagine.swf aumenta sempre di più.

    Ciao e buone feste

  19. Francesco

    ciao,
    ho il seguente problema:
    il sito su cui sto testando il pageflip si sviluppa in uno stage dove ci sono i link delle varie sezioni che caricano gli swf contenenti le sezioni sullo stesso livello …per convenzione ho scelto il 5.
    così facendo quando clicco su un link, il livello caricato va a sostituire la sezione precedente.
    quando clicco il link che mi carica il pageflip, la prima volta funziona tutto perfettamente; quando invece passo ad un’altra sezione… e quindi l’swf del pageflip viene sostituito con l’swf della nuova sezione e poi clicco nuovamente il link che carica il pageflip… questo viene caricato …ma non mi funziona più la possibilità di sfogliare le pagine trascinando le “orecchie”…mentre continuano a funzionare i pulsanti nextpage e previous.
    quando passo sulle orecchie con il mouse queste si sollevano ma non si riescono a trascinare… come se la funzione drag fosse disabilitata.
    se chiudo la pagina e la ricarico nuovamente pageflip rifunziona…sempre fino a quando non navigo tra le sezioni.
    succede anche a voi?
    che si può fare?
    grazie

  20. Ciao Julius, complimenti per il sito…io ti seguo sin dal vecchio blog e + passa il tempo più ti migliori…vorrei capire una cosa!

    Ho scaricato il pageflip e non ho problemi a modificarlo a mio piacimento…l’unica cosa che vorrei sapere è la seguente…nel momento in cui devo inserire questa “rivista” all’interno di un swf come posso fare?

    Altra domanda: uploadando on line devo uploadare tutto quello che trovo decompattando i file che scarico dal tuo sito? Sarebbe interessante fare un approfondimento per capire di cosa trattano nello specifico per vedere cosa si può eliminare e cosa no!

    Attendo una risposta! Grazie e ciao!

  21. ciao Julius,
    mi sapresti dire perchè la prima pagina se la sfoglio manualmente fino in fondo si “stacca” e va via :-(

    grazie

  22. @Dario per caricare un swf in un altro basta che utilizzi loadMovie, sapendo gia che avrai errori di percorsi leggi questo articolo _lockroot

    Per il caricamento su spazio devi caricare tutto tranne ovviamente i sorgenti .fla

    @davide ciao controlla che nel file XML alla pagina non si associato la possibilità di essere strappato tramite il parametro canTear=’true’

  23. Una domanda……io ho creato 2 page flip diversi con il tuo script e funziona tutto perfettamente.

    Se provo a caricarli dentro un swf mi carica il primo correttamente ma quando mi sposto sul fotogramma dove dovrebbe caricarmi l’altro, mi ricarica quello di prima.

    Pensavo fosse un problema di percorsi così ho invertito le posizioni e ora mi carica due volte l’altro. Sembra come se non scarichi il primo page flip caricato. Avevo provato con un unloadmovieNum ma zero.

    Hai qualche idea?

    Grazie mille

  24. CIAO JIULIUSSS!!
    volevo chiederti se era possibile impostare una funzione che permetta di far girare le pagine in automatico se non si fa nulla per 8/10 secondi…
    Mi potresti aiutare se puoi?

    grazie!

    diego

  25. Ciao Julius! ho un problema nel pageflip! non riesco a caricare gli .swf che contengono eventi, gallery, e questi fanno uso di un fil .xml. Per esempio io creo un swf cn all’interno un box dove carica dei file di testo attraverso un file xml.. quando esegui l’swf si vede solo il box senza scritte! come posso risolvere? questo è il codice ke ho usato nel .fla:

    //init TextArea component
    myText.html = true;
    myText.wordWrap = true;
    myText.multiline = true;
    myText.label.condenseWhite=true;
    /******************************/
    //load css
    kungFuStyle = new TextField.StyleSheet();
    kungFuStyle.load(“kungfu.css”);
    myText.styleSheet = kungFuStyle;

    /******************************/
    //load in XML
    kungFuContent = new XML();
    kungFuContent.ignoreWhite = true;
    kungFuContent.load(“kungfu.xml”);
    kungFuContent.onLoad = function(success)
    {
    if(success)
    {
    myText.text = kungFuContent;
    }
    }

    Attendo con ansia una risposta!

  26. Ciao Julius! ho inserito dei file .png con alcune parti trasparenti e esportando per flash player 9 mi mantiene le trasparenze ma mi fa vedere lo sfondo del page flip e non l’immagine successiva(che è quello che vorrei fare).
    Come posso fare?
    Grazie mille.
    Giacomo

  27. eeehhhhh..si, ok…non ho capito nulla..ti spiego, io sto usando un componente di flash cs3 e quindi ho poche cose da poter impostare…non so se mi sono spiegato.
    Mi puoi aiutare?
    Grazie mille per la velocità di risposta.
    G

  28. eccomi ancora julius! ho provato a vedere come è fatta una pagina trasparente nella source ma nn ci capisco niente…tra i parametri non trovo questa cosa della trasparenza…non è che potresti dirmi come ottenerla?
    Ho anche provato ad importare la pagina trasparente nel mio progetto ma nn cambia niente, ho addirittura provato ad importare il file .xml ma niente.
    aiutoooooo
    Grazie ancora..
    attendo risposta.
    G

  29. si funziona ma per i conti suoi, nel senso che mettendola nel mio progetto vedo lo sfondo del progetto e non la pagina dopo.
    come posso fare??
    G

  30. Francesco

    Ciao Julius, non so se ti ricordi di me ma ti avevo già chiesto alcune cosette per un pageflip “di prova” che stavo facendo (è di 16 pagine ho caricato tutte jpg e non mi dà più problemi) ora è arrivato il momento di farne uno “serio” che dovrà avere una sessantina di pagine, leggiendo i commenti degli altri sicuramente anche io posso avere problemi di caricamento, qualcuno parlava dei preloader ma io non sò come si usano, non hai qualche dritta o una versione di questo genere? Scusa se ti disturbo ma ho preferito informarmi prima di imbarcarmi nel lavoro per non rischiare di arrivare a metà strada per poi dover ricominciare con un’altra versione.
    Ciao e grazie in anticipo per avermi ascoltato.

  31. Ciao se devi fare una cosa professionale ti consiglio di acquistare questo componente davvero molto facile da usare…

    Poco meno di 18 euro in dollari 25

    Non avrai nessun BUG e problemi di incorporamento

  32. c’è la possibilità di mettere per ogni pagina un pulsante con un link alternativo che sarebbe l’immagine + grande o un link di un sito?

    se si qualcuno sa darmi qualche dritta?

  33. dannybai

    Julius il link alla versione v 3.26 non funziona più. Ho trovato su questo sito http://www.flashpageflip.com/ una versione simile (zoom, a tutto schermo stampa ecc) ma non ho ben capito la differenza tra la versione xml e la versione php perchè costa il doppio?

  34. @dannybai la versione 3.36 è stata sostituita con la 3.5

    La differenza di prezzo sta nelle risorse che ti mettono a disposizione, oltre alle specifiche del pageflip

  35. dannybai

    per un libro di circa 100 pag su sito php secondo te quale serebbe meglio, la versione pho o la versione xlm basic?
    Grazie Julius!

  36. Ti consigliere di comprare Flash Component Demo che trovi su Page-Flip

    Io per lavoro l’ho acquistata ed è davvero semplice da usare, in pratica è un componente che viene gestito tramite parametri da flash

  37. dannybai

    scusa per errore ho dato invio. Grazie del consiglio (oltretutto risparmio) ma scaricando la versione free qui da te e acquistando il componente avrai anche la funzione di zoom nella pagine?
    Ciao e grazie ancora

  38. Lo Zoom non c’è in quella versione…

    Però ultimamente è uscita una versione HTML edition con zoom interessante che costa 40$

Commenti