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
243 Commenti
Ciao Julius. Una info. In page flip ho visto che hai inserito i pulsanti next prev e goto. Li trovo molto utili, me credo che il limite di flash in questo progetto siano la mancanza dei comandi “Print”, “Zoom”, “Save Image”(Nel caso di immagini)
Ciao Dora,
Più che limiti del progetto direi che sono proprio opzioni mancanti in questa versione.
Come puoi vedere nella versione del PageFlip 3.26 i comandi per “Print”, “Zoom”, “Save Image” ci sono, ma essendo demo non ho la possibilità di verificare la loro funzione all’interno del pageflip.
Sono sempre io. guardando qualche altro tuo tutorial ( galleria dinamica con miniature ) ho visto che dai un modo molto semplice per prendere l’immagine e fare il popup su un file php
Stavo pensado di realizzare la stessa cosa anche per page flip, ma non ci riesco.
PageFlip popup
ciao
Ottimo. Ma come mai non si vedono le immagini nelle pagine del flash ma solo nei popup?? non si caricano nemmeno usando onClipEvent.
Excelente post!! gracias!!!
@dora questo si che è strano!! ^^
@David mucias gracias
julius il tuo sito è veramente carino , semplice e particolarmente utile, complimenti.
Ho scaricato pageFlip pupup, e non capisco perchè i popup funzionano ma le immagini sul “libro” non si vedono.
@edo ciao se riscarichi il file PageFlip popup nel commento precedente troverai una pagina con lo script per effettuare il popup, spiegato gia attraverso un Tutorial sul blog
Inoltre se ri-guardi il Tutorial del pageflip, alla fine dell’articolo, ho inserito la stessa pagina per effettuare un popup.
un saluto
Julius ho riscaricato il file, è ho anche visto la modifica la tutorial. Fino a qui tutto ok, ma credo di non essermi spiegato bene.
Io non voglio che la gente veda una skermata nera con il pulsante popup al centro, ma veda l’immagine caricata e con il pulsante popup mi sarà possibile caricare l’immagine alle dimensioni naturali.
Spero di essermi spiegato!! Sei un grande grazie!!
@edo ovviamente quello è un esempio, sul pulsante e nella pagina ci sono gli script per aprire una popup, spetterà a te modificare il pulsante e metterci quello che vuoi ^_^
lo script per il popup è semplice, alla fine è uguale ad un qualsiasi script di popup che si trova sul web, ma non riesco veramente a caricare l’immagine invece dello sfondo nero!!!
è una seplice immagine vettoriale la mia presente, cancella quella e inserisci la tua…
julius non voglio caricare un immagine statica, quello lo so fare basta un load movie. quello che voglio e mettere come sfondo la stessa immagine che verra caricata con il popup. e non so come passare la path corretta a loadMovie.
Non puoi per favore modificare il file in modo che faccia questo??
a ecco forse ora ti ho capito, comunque io aspetterei domani, e userei un altro modo per realizzare un anteprima delle immagini con il PageFlip, ci sarà un bel Tutorial a riguardo…
Comunque se poi anche domani sei ancora dell’idea di utilizzare popup (che tra l’altro alcuni browser bloccano) vediamo di risolvere…
Se ho capito bene fai un loadMovie dell’immagine piccola che verrà usata come pulsante per aprire una popup con l’immagine grande esatto?
Crea un clip di nome istanza box
nel primo frame dello stage
loadMovie("immagine.jpg",_root.box);
selezioni il box, entri nel codice, è inserisci il codice per la popup
In questo modo avrai un clip contenitore utilizzato come pulsante, in cui al suo interno ci sarà caricata l’immagine piccola
a domani allora, a mente fresca si ragiona meglio. Grazie julius
Hola ¿y como le aplico ZOOM a esta cosa?
saludos desde Chile
mira
http://www.flashbanditen.de/develop/pageflip/pageflip.html
http://www.flashforum.de/forum/showthread.php?t=220558&page=3
Ciao Julius
il tuo esempio crea un book 600×400…
è possibile diminuire le dimensioni?
Grazie.
Si non ci sono problemi, ricorda solo che lo stage deve essere più grande del pageflip, oppure non avrai zona sensibile per sfogliare completamente il book
Il problema è che non so dove intervenire..
Esempio: se volessi creare un book 400×200 (quindi 200×200 per ogni pagina) quali sono gli oggetti da ridimensionare?
Ti direi di ridimensionare sia le pagine dal file XML tramite widht e hright.
Il book aperto sarà 400×200 quindi il tuo stage non ti consiglio di farlo di uguali dimensioni bensì più grandi…poi questo spetta a te deciderlo.
Come ti ho detto prima, fare lo stage un pò più grande serve al fine di lasciare quella parte sensibile durante lo “sfogliamento” del book, altrimenti vedrai che la pagina si blocca…
funziona!
e non avevo alcun dubbio del resto!
gentilissimo come sempre Julius. Grazie mille
Figurati ciao
Buon giorno Julius.
è possibile passare ad una delle pagine del book (una animazione swf) che contiene un testo dinamico, il percorso del file txt da cui prendere il contenuto?
Grazie
Be la tua pagina è un swf, quindi ti basta creare un swf che legga i dati da un file esterno e poi usarlo come pagina…
Il fatto è che vorrei utilizzare la stessa pagina più volte, tipo un album descrittivo in cui ad esempio, a sinistra c’è la descrizione, ed a destra la foto.
Nel file xml che ho scaricato dal tuo sito (e che riporto di seguito) c’è una parte che fa pensare a questa possibilità:
src="pages/page4.jpg"
afterTear="someFunction,param1,'param2','param3'"
preLoad="true"
ma invece di una funzione come faccio a passargli una variabile?
Grazie Jiulius
Sinceramente non ho mai provato a inserie parametri in quel modo, anche se mi sembra specifico nel momento in cui una pagina viene “strappata” – “afterTear”.
Comunque prova a fare delle pagine che prendono un file esterno di testo, come vedrai nel Tutorial ho inserito una pagina per farti capire…
Qui puoi scaricare la pagina
NB: inserisci correttamente il percorso del file di testo nel .fla che scaricherai.
saluti
Grazie Jiulius ma volevo utilizzare la stessa pagina più volte nel mio book.
Ogni volta passando la chiave del file txt.
Ora ci ragiono un po’ su e se ne cavo qualcosa te lo faccio sapere, per condividerlo con gli altri flasher del blog.
Ciao
Si ma in teoria puoi usare la stessa pagina anche col mio metodo, ti basterà cambiare per ogni pagina solo il link al file esterno di testo….
Hai ragione…
infatti io già utilizzavo questo metodo…
il fatto è che se devo modificare una parte della pagina dovrei farlo in tutte le altre…
Bello.
Ma c’è anche il componente per flash?
Vorrei sapere come devo fare per aumentare le dimensioni (altezza e la larghezza )delle pagine del pageflip
Ciao Ma83,
premetto che questo non è un componente, per ridimensionare il pageflip in altezza e larcghezza, trovi i paramentri nel file .XML
saluti
Bello davvero! Complimenti!
Ho effettuato delle prove e modificando il testo nella prepage non mi appare più nulla, ne deduco che se sostituisco il testo in altre pagine ne viene fuori la stessa cosa, cioè nulla! :(
Sapresti indirizzarmi sullaquestione?
Grazie
Modificando il testo? In che senso?
Nel sorgente prepage.fla cè del testo (THIS PAGE IS BEFORE THE REST) se faccio una qualsiasi modifica al sorgente, in questo caso ci scrivo ad esempio (mio sito) non appare nessun testo dopo la pubblicazione.
Julius…. nessuna soluzione? :(
Ciaolo Lorenzo mi sembra veramente strano…Prova a riscaricare i file sorgenti
ciao
o.O ma li ho scaricati i sorgenti, sia quello con video che senza altrimenti non avrei potuto modificare i .fla. :))
ciao! complimenti x questo bell’ effetto, ke andro’ subito a mettere nel mio sito…. :)
pikkola domandina…. quale è il modo piu semplice per aggiungere delle pagine in piu?
grazie
ciao
p.s.: Julius rispondimi prestoooo :)
Ciao carolina,
ti basta usare il file XML, come descritto nell’articolo, e inserire il percorso della pagina…
ovvero devo solo scrivere questo per ogni pagina da aggiungere?
grazie mille
Si ovviamente avrai un swf nella cartella pages di nome page7
e nel file xml aggiungerai
<page src='pages/page7.swf' canTear='false' />
grazie :)
se ho altre domande t disturberò ancora :)
Si certo non esitare, alla prossima :)
saluti
Ciao, io lo zoom l’ho realizzato nella versione 2 di pageflip, è strutturato in modo tale da rispettare i margini delle pagine (il testo all’interno è stato inserito come tracciato in modo tale da poter essere leggibile anche al 200% di zoom).
Saluti
Bravo claudio sarei felice di vedere il tuo risultato :)
saluti
Pingback: links for 2007-08-19 | giancarlo.dimassa.net
Ciao a tutti,
sto provando questo splendido effetto ma vorrei fare in modo che il “libro” restasse aperto all’ultima img.,
in pratica non vorrei che si possa sfogliare fino a vedere la copertina posteriore.
Ho provato mettendo canflip = false, nel xml relativo all’ultima foto, ma nn succede nulla…
Qualche idea ?
Ciao e grazie per la condivisione ….
ciao ancora,
oltre al problema di cui sopra, ne ho un altro … :(
è possibile impostare(o ricavare) una variabile che mi indichi il numero di pagina attualmente visualizzata, in modo da usarla per associare un evento diverso per ogni immagine … ?
se nn sono stato abb chiaro vi posto il fla…
resto in attesa.grazie