Skins and Shapes

mediaCam skins

The skin is constructed from 5 aligned bitmaps that are used to display the various button modes. The modes are disabled, normal, highlight, button down and button down highlight. The buttons are then cut out and compressed to form a single skin file using our own skin generation software.

Annotation Shapes

The annotation shapes are created from a description coded in a tagged XML-like script language. These files are plain text and can be opened or created using a text editor such as Microsoft's Notepad. They are found in the shapes folder under the mediaCam installation.

The best way to learn about the format is for you to open up a file and analyse the various sections.

All tags come in pairs, the first of these being the category tag which names the type of shapes in the file.
<CATEGORY>boxes</CATEGORY>

Then come the <SHAPES> </SHAPES> tags. Within these tags lie the shapes descriptions tags themselves <SHAPE> and </SHAPE>.

The first tag in a shape is its name <NAME> </NAME>.
This is followed by <RESTRICT> </RESTRICT>. This section is used to describe the way a shape can be scaled. The following tags can be used:

MINW restricts the minimum width
e.g. <MINW>64</MINW> will restrict the width to a minimum of 64 pixels

MINH restricts the minimum height
e.g. <MINH>W</MINH> will restrict the height to be no smaller than the width

MAXW restricts the maximum width

MAXH restricts the maximum height

WIDTH sets the width
e.g. <WIDTH>H/2</WIDTH> will set the width to half the height

HEIGHT sets the height
e.g. <HEIGHT>64</WIDTH> will set a fixed height of 64 pixels

Each shape is made up of a series of drawing layers. These are FILL, TEXT, and OUTLINE.
The coordinates used for your shape may either be absolute, i.e. 64, 200 etc. or dynamic i.e. H/2, (H+64)-(W/2) etc. Using absolute coordinates allows a section of a shape to remain the same size no matter its scale. Using dynamic coordinates allows position to be calculated as a factor of the width and height, allowing scaling of shapes.

FILL supplies the background to the shape. The following tags can be used:
   POLY creates a filled polgon
   POLYOFF removes a polygon area
   POLYSPLINE creates a filled smooth polygon
   POLYLINE draws a series of lines
   SPLINE draws a series of smooth lines
   RECT draws a rectangle
   RECTOFF removes a rectangle
   CIRCLE draws a circle
   CIRCLEOFF removes a circle
   ARC draws an arc
   ARCTO draws an arc from the current point
   LINE draws a line segment
   LINETO draws a line from the current point

TEXT supplies the text layer
CLIPRECT sets the position where the text appears

OUTLINE displays an outline around the shape. This layer uses the same tags as the fill layer.

Here is a simple example file.

<CATEGORY>Simple box</CATEGORY>
<SHAPES>
  <SHAPE>
    <NAME>Box</NAME>
      <RESTRICT>
        <MINW>30</MINW>
        <MINH>20</MINH>
      </RESTRICT>
    <FILL>
      <RECT>0,0,W,H</RECT>
    </FILL>
    <TEXT>
      <CLIPRECT>0,0,W,H</CLIPRECT>
    </TEXT>
  </SHAPE>
</SHAPES>