How to Change Size of Page Flip
“How do you change the dimensions of the pages used in the PageFlip book effect?” is a common question asked in the PageFlip Help section of this site. If you want to know how to resize the book or modify the size of the pages used in the Flash PageFlip effect then this tutorial is for you.
To be sure we’re working with the same file, download the most recent version of the Free Page Flip FLA. The file is a self-contained page flip solution with a SWF Player version-checker, a preloader, each page of the book, and the code that makes it all go.
You can watch a video walk-through illustrating every detail of this “Change Size of PageFlip” tutorial.
Changing the book’s size, requires the modification of two key aspects of the Page flip file. First you need to change the width and height variables found in the code and then you’ll need to change the content in the Print clips so everything fits within your new page size.
Modifying the Code:
- Open the PageFlip.fla file.
- Open the Library panel.
- Open the Book folder.
- Double-click the Bound Pages clip to begin editing it.
- Select the first frame of the Actions layer.
- Open the Actions panel.
- Go to line #16 and change the pageWi variable to the reflect the new width of your page in pixels.
- Go to line #17 and change the pageHi variable to the reflect the new height of your page in pixels.
Modifying the Print Clips:
- Open the Library panel.
- Open the Book folder.
- Open the Printed Pages folder.
- Double-click the Print1 clip to begin editing it.
- Create a new layer within the Print1 clip called “Page Bounds”.
- On the Page Bounds layer, draw a rectangle the size of your page.
- Align the the rectangle to the center of the stage.
- Right-click the Page Bounds layer and turn it into a “guide” layer.
- Lock the Page Bounds layer and place it at the bottom of the layer stack (if it isn’t there already).
- Add your content to the upper layers being sure it is completely contained within the Page Bounds.
Once you’ve modified the Print1 clip you can either repeat the same steps for all of the other print clips or you can duplicate the Print1 clip and rename it accordingly (Print2, Pint3, etc.) while being sure to retain the proper “Linkage Identifier” (print2, print3, etc).
You may need to resize the stage and reposition the “Pages” clip after changing the PageFlip’s dimensions.
If you’d like to rotate or scale the Pages clip you should read the PageFlip Transformation Tutorial.
If you want to change the total number of pages in the book, you can read this article about adding pages to the PageFlip.
Hope it helps.
Comments(39)
RSS Feeds
A great product with great help. Congratulations on your work
NB:I have amended the bounds page to:
var pageWi = 500;
var PageHi = 600;
& added a rectangle with the same x & y
Hi, 1st of all AWESOME & THANK YOU, seriously this is an excellent feature & you have clearly gone out of your way to help people, U rock!
May I ask? i have edited the 2 features as stated (BTW I am using FLash MX) when I test the movie (resized) all is good but when I export it it is still the incorrect size, any help would be greatly appreciated!!
@Holly, Open a FLA file in Flash. In the top menu select “Window” and then select “Library”.
I don’t know where the library panel is!
Karolis, Instead of running your flip function when the mouse is clicked, run it with SetInterval.
Hi, I’d like modify it so it would run continuesly without the need for mouse interaction. I managed to change so it flips when I press a mouse button but that’s it. Can you give any suggestions?
Thanks
Hello, im Carlos, this is my cuestion: i try to insert a flv into page2, but when in run the swf i can ear the movie run, but i watch the page 1… any idea to control flv?
thankS!
If you want to know how to scale, rotate or otherwise move the book around on the stage you can read this tutorial explaining how to transform the PageFlip.
I had the same problem, glo. The solution is to find the “Pages” clip (as Pixelwit speaks of above), and then just move it as needed.
You might need to move to the right place in the timeline to see the “Pages” clip (a small x)
hey!… thanks for this big help!….
I’m writting from Chile, and I’m trying to understand everything but I think i’ll get it little by little.
The question: I did change the size of the pages and when i see the final book, it is ok with the size BUT when I flipped the first page to the left, there’s no way you can flipped the page back because the book is centered and I can’t move it…. I’ve tried a lot of ways but I think i’m not getting what is the solution to move the book a little bit to the right…. and like that have enough space to see the whole thing.
Again…. thank you so much for your great job but most important, for sharing it with a lot of people.
I just need to ask you that does this work in flash 8 ?
Regards
creativemind23
Thanks for this great tutorial. Nice work!
-Andrew
Hi Max, changing the rotation of the book is pretty easy. Select the “Pages” clip on the stage, then go to the menu and choose Modify->ConvertToSymbol and name the new clip something like “BookHolder” while making sure that the registration point is centered. Now you can rotate and position the BookHolder clip as you see fit.
Hi,
first of all – thank you for this amazing tutorial!
My question is: how do I change the overall positioning of “the book” from flipping pages horizontally to flipping pages vertically?