Flex book component (beta)
So here it is, the beta version of my Flex Book component. The source-code is included and free for all of you to look into (mind that it is licenced under a Creative Commons licence).
UPDATE: I also created a simpe demo to demonstrate the simplicity of using the Book classes, you can view/download it here:
Simple demo
Simple demo source
There are still a few performance-optimalisations to be made, so I welcome any (constructive) feedback on the Book component. If you spot any bugs or possibilities for optimalisation then please send me an email (my email-address can be found on the contact-page).
If you have any feedback other than bug-reports and suggestions for optimalisation, then please post them in the comments.
In the next week I will hopefully put up a simple demo as well to point out the simplicity of the usage of the Book component.
FEATURES
These are the main features of the component:
- Pageflip effect (not kidding ;))
- Hardback option for every page, as well as a hardcover option for the containing book, automatically making the first and last pages hardback.
- Functionality for tearing pages out of the containing book.
- Methods allowing automatically flipping through the pages of a book ( gotopage() ).
- Customizable easing, auto-pageflip duration, and size for the hit-regions (the page-corners whereby a page can be flipped).
- Distortion (instead of skewing) when flipping hardback pages.
- A variety of events that the book class dispatches, making customization alot simpler.
- Transparency support for pages.
- Live-bitmapping functionality for playing animation uninterrupted during pageflips.
- Locking functionality to keep certain pages from being flipped.
CREDITS
- Didier Brun for making his pageflip rendering class.
- Thomas Pfeiffer (aka Kiroukou) for letting me use his distortion class.
- the Factor.e for allowing me to publish the demo and the source-code..
- Maikel Sibbald for helping me with (among a lot of things) thinking out the structure of this component. He also made a usage-example of Didier’s pageflip class which I used as reference in the early days of the Book class..
- Theo Aartsma (aka Sumeco) for letting me use his artwork in the Book demo..
After the first (alpha) release of the Book classes, some suggested that I ought to give credit to my sources of inspiration.
So hereby I give credit for inspiration to every book I have ever read in my life, flipping through your pages was just amazing.
If I would have to give inspirational credits to any earlier version of the pageflip effect then I would give credit to the one that Eric Natzke did for DreamWorks, which is the first I ever saw (years and years ago).
KNOWN BUGS AND ISSUES
- For Book instances, height values greater than the height of the content may slow down the application.
- ScrollPolicies for Page instances are disabled (the properties have been overridden and are idle in the Page class). When a Page instance is not being flipped, its fold-gradient is drawn upon a Shape instance stored within that Page its rawChildren. When scrollbars are displayed, the Shape instance will no longer be in place.
- When a Book instance without any children is initialized a RangeError is thrown. I will look into this issue, in the meanwhile you may want to use the following workaround; Put two child Page instances in the Book instance, then (from withinin the creationComplete property of the Book instance) remove the two dummy-children by using the removeChild() method.

July 24th, 2008 | Quote
Hi,
This is a great app.
Can this be used in a commercial environment? with the relevant attribution?
Regards
Jon
July 21st, 2008 | Quote
Hi am new to flex 3. I have downloaded your source code. I dont know how to add it or how to open it using flex 3 . can u please guide me in doing it. I want to edit the file.
July 16th, 2008 | Quote
Hi Ruben,
Is it possible to spread a text area across the two page spread?
And turn off the right page - turning upon touching the right edge for that two page spread so that turning will not conflict with the scrollbar for the text area?
Thanks again for your wonderful component!
Arnold
July 15th, 2008 | Quote
Hi. Very great component.
It is on MIT licence?
July 14th, 2008 | Quote
I have the same Problem like Adam (june 12th, 2008). The pages, that are not currently “touched” or flipped, appear in low quality when the book is scaled.
I’ve played around with the stage.quality setting. When i set stage.quality=StageQuality.LOW, then the quality of the currently flipped page ist the same like the currently not-touched pages. But the stage.quality-setting works only for the currently touched/flipped Page. The other Pages are staying obviously on StageQuality.LOW (none or bad antialias). How can i fix this?
@Ruben: I love this component, it was the reason for me to getting started with Flex. Thanks.
Thankful for every hint — Tino
July 10th, 2008 | Quote
How to running in Flash CS3 !
I’m only use Flash CS3!
June 30th, 2008 | Quote
I preloader of sorts during certain parts of the book (i.e. at the start of every ‘chapter’) would help with the RAM issue.
June 27th, 2008 | Quote
Halo Ruben, I find that the Pageflip consumes lots of RAM if I add many pages. Is there any method to reduce RAM consumption? I have an idea and I would like to ask you the possibility and how to do it.
Make 6 hard code pages object in the book. If user flips to another page, the book replace the content of the page object to the target page content (original version is change the page object directly).
Is it possible? if yes, do you have any idea to do it?
Thank you very much
June 22nd, 2008 | Quote
Hi Ruben,
Firstly thanks for your amazing component!
I have a question for you, I have imported a Flexbook .swf into a flash as3 project I was wondering is there any way of accessing the “gotoPage() method” from the flash as3 project?
Basically I want to reset the book to it’s start page when it is not in use.
Please let me know, any help would be much appreciated!
Regards,
Tom Blyth
June 19th, 2008 | Quote
thanks your source.
i want to ask if i want to design some animation within 2 pages… what action script should i go through…
is it i need to separate the tweening to two part?
i will damn appreciate your reply…
June 16th, 2008 | Quote
A follow up to this:
#1 to have it run in Air you have to change the tag to and change the default X calculation of the book (which uses a formula that will break after this change).
#2 to get it into a projector you have to enable “Create Accessible SWF” in the Project options.
Now that I have gotten it into a desktop executable format I have found two bugs:
1) The book completely freezes in Fullscreen mode. The book will still respond to commands such as clicking on a “next page” button, but the results will not animate until you go back to normal windowed mode.
2) The book seems to displace it’s X value when the window is resized vertically. Unfortunately the AIR config file limitations on resizing don’t seem to work.
June 12th, 2008 | Quote
I am scaling my flipbook to fit the browser size. Everything work ok until I mouse over the corner of a page or start flipping a page. All the text and the images go fuzzy like they are being rasterized. I take out the scaling and it is perfect. I have tried scaling with scaleX/scaleY as well as stage.scaleMode as well as exporting a SWF file and importing and scaling that file. All of them have the effect. Any ideas?
June 11th, 2008 | Quote
I haven’t but when I say modified I mean I have basically just added scripting code on top of your component in separate classes, and I did comment a few lines out for gradient rendering but other than that nothing at all.
I don’t get any build errors or warnings either.
I’ve been fighting this issue for a week or so, I can’t run it in AIR, and I can’t even run the web version SWF in Flash Player. The only way it loads and runs is if it’s embedded and in a web browser. Very odd.
I put the question up on the Adobe support forums, hopefully I will get something back.
June 10th, 2008 | Quote
No anyone? normally adding af thousand embty canvas to another canvas, wich basically is what this is, would not create any problems alike..
June 6th, 2008 | Quote
There are some serious performance problems when adding many pages. The more pages you add, the slower the upstart gets. if i add 1000 pages with nothing on them it takes about half a minute to start up..
Does anyone know the reason for this?
June 4th, 2008 | Quote
For hiding pages on the fly, I am setting myShowFlag:Boolean as needed and using .visible = “{myShowFlag}” and .includeInLayout = “{myShowFlag}” but I not able hide those pages.
What am I missing - like a refresh or something?
Thanks — Arnold
rs:Page id=”myBookPage3″
visible=”{myShowFlag}”
includeInLayout=”{myShowFlag}”>
June 3rd, 2008 | Quote
@Andrew: I’m afraid for that you’ll just need to be creative with transparents bitmaps or something like it..
@CK: ..perhaps the getChildAt() and getChildName() methods will help you out with that one?
@Sefi: You mean that the currently viewed index shifts along when a Page is added at a smaller index? Sounds sensible, I’ll keep it in mind. Not sure when this will be actually implemented though (as there are more important features etc. to be worked on), but thanks man!
@BeN & oOo: Thanks for the input/sample-code guys!
@Michael: I have not yet tried to run the Book component in an AIR application, but I strongly doubt that that is what’s causing problems..
..have you tried using the original version of Book instead of the modified one your talking about?
May 28th, 2008 | Quote
I got it. Sorry for interruption.
Greetings Thorsten
May 28th, 2008 | Quote
Hi Mr. Swieringa,
awesome work that you are doing. Nice hp and blog anywhere.
I tried to get your flipbook component running in flex builder 3, but i have some trouble with the as-classes BookEvent and Page. I cant get it to run. Is this a known bug? Is it possible to open this demo in flex builer 3?
Thanks in advance.
Greeting from germany
Thorsten
May 27th, 2008 | Quote
Hey Ruben, another question for ya:
Do you have any experience putting your book component into an AIR application? I have attempted to put a modified version of your book component into an AIR app and it never shows up. Just get a gray background. Heck, it doesn’t even read the app dimensions. Any ideas?
May 25th, 2008 | Quote
mx:HSlider
id=”sliderbar”
snapInterval=”2″
value=”{myBook.currentPage}”
width=”600″
horizontalCenter=”0″
bottom=”15″
allowTrackClick=”true”
enabled=”true”
showDataTip=”false”
dataTipPrecision=”0″
rollOver=”slider_rollOver(event);”
rollOut=”slider_rollOut(event);”
change=”myBook.gotoPageFast(sliderbar.value)”
May 25th, 2008 | Quote
private function slider_rollOver(evt:MouseEvent):void {
Slider(evt.currentTarget).tickInterval = 2;
}
private function slider_rollOut(evt:MouseEvent):void {
Slider(evt.currentTarget).tickInterval = 0;
}
May 25th, 2008 | Quote
Ooops, the full code don’t appear !!!!!!!!!!!!!
May 25th, 2008 | Quote
Hello,
here is an horizontal slider bar…
import mx.controls.sliderClasses.Slider;
private function slider_rollOver(evt:MouseEvent):void {
Slider(evt.currentTarget).tickInterval = 2;
}
private function slider_rollOut(evt:MouseEvent):void {
}
function gotoPageFast => see Jevgeni post on December 10th, 2007 (insert the file book.as)
May 23rd, 2008 | Quote
@Fedlarm:
just figured out this second how to get rid of all actionscript related scaling problems (after some removechild/addchild/resizechild/etc. experiments
..simply add a canvas first..then the book inside it and you can scale (the canvas) as you wish (scaleX/scaleY)
@rubens
really great work! much appreciated and thanx for sharing
greez
May 22nd, 2008 | Quote
Hi Ruben,
Thanks for the clarification on the book shades.
I have an issue I’m trying to resolve, but mainly it relates to the issue of adding runtime pages to the book.
Consider I have 10 pages in the book, and I want to programmaticly add another page (using addChikldAt), but not at the end of the book, but rather in the middle.
This indeed adds the page, but causes all other pages to shift (naturally), which is fine. The problem begins when this causes the viewable pages to switch…
To reproduce this, just open the demo app provided with the book, and change the add tearable pages index from 10 to 8. You will see that the tearable page is added at index 8, but that causes the pages to visibly shift.
What I’d expect to happen is, that the pages are added, and the rest of the pages will have their index updated or something, so that the addition of pages before the current open pages do not visibly shift the pages…
What do you think?
Thanks,
Sefi
May 20th, 2008 | Quote
Hello Ruben,
I think i’ll try to make a ‘pageZoom function’ with mx.effects.Zoom and mx.effects.Move…
Thanks again
if it works fine, i’ll up the code
May 20th, 2008 | Quote
I cannot type XML here. I show it here.
hk.geocities.com/chingck2002/xml.html
Thanks.
May 20th, 2008 | Quote
I try to import a XML file, and I use for each method to get the data of number of pages and what images are included in the page.
In the looping, I am using addChild(ActionScript) to add a new page and using the same method to add image into a page, how can I control the image’s attribute in the page after added?
I am trying to control everything by one XML file. For example,
That means it has 2 pages and 2 images each page.
Can I modify the image attribute(such as x and y) after all addchild have done and all images have loaded?
Thank you very much.:)
May 20th, 2008 | Quote
Hi,
I suppose I should change pageR.x to (this.width / 2) + 40 (where 40 = 40 pixels for the spiral image but other than that… I’m lost :S
I was wondering if you can think of a way to add spirals in the center. I’m not too sure how to proceed, any help would be great!
Thanks
By spirals, I mean http://www1.istockphoto.com/file_thumbview_approve/4214969/2/istockphoto_4214969_old_notebook.jpg
May 20th, 2008 | Quote
@gre3n: As far as I know right now there are no tutorials yet, there are plans to create a knowledgebase with such information in the long run however.
@Fedlarm: Strange, I haven’t run into this problem before. I’ll look into it as soon as time allows to do so..
@Michael: There are several properties (in the Book class) that indicate in which direction a pageflip is being executed:
- autoFlipIndex
- lastFlippedDirection
- lastFlippedSide
Note that all of these are protected variables, meaning that you either will have to create a subclass of Book and implement an accessor-property (or -function), or go with plan B which is just hacking the Book class by changing the “protected” into “public” for one of the properties.
Of course the former is preferred and the latter (obviously) not.
If you use these properties in combination with the pageflipStarted-Event then I think you should be able to come up with a solution to your problem..
Good luck!
@BeN: Thanks! Yes I do, but unfortunately I do not have the time to write out a tutorial about it right now..
@CK: ..well you could bind the source of the image to a variable with curlybrace-syntax (and later change the value of the variable):
adobe.com/devnet/flex/quickstart/using_data_binding
May 20th, 2008 | Quote
I mean that how to modify it by actionscript.
May 20th, 2008 | Quote
Halo Ruben, please tell me, how can I modify the image property in every page without adding id to the image?
Thanks! I really like your production.
May 19th, 2008 | Quote
Hello Ruben, this is a very great job and you can be sure that i’ll use it in my project.
Have you an idea about how i can make a ‘pageZoom’ function or somethng like this?
May 16th, 2008 | Quote
Hi Ruben, I’m doing a project using your book component, and one thing I need to do is track what page the book is flipping to when the flip begins.
So, in this case, I am calling either nextPage() or prevPage() and I need to, at that time, determine if I am headed to X page to run some code…
I tried making autoFlipIndex in Book public and using that (it seemed to be what gotoPage was using) but I realized that prevPage and nextPage don’t use that functionality.
Any recommendations?
April 24th, 2008 | Quote
Hey there..
I’m just having some trouble with resizing the flexbook. I want to set the height through Actionscript with the percentHeight property, but for some reason i cannot do that, only with the height property.
Futhermore Im not able to set a new height or percentHeight, if e.g I resize the window. Seems like it can only be set once?
Any suggestions on how to be able to set som new heights and widths and/or the percentHeight problem.
Thanks for sharing this component
April 23rd, 2008 | Quote
Hey there, this looks like an amazing tool and would love to have a go at fiddling around with it.
Are there any basic tutorials on how to use it? Is it a component which you use with Flash?
April 21st, 2008 | Quote
@Sefi:
Hey Sefi, actually with Gradients.as you were on the right track, here’s some more info on some of the constants in the Gradients-class:
There are 4 constants that define the shadows and highlights on the pages in Book:
- FLIPSIDE
- INSIDE_SMOOTH
- OUTSIDE_SMOOTH
- OUTSIDE_HARD
Every one of these constants is an Object that has two properties (both Objects theirselves), called dark and light (the former defining the structure of a shadow and the latter that of a highlight).
Both properties store three Arrays (color, alpha and ratio) that function as values for the parameters of the beginGradientFill() method of the native Graphics class. I think that reading up on that method will clarify a lot.
As for the distinction between the 4 constants in the Gradients-class, I could write a few paragraphs on that one, but I think that you’ll get a better understanding by just adjusting values in the constants and seeing how it works..
I hope this helped..
@Julia & David: Direct-pageflip functionality has yet to be implemented. There are, however, a few people that posted solutions for this one. Perhaps you will find something useful if you go through the comments for this post.
April 18th, 2008 | Quote
Hello i´m try to jump of page, from page i to page i+s without pass the intermediates pages, who can i do that’s? can you help me please?
thanks
April 18th, 2008 | Quote
Hello Ruben,
Tell me please, how can I realize the option of the fast jump to the required page without using animation?
Cause if I need to jump from page 1 to page 100, for example, it will take too much time.
April 15th, 2008 | Quote
Realy great work!
Thanks!
April 14th, 2008 | Quote
Yesssss!
Both those links combined fixed it !
Now I have another question for you:
How is it possible to make the fold gradient more subtle?
I saw that Gradients.as defines some matrices which I assume define the fold gradient strength, but I couldn’t make sense of them…
Any hints?
Thanks a lot for your (and the community) help
April 13th, 2008 | Quote
Hey Sefi,
Is this the issue you’re having (it is indeed a bug)?
..if so then please check out this comment (it was posted by the same guy who reported the bug. Also, perhaps this comment may be useful in fixing this..
I have included this bug in a tasklist and will repare it in a future version of the Book component..
April 13th, 2008 | Quote
Hi Ruben,
I noticed something, and I don’t know if I’m doing something wrong or there’s a very peculiar bug in the book component.
When I add a book to an mxml file using tag and adding pages to it using tag, everything is normal in regards to shading.
But, when I add a book to an mxml file using tag and adding pages to it via code, using book.addchild(page), the flipping shadows work great, but when the flip animation that ends the shadow gradient abruptly and suddenly disappears (instead of it staying there to create the fold effect).
Am I doing something wrong? I went through the Gradients.as code but saw nothing that should catch me eye…
Thanks,
Sefi
April 4th, 2008 | Quote
There is a potential fast jamp to a page without using autoFlip?
example: page 1 to 100, using autoFlipDuration = 600 -> Long Time
March 31st, 2008 | Quote
Hey Josue, thanks for the compliment! I would recommend Essential Actionscript 3.0 (by Colin Moock), check it out and see if it would suit your needs..
March 31st, 2008 | Quote
Hello Ruben my name is josue and i would just like to say that i appreciate the type of work you do, i’m a student graphic designer in San Francisco and although most of my work relates to print, I have an untapped passion for coding and i’m geared more towards Flex, Actionscript, Javascripts. i know very little in this language and would like to know if you could recomend anything that would help better understand these languages. Thanks again
March 28th, 2008 | Quote
@Lee: I haven’t tried it out, but I’m pretty sure it’ll also work in Flex 3, as MXML and Actionscript3.0 haven’t changed from Flex 2 to 3..
@carlo: Dirk was referring to the showChildren()-method override in the SuperViewstack class..
March 28th, 2008 | Quote
Hi Dirk, i not understand where modify (showChildren), for load only three pages and not all pages…
You send me please?
Thanks!
March 21st, 2008 | Quote
I was wondering if anyone had plans to create this in Flex3?
March 14th, 2008 | Quote
Hello Ruben,
I’m trying now to turn the make the flex book size in the same size of the computer screen, but it’s seen that the property Height/Width doesn’t work when called by ActionScript.
I tried to find the part of the code, but with no sucess.
March 12th, 2008 | Quote
@Davi Costa:
Yes, that would be possible, though this would be much more of an implementation of the component than a feature in the component.
@zyry: I suppose adapting the library to fit your needs would be the shortest step. I do not really believe this is an issue that lies with the Book component though..
@Mike:
This question has been answered many times before; Book is a Flex-component and as such it uses Flex-only classes and components, there isn’t one almighty method or class that you can easily grab out of there and use to have the exact same thing in Flash.
March 12th, 2008 | Quote
How would I use these classes to run a book in flash and not in flex? I do not seem to find the method where the book is created (pages are loaded from images)?
Thanks for your help,
Mike
March 12th, 2008 | Quote
Hi.
If a remotely (crossdomain) loaded image happens to be on page, you get an error in function Page::getBitmapData: “Security sandbox violation: BitmapData.draw… A policy file is required, but the checkPolicyFile flag was not set when this media was loaded”. I use 3rd party library to load images so I can’t force LoaderContext to set checkPolicyFile = true. Can someone help me?
Greetings.
March 11th, 2008 | Quote
Hello Ruben,
It’s possible the book load the first pages and turn it on visible and continue load the other pages?
Looking your demo, looks that all content is loaded first to before show the book. In a situation that we have much pages, this could be a problem.
Thank you.
March 10th, 2008 | Quote
@juri
sorry
dont set visibility to true for all children underneath selectedChild, only for the three previous ones (showChildren::SuperViewStack)
if(i = this._selectedIndex - 2 // dirk visibility only for tree necessary page on each site (left/right stack)) {
child.visible = true;
}
else {
child.visible = false;
}
March 10th, 2008 | Quote
@juris
if(i = this._selectedIndex - 2 ){…
March 10th, 2008 | Quote
@juris
complete condition:
if(i = this._selectedIndex - 2 ) { …
March 10th, 2008 | Quote
@juris
dont set visibility to true for all children underneath selectedChild, only for the three previous ones (showChildren::SuperViewStack)
if(i = this._selectedIndex - 2 // dirk visibility only for tree necessary page on each site (left/right stack)
) {
child.visible = true;
}
else {
child.visible = false;
}
March 7th, 2008 | Quote
Hello again,
I found a way to resolve my previous ‘issue’:
” Can we set/reset the width and height of the book in action script? For example, if you do not know the actual dimensions of your images before runtime. ”
Basically, do not specify height/width in canvas; set it in action script of initialize event call back…
Nice book implementation of the flex book again,
James
March 7th, 2008 | Quote
Hello Ruben,
Great work…
Can we set/reset the width and height of the book in action script? For example, if you do not know the actual dimensions of your images before runtime.
thanks,
Westwind
March 6th, 2008 | Quote
I had to comment out line 1090 of Book.as which looks like the following:
if (ocf.cPoints != null && !this.tearActive) page.gradients.drawInside (this.render.graphics, ocf.cPoints, tint2, rotate);
With dynamically added content is was causing the shadowing to be duplicated and placed in the wrong spots such as weird triangles and other such things.
Here is my implimentation:
private function updatePages():void
{
var page:Page;
var userPage:Canvas;
book.removeAllChildren();
page = new Page();
page.setStyle(’backgroundAlpha’, ‘0′);
book.addChild(page);
for(var i:int = 0; i < userPages.length; i++)
{
// Left Page
page = new Page();
page.setStyle('backgroundAlpha', '0');
userPage = new UserPageLeft();
userPage.data = userPages.getItemAt(i);
page.addChild(userPage);
page.lock = i == 0;
book.addChild(page);
// Right Page
page = new Page();
page.setStyle(’backgroundAlpha’, ‘0′);
userPage = new UserPageRight();
userPage.data = userPages.getItemAt(i);
page.addChild(userPage);
page.lock = i == userPages.length - 1;
book.addChild(page);
}
book.gotoPage(1);
}
sideFlip="true" hardCover="true" hover="true" snap="false" flipOnClick="true">
March 4th, 2008 | Quote
Wonderful effect.
Greetings
March 3rd, 2008 | Quote
Hi! I unfortunately part of the code You have posted is missing
Can You please repost it?
Thank’s
March 2nd, 2008 | Quote
@tobias: Thanks!
@Sandy Martins: Read the first alinea of this blog-post.
@Kevin: I already answered that question some time ago, please read my reply-comment.
March 2nd, 2008 | Quote
awesome! best page-flipper there is in my opinion..
great work thanks a lot!
hope someone out there will develope some dynamic XML feature to this!
February 27th, 2008 | Quote
Dear sir madam,
I am writting to inquire about the price of the Software it self as soon as possible.
Many thanks
February 22nd, 2008 | Quote
I like your component. Could it support full spread pages?
aka.. a page that spreads across left and right side?
Thanks,
Kevin.
February 20th, 2008 | Quote
@CBass
tx for the idea and it works defintly better
but showChildren do it on one site (Set visibility to true for the children underneath selectedChild (and selectedChild itself), false for the rest)
if(i = this._selectedIndex - 2 // i add this to avoid set visibility to true for all page underneath selectedChild
till now works fine. also with more than 50 pages
Best
February 13th, 2008 | Quote
@Dirk : Here’s a little something i’ve made too boost the flipping for bigger books. It just set every page.visible to false, except for the 4 you need to see. Note that if you’re using transparency on multiple layers it might not give a good result. I’ve add the function getCurrentPage and modified showChildren. All changes have been made in SuperViewStack.as
protected function showChildren ():void {
var i:uint;
var child:Page;
var pageCurrent:int = -2;
var pageIndex:int = 0;
var changed:Boolean;
for (i=0;i pageIndex){
child.visible = true;
changed = true;
}
}
}
if(!changed && child.visible) child.visible = false;
}
// make sure fading is adjusted:
this.applyFade();
}
private function getCurrentPage(book:Book):int{
if (book == null){
return 0;
}else{
return book.currentPage;
}
}
February 10th, 2008 | Quote
alright…that makes everything much more easier for me. Thank you I really appreciate the help.
February 7th, 2008 | Quote
Hi Ruben,
if i add 100 and more pages, also pages without content, then the flipping is getting very slow. thats why i want to create a page caching to hold only a certain number of pages e.g 20, but if i delete a pages at index below the current id than the component refresh itself and the next page is displayed. it is possible to avoid that?
Do you have other tips for caching or by loading a lot pages?
Thanks a lot
Dirk
February 7th, 2008 | Quote
Hey Alma, thanks, here’s a quick (and not too detailed) rundown on how to use the component:
1) Download and install Flex (either Flex Builder or the Eclipse plugin):
2) Create a new Flex project.
3) Download the source for the Book component and open the .zip, then drag the ‘com’ and ‘org’ folders to the root of your Flex project folder.
Note that the other folder holds files specific to the online demo (i.e. images and CSS-files), so you don’t have to use it.
4) Now add the following namespace as an attribute to the <mx:Application> tag:
..we’ve now told our Flex project that for instance <rs:Book> will correspond to a class in the com/rubenswieringa/book folder.
Now start typing the following somewhere between <mx:Application> and </mx:Application>:
In essence, the <rs:Page> tag is just a <mx:Canvas> tag, so you can really put anything you want in it.
And that’s pretty much what you need to get you started, also go through the documentation if you need to look up anything:
rubenswieringa.com/code/as3/flex/Book/docs
Good luck!
February 7th, 2008 | Quote
ok…i was like really amazed by this it is very cool…but how can i use this… i don’t understand…could you please explain?….
February 6th, 2008 | Quote
@Austin: Creating an implementation of the Book component is in my opinion somewhat out of the scope of providing support like I am already doing. To be frank doing just that is already very time-consuming and on top of that I already have a very busy life as it is.
I’m sure you will be able to find a tutorial somewhere that explains how to load XML. When you know how to do that it shouldn’t be too hard to read the documentation and get the hang of the rest.
Good luck!
@Sefi: Very good point! I’ll keep that one in mind when I start doing some more work on the component.. Thanks
February 3rd, 2008 | Quote
Hi Ruben
Thanks for your reply.
I can make the changes you suggested to the code, probably will work from the sound of it (haven’t tried it yet).
Do you think it will be possible (complexity and/or time constraints on your part) to add a property to the Book.as class that enables/disables the glossy effect?
As you probably can imagine, I’m reluctant to make changes to an open-source component, especially one with such responsive support as you provide. I’d much rather use it as-is, plus that will make it possible for other users to use it as well.
Please let me know what you think.
Thanks!
February 2nd, 2008 | Quote
Sir…
i have doubt in this flip ….before that….its really too cool component… wanna like this….
and… my doubt is whether we can use external images in this book i mean that we can use XML to insert image URL?
if its yes …. how?
let me know the explanation!
thanks in advance
Austin
January 31st, 2008 |