Ticks Facelet

The Ticks Facelet renders circular ticks that can be used as part of a clock or gauge face.
It supports tick marks, background arcs and text labels arranged around a circle.

Configuration

  • Position
    X, Y center position in screen coordinates [mil].

  • Diameter
    Outer diameter of the tick circle in [mil]. 1000 = full screen size.

  • Rotation Angle
    Rotation angle offset in degrees. Supports data binding.

Ticks

  • Ticks
    Tick position definition string (see format below).
    Multiple tick sets can be defined, each with its own start/end angle range, color and outline width.

Background

  • Background
    Background arc segments. Each segment has a start angle, end angle and color.

  • Background Width
    Width of the background arcs in [mil].

Text

  • Text Size
    Size of the dial text labels in [mil].

  • Font
    Select the font family.

  • Text
    Text position definition in format text@angle, e.g. 12@0|3@90|6@180|9@270.
    Multiple text sets can be defined, each with its own color.

  • Flip

    Mode Description

    Normal

    Text is drawn normally (upright on top half).

    Flip

    Text is flipped (upside down on top half).

    Auto

    Text is automatically flipped to remain readable.


  • Visibility
    A condition expression. The Facelet is displayed if this evaluates to 1.

  • Display Mode

    Mode Description

    Normal

    This Facelet is only displayed in interactive (normal) mode.

    Ambient

    This Facelet is only displayed in ambient mode.

    Always

    This Facelet is displayed in both interactive and ambient mode.

  • Ambient Color
    Select a color for the ambient mode.
    0 uses the common ambient color of the face settings.

Tick Format

The Tick format is a text of single or ranged ticks like this:
190,r,0,30,5 30..90@30,r,0,50,10

Single Tick

A single tick is defined by its angle in degree 0-360, its shape (r,n,d,o,t,f) and its dimensions (length, width, etc).
All parameters are comma separated: angle,shape,offset,length,width, like 30,r,0,50,10.

Ranged Ticks

Ranged ticks are defined by a start..end@step range of angles in degree, their shape (r,n,d,o,t,i,f) and their dimensions (length, width, etc).
All parameters are comma separated: start..end@step,shape,offset,length,width, like 30..90@30,r,0,50,10. This draws three ticks at 30, 60, and 90 degrees.

Ticks Path

The ticks path is a string of tick definitions separated by spaces.
The ticks are drawn in the order of the path.

Tick Shapes

Parameter Shape Description

r,offset,len,width

Rectangle

offset to outer diameter, length from outer to inner, width

r,offset,len,width,top

Trapezoid

offset to outer diameter, length from outer to inner, width (outer), top (inner) width

n,offset,len,width,rx,ry

Rounded Rectangle

offset to outer diameter, length from outer to inner, width, rx and ry corner radius

d,offset,len,width

Double Rectangle

offset to outer diameter, length from outer to inner, width

o,offset,len,width

Oval

offset to outer diameter, length from outer to inner, width

t,offset,len,width

Triangle

offset to outer diameter, length from outer to inner, width

i,offset,len,width

Tri Rectangle

offset to outer diameter, length from outer to inner, width

f,offset,len,width

Flipped Triangle

offset to outer diameter, length from outer to inner, width


Examples

0..359@7.5,r,0,25,8
draws ticks every 7.5° starting at 0° with a rectangle shape of 25 mil length, 8 mil width and a zero offset to the outer diameter.

30,r,0,50,10 90,d,0,50,10 180,o,0,50,10
draws ticks at 30°, 90° and 180° degrees with different shapes.