Comments on: GUI: Thin skins, thick skins, and in-between

Carl Sassenrath, CTO
REBOL Technologies
20-Oct-2008 22:12 GMT

Article #0152
Main page || Index || Prior Article [0151] || Next Article [0153] || 1 Comments || Send feedback

GUI skinning is a popular topic for many programmers. Before we can talk about the kinds of skinning we want to support in R3, we should break the skin concept into a few levels.

 thin-skinlightweight changes that are made only to the attributes (facets) of GUI elements. For example changing the default background colors for panels, buttons, fields is a thin-skin change.
 medium-skinchanges made to the DRAW block specifications of GUI elements (within styles). These provide a greater level of graphical detail, but they are also more difficult to make (they are scalar vector graphic changes).
 thick-skinmainly changes to the layout of panels (other than those due to sizing) but may include changes to style actors (the interactor functions). For example, what if a panel includes special action icons along the right side, but a person wants to build a new skin that moves them to the top?

All of these are achievable in the R3 GUI, but they require different levels of skill.

Within the R3 GUI thin skinning can be done via master style-sheets that can be accessed by name within the styles themselves. (This is how we handle fonts attributes as well.) We can even allow users can make changes to their color schemes without any knowledge of the graphics system. A simple control panel, such as that used for Display Properties on Windows will work quite well.

Medium skinning requires changes to a style's DRAW block. It requires an understanding of vector graphics and how commands and attributes are combined to achieve the desired effects. So, these kinds of skins will need to be done by GUI programmers or artists.

To install such changes, we can use a method of inserting the new DRAW block as a style field override, and we can support that in a few ways, depending on whether we want to allow mixed skins within the same app instance. (Not something I really like the idea of, but it's possible.)

Thick skins require changes to the panel layouts. Layouts are not inherently difficult, but various "special requirements" in a design often lead to unusual exceptions that require deeper thought and greater experimentation. I think doing this type of skinning will depend more on coding conventions, such as encouraging programmers to follow an MVC methodology for their apps. Nevertheless, for well designed programs, changes to layouts should not be difficult.

Thick skin changes to style actors (interactors) are similar to style creation, and for all but the simplest cases will require a knowledgeable programmer.



20-Oct-2008 18:53:32
I would like to ask 2 questions:

1) medium-skin layer - what if I want to have conditional drawing,e.g. when I would like to display e.g. field being in focused state? With only one draw block instead of frames concept, what are my chances? Imagine possible states - up, down, over, in-focus, selected, disabled. Do I need to simplify my method, so that it is drawable using one draw block parametrised via facets? What do you suggest for more complicated states?

2) let's imagine more complex scenario, when I want to e.g. animate styles a bit? Do I need to write my own stylesheet for each particular style. I am talking mainly about transition effects ...

Post a Comment:

You can post a comment here. Keep it on-topic.


Blog id:



 Note: HTML tags allowed for: b i u li ol ul font span div a p br pre tt blockquote

This is a technical blog related to the above topic. We reserve the right to remove comments that are off-topic, irrelevant links, advertisements, spams, personal attacks, politics, religion, etc.

Updated 15-Jun-2024 - Edit - Copyright REBOL Technologies -