| | 1 | [[BackLinksMenu]] |
| | 2 | |
| | 3 | = Part 3: Using Pages and Preview Mode = |
| | 4 | |
| | 5 | For this book, we're going to make a book with multiple pages. This is a simple book; it's going to have five pages, and each page will have an image on it. When the book is opened in preview mode, clicking on each image should go to the next page. It's not complicated, but these pieces can be put together to make more complicated books. |
| | 6 | |
| | 7 | Start by opening Sophie and making a new book (by choosing '''File > New Book''' or by pressing '''control-n'''.) |
| | 8 | |
| | 9 | Next we're going to set up the page size and the book title. Right now, Sophie automatically imports images as 280 pixels wide by 210 pixels high with the upper left corner 75 pixels from the top and left side of the book; this will change, but so we don't need to resize and move every image, we're going to set the page size so that an image is automatically centered on it and we don't need to move things. To set the book size, choose '''Edit > Set Page Dimensions''': |
| | 10 | |
| | 11 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook1.png)]] |
| | 12 | |
| | 13 | Set the width of the page to 430, click '''OK''', and set the height of the book to 360, then click '''OK''' again. |
| | 14 | |
| | 15 | Now we don't want the book to be called "New Book B", so let's set the book's title. Chose '''Edit > Set Book Title''': |
| | 16 | |
| | 17 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook1.png)]] |
| | 18 | |
| | 19 | Change the book title to "Five Page Book" or whatever you'd like the book to be called. You might at this point like to save your book; to do this, choose '''File > Save As''', and choose a location and a filename for your book. |
| | 20 | |
| | 21 | Next, let's get our images. We're going to use five images; you can download them [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/page1.jpg here], [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/page2.jpg here], [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/page3.jpg here], [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/page4.jpg here], and [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/page5.jpg here], or, if you'd like, you can download a ZIP of all five images [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/FivePageBookImages.zip here]. The images all look like this: |
| | 22 | |
| | 23 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/page1.jpg)]] |
| | 24 | |
| | 25 | Nothing fancy; each just says that it's a specific page. Before going on, download all the images to your desktop or some convenient folder. When you've done that, you're ready to import the first image. To do that, go to '''Insert > Image''' and select ''page1.jpg'': |
| | 26 | |
| | 27 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook3.png)]] |
| | 28 | |
| | 29 | The image will be inserted in the center of the page, like this: |
| | 30 | |
| | 31 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook4.png)]] |
| | 32 | |
| | 33 | (You'll notice that it's also gained a red border; all frames in this build of Sophie have red borders automatically, so these images take advantage of that.) |
| | 34 | |
| | 35 | Now we've made our first page; let's add a second page. To do this, click the '''>>''' button in the bottom of the book window (just to the right of the page number). This goes to the next page; if no next page exists, a new page will be created. When you're on page 2, select '''Insert > Image''' and choose ''page2.jpg''. Repeat this until you've created five pages: put ''page3.jpg'' on page 3, ''page4.jpg'' on page 4, and ''page5.jpg'' on page 5. |
| | 36 | |
| | 37 | Now we've created the pages; let's set actions on them. Go back to page 1 and click on the image so that the halos appear. We're going to use the link HUD: to get to this, click on the little chain halo (which is in the middle right above the frame). The link HUD will open like this: |
| | 38 | |
| | 39 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook5.png)]] |
| | 40 | |
| | 41 | We're going to create a link that goes to the next page when the frame is clicked. First, open the '''Trigger''' drop-down menu: |
| | 42 | |
| | 43 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook6.png)]] |
| | 44 | |
| | 45 | The option that we want is currently called '''FRAME_MOUSE_RELEASE''', which makes the link happen when the user clicks on the frame. (FRAME_MOUSE_RELEASE is different from FRAME_MOUSE_PRESS because FRAME_MOUSE_RELEASE only triggers when the user lets go of the mouse as opposed to when the user starts clicking the mouse.) Next let's open the '''Action''' drop-down menu: |
| | 46 | |
| | 47 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook7.png)]] |
| | 48 | |
| | 49 | We want '''Go to next page'''. Choose that, then click the link halo to close the link HUD. |
| | 50 | |
| | 51 | Do the same thing on pages 2, 3, and 4: each image needs a '''FRAME MOUSE RELEASE''' / '''Go to next page''' link. When you're done, save the book. You're done. (If you want to check if you've made the book correctly, you can download the finished book [http://sophie2.org/trac/export/3368/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/FivePageBook.sjrb.zip here] in zipped format. |
| | 52 | |
| | 53 | Now let's try the book out. We've been working in '''author mode''', which is the mode used for creating books: in this mode, when you click on the images with links, the links don't happen, but the halos appear. We don't always want the links to work: this could make editing the books very difficult. To see if the links work, we need to go into '''preview mode'''. To do this, click the '''Open Preview''' button on the bottom of the book window. The book will open in preview mode: |
| | 54 | |
| | 55 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook8.png)]] |
| | 56 | |
| | 57 | Preview mode shows the book as it will appear to readers: in preview mode, the book can't be edited, but the links will work. Click '''Close Preview''' to close the preview. |
| | 58 | |
| | 59 | We can also use Sophie Reader to look at our book. When you start up Sophie Reader, it looks like this: |
| | 60 | |
| | 61 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook9.png)]] |
| | 62 | |
| | 63 | Go to '''File > Open Book''' and select the book you saved. It will open as a finished book: |
| | 64 | |
| | 65 | [[Image(source:/branches/private/danvisel/sophie2-platform/doc/userdoc-images/RELEASE_8/5PageBook10.png)]] |
| | 66 | |
| | 67 | In Reader, the book cannot be edited; it can only be read. |
