Sometimes portions of the layout in your project is common between many pages. That is the case when you design custom navigation controls that should appear in exactly the same position and with exactly the same behavior in all pages, or perhaps you want to share some layout items between different pages to create a custom layout for each chapter of your book and so on.
That’s where overlay pages come in handy. An overlay page is a page whose contents are displayed on top of the content of a group of pages. Overlay Pages are visually displayed in the form of bars on top of regular pages in the pages selector, at the bottom of your project window.
PubCoder automatically sets up an overlay page for every project, which is empty at start. Simply click the “Overlay” bar to access it.
When an overlay is selected, like in the image above, it acts as a regular page on the stage and you can add to it whatever you can add to a regular page: images, text, sounds, interactivity and so on.
Each overlay bar also has two resize widgets at their side, that you can drag to redefine the group of pages on top of which the overlay has to appear. Overlay are automatically created for pages that do not have one, so you can create different overalys for different sets of pages.
In the example in this page, the overlay is being used to display navigation arrows using three different overlays:
- Page 1 has its own overlay, which will have only one arrow (being the first page is not possible to go one page back)
- Page 2, 3, 4 share the same overlay, with both arrows in place
- Page 5 has its own overlay, which will have only one arrow to go to the previous page