Scrollable Players

A scrollable player can move within a visible area that is smaller than its content, allowing the user to scroll through it to view all the content. The scrollable players are pictures, text, and sublets.

The RECT property for a player creates a boundary for the area in which the player image can be seen. The RECT can be larger or smaller than the actual image. If the RECT is smaller than the image, the image can scroll within the RECT, making different parts visible at different times.

For example, to scroll a picture in response to a user's button click, you create a handler on the button. The handler says that each time the mouse clicks on the button, the horizontal scroll point (HSCROLL) property of the picture increments by 10 pixels.

A scrollable player's scroll range depends on its content. For example, if a text field has 100 lines and only 10 fit on the screen, it can scroll a maximum of 90 lines worth of pixels.

Creating a Scrolling Text Player

To create a scrolling text player, first create and define the properties of the text player:

1. Click the Text button in the Player toolbar to create a new text player.
2. Click the Properties button to display the Property sheet.
3. Give the player a name and specify a value for COLOR and FONT.
4. You can type up to 245 characters into the VALUE field; alternatively, you can use text that is in a file (up to 32K), as described next.
5. Set MULTILINE to on and under the Visible tab, set VISIBLE to on.
6. Close the Property sheet.
7. If you can't see the text in the Layout window, click the Show in Layout button.

If you want to use a text file:

1. Right-click on the text player and choose Data...
2. In the Open window, locate the .txt file you want to use. The file size cannot exceed 32K.
3. Select the file and click Open. If you can't see the text in the Layout window, click the Show in Layout button.

Now work with the RECT. The small box in the upper left corner of the Layout window shows the RECT of the text player. Grab a corner of the RECT and stretch it so that it shows the amount of text that you want. That RECT controls the boundary where your text scrolls, so make it as tall or as wide as you want.

Now the player is set up, but you must do something to control the scroll movement of the text. One way to control the movement is to create a handler. Another way is to create a control player.

Creating a Handler to Scroll the Text

One simple way to scroll the text player is with user clicks. To do this, put a Handler on the text player so that it scrolls when the user clicks on it:

1. Right-click on the text player and choose Handlers from the pop-up menu.
2. Click on the New Handler button.
   A MOUSEDOWN message appears as a default. Keep MOUSEDOWN because a user clicking on the text will send the MOUSEDOWN message to it.
3. Click on the Insert Line button to tell the text player what to do when it receives the MOUSEDOWN message.
   The default that appears is ME, SHOW.
4. Click on ME and select your text player.
5. Under Action, click on SHOW and choose INCREMENT, VSCROLL.
   This tells the text to scroll vertically to somewhere within the text. VSCROLL controls which lines of the multiline text appear in the RECT. Its value is the vertical scrolling point, an X,Y coordinate within the text, with the X value always being 0.
6. When the Dialog box pops up, enter the number of pixels in each scroll. Try setting this value to 50 at first; you can change it later.

Close the Handler window and press the Play button to test the mbedlet. With each click, the text should scroll down in the RECT. The VSCROLL increases with every click. Its X,Y points are 0,50, then 0,100, then 0,150, and so on.

Creating a Control Player to Scroll the Text

Another way to scroll is to create a control player. With the built-in functionality of controls, the value of the control can continuously reset the VSCROLL value for the text, causing the text to scroll smoothly up and down.

If you have created a Handler on the text player, delete it now. Select the whole thing in the Handler window and click the Delete Handler button.

Create a new control player as follows:

1. Click on the Control button in the Player toolbar to create a new control player.
2. Right-click on the control player and choose Properties.
3. Rename the player.

Set the following properties:

The Control you created has a straight path by default.

In the Layout window:

1. Click the Show in Layout button and the control's path appears.
2. Move the path so that it is along the right or left side of the text.
3. The path is not visible when the mbedlet runs. You must put a graphic into the control to give the user something to see and slide along the invisible path.
4. To add a .gif or .jpeg file containing an image, highlight the control player in the Players window, then click the Data button in the toolbar.
5. Choose your graphic file (and alpha channel mask if you have one), and click Done.
   You should see the control's image in the Players window.

Try running the mbedlet. As you slide the control, the text in the text player should scroll.

To add something to represent the "path" for the control, you can create a picture player with a straight line graphic. Or simply create a box player that looks like a narrow, straight line.

Previous Page Next Page