Skinning the IOS Desktop

Document Version 1.0
IOS Version 1.0

Contents:

1. Overview
2. How It Works
      2.1 Skin File Location
      2.2 Skin Structure
3. Example Skin Effects
4. Skin Images
5. Synchronizing the Skin
6. How to Fix Problems

1. Overview

The REBOL/Link 1.0 desktop has a limited degree of "skinning" that can be done to modify its appearance. The background image and the image effect can be easily modified. In the 1.0, the button, text, and icon locations cannot be modified.

2. How It Works

When the Link desktop starts, it looks for a file called skin.r. This file holds a REBOL block can specify two elements of the desktop:

• Its background image
• Its graphical effects

Modifying these two elements can give you thousands of variations in the look of the desktop.

Additional desktop skin elements will be added in upcoming releases of IOS.

2.1 Skin File Location

The skin file is located in the desktop directory under the Link's root location. For example, if Link is installed at in /c/rebol/link/ and the IOS name is my-company, the skin.r file is:

/c/rebol/link/my-company/desktop/skin.r

The skin file can be modified locally by the user or by an application, or it can be synchronized by the administrator to give all users the same desktop appearance.

The skin is part of the Desktop fileset and can only be modified with administrator permissions.

2.2 Skin Structure

The skin.r file has the structure:

back-image: image! back-effect: [ effect block ]

The image field contains the relative file path to an alternate backdrop image. It is optional.

The effect block is a standard face effect block (see the REBOL/View documentation) and allows a great range effects including gradients, grids, blurs, contrast, tint, etc.

The skin.r structure is loaded when the desktop boots. If you modify it, be sure that it is valid. An error will prevent the desktop from booting.

Do not synchronize a skin with other users until you have tested first it yourself.

3. Example Skin Effects

Here are some example desktop skins that can be created by simply changing the back-effect block. To try these yourself, create a skin.r file in the desktop directory and restart your Link client.

Setting the skin.r file to:

back-effect: [luma -40 multiply 255.155.120 extend 150x100]

will produce:

The luma darkens the image slightly. The multiply shifts the colors to yellow, and the extend is used for rescaling the image when the window is resized.

Similarly, the effect:

back-effect: [luma -40 multiply 120.150.250 extend 150x100]

will produce:

All of the standard face effects are possible, even effects like GRID can be used:

back-effect: [extend 150x100 grid 190.190.190]

which produces:

Or, get wild with gradient multiplication:

back-effect: [extend 150x100 gradmul 1x1 110.110.255 255.110.110]

that results in:

Or, make it subtle with:

back-effect: [contrast -80 luma 40 extend 150x100]

that ends up as:

Many other types of effects can also be produced. If an alternate image is used, the range of skin appearance is endless.

4. Skin Images

The backdrop image of the desktop can also be modified. For example, the image below is the actual PNG image that is used by the desktop.

You could easily modify this image using a paint program and make it look like:

To use this new desktop image, copy it to your desktop directory and create a skin.r file that contains the line:

back-image: %desktop/backdrop2.png

The desktop will now appear as:

Any other image can be used, even a photograph. The trick is to determine how the image needs to scale when the window is resized.

For the default desktop, the image is scaled from the extend effect that is part of the effects block. It was seen in the previous section:

extend 150x100

This extends the image at the horizontal offset of 150 and at the vertical offset of 100.

Other approaches to scaling are permitted. For instance, if you are using a photograph, you may want to use the FIT effect.

For example, this photograph:

and this skin.r file:

back-image: %desktop/nyc.jpg back-effect: [contrast -50 luma 80 fit]

will produce this desktop:

To soften the backdrop, you can add a BLUR effect after the FIT:

back-image: %desktop/nyc.jpg back-effect: [contrast -50 luma 80 fit blur]

A wide range of possibilities exists.

5. Synchronizing the Skin

The IOS administrator can install a new desktop skin for all users. To do so, it is necessary to synchronize the skin.r file along with any image that is needed, but without adding the icons to the desktop.

This can be done with the Up-File tool that is found in the Admin arena. This tool lets an administrator add files to existing filesets, but without adding icons.

To add a skin, run Up-File and click on the desktop fileset. A list of files will appear:

To add a new skin.r file, click on the top entry:

desktop/desktop.pkg

and select the New button on the requestor. Then select your skin.r file from the file requestor. This will add the skin.r file to the desktop fileset in the same location as the desktop.pkg file.

To change the skin.r file once it exists, you would simply click on its entry:

desktop/skin.r

A similar approach is used for adding or updating desktop images. Do not forget to synchronize your desktop image file. If your skin.r file refers to a missing file in 1.0, the client will not start. (See the next section for the remedy.)

Note that changes will not appear on the Link clients until they have been restarted. If a user is not on-line when the change is made, they will need to restart their client once the file has been synchronized.

6. How to Fix Problems

If you make a mistake that prevents your client from booting, the simplest solution is to delete the skin.r file. This can be done easily if the skin.r file is local and not synchronized.

It is strongly suggested that you double check your skin.r and image changes locally before synchronizing. If you sync a bad skin, you will need to delete it manually from each client (that was running) before the client can boot again.