Graphics Elements

From Smart LCD

Tachometer - Hand Mode (HND)

General
Show the basic information of the element
X and Y is the location of element on screen, reference point is element top-left corner
Width and Height are in pixels
top-left corner of the screen = 0,0
Style
Mode options are Hand / Donut Mix Color / Donut Discolor / Icon Rotation / Icon Open / Pseudo Icon Rotation / Pseudo Icon Open
Direction options Clockwise / CounterClockwise
Start Angle is the angular location of the min value
Sweep Angle is the effective angular area that relatively begin form the Start Angle for sensing 
Background
Marking & Label Enable can generate the meter face details
Base Color, Label, Minor Marking can be enable and define at here
Label Min Value and Label Max Value is for meter face display only. 
It show beside the Major Marking
Foreground
Hands Type options are Line / Quadrangle / Trangle
Hands Color is for the pointer hand color
Center Mark Color is color at the center of the meter
Rotation Center Point
Rotation Center options are Auto / Advance
Rotation Center X, Y define the the rotation reference point
Content
VP Resource is the type of VP to be used
VP Address is the VP for the operation
Min Value is the bottom value that can be shown
(value smaller than this value will stop at the min location)
Max Value is the top value that can be shown 
(value larger than this value will stop at the max location)
Properties Control (advance feature)
Enable VP is none by default (element operate normally)
Select a VP for real time element control. 
VP value will set to 1 as enable at power-on. It can be disabled (hidden) by a zero value
Base Color VP, Hands Color VP, Center Mark Color VP, Major Marking Color VP, Minor Marking Color VP and Label Color VP are none by default (using the above selected color)
Select a VP for real time base color adjustment
VP value will copy the above selected color at power-on
Hands Type VP, is none by default (using the above selected color) Select a VP for real time base color adjustment VP value will copy the above selected color at power-on
Preview
Preview Value is only for displaying text in SGTools environment

Note

*1. Radius and Angle Definition

Tachometer - (Pseudo) Icon Mode (TCM)

General
Show the basic information of the element
X and Y is the location of element on screen, reference point is element top-left corner
Width and Height are in pixels
top-left corner of the screen = 0,0
Style
Mode options are Hand / Donut Mix Color / Donut Discolor / Icon Rotation / Icon Open / Pseudo Icon Rotation / Pseudo Icon Open
Direction options Clockwise / CounterClockwise
Start Angle is the angular location of the min value
Sweep Angle is the effective angular area that relatively begin form the Start Angle for sensing
Foreground
Icon select an icon to be rotate
Transparent = False by default
True: enable transparent effect to show the IMG_ICO
Auto: enable transparent effect and pick a high possible color as Transparent color
Transparent Color assign one color in the IMG_ICO that show as transparent
suggested to use pure color for transparent effect (e.g. pure-magenta pure-black, pure-white, etc…)
Icon Center options are Auto / Advance
Icon Center X, Y define the the icon rotation reference
Rotation Center Point
Rotation Center could be Icon Center (auto select) or by manual
Rotation Center X, Y define the the rotation reference point
Content
VP Resource is the type of VP to be used
VP Address is the VP for the operation
Min Value is the bottom value that can be shown
(value smaller than this value will hide the tachometer)
Max Value is the top value that can be shown 
(value bigger than this value will hide the tachometer)
Properties Control (advance feature)
Enable VP is none by default (element operate normally)
Select a VP for real time element control. 
VP value will set to 1 as enable at power-on. It can be disabled (hidden) by a zero value
Transparent color VP is none by default (using the above selected color)
Select a VP for real time transparent color change. VP value will copy the above selected color at power-on.
Transparent VP is none by default (using the above option)
Select a VP for real time transparent background control. VP value will copy the above transparent config at power-on.
It can be enabled by a non-zero value or disable by a zero
Icon VP is none by default (using the above selected font)
Select a VP for real time IMG_ICON change. VP value will copy the above IMG_ICO ID at power-on.
Preview
Preview Value is only for displaying text in SGTools environment

Note

*1 Pseudo Icon Mode is similar to Icon Mode. It shows the Icon that pre-combined with background.

*2 Pseudo Icon Mode is similar to Icon Open Mode. It shows the Icon angle section that pre-combined with background

*3 Tachometer - Pseudo Icon Mode operation idea

Mode=Pseudo Icon Rotation; Transparent=True; Transparent Color=000000;

Direction=Clockwise; Start Angle=225; Sweep Angle=270; Min Value=0; Max Value=17;

Background Image Foreground Image Angles

Display result

VP value = 00~08

VP value = 09~17

*4 Tachometer - Pseudo Icon Open Mode operation idea

Mode=Pseudo Icon Open; Transparent=True; Transparent Color=000000;

Direction=Clockwise; Start Angle=270; Sweep Angle=180; Min Value=0; Max Value=14;

Background Image Foreground Image Angles

Display result

VP value = 00~04

VP value = 05~09

VP value = 10~14

Tachometer - Donut Mode (R16, R32)

General
Show the basic information of the element
X and Y is the location of element on screen, reference point is element top-left corner
Width and Height are in pixels
top-left corner of the screen = 0,0
Style
Mode options are Hand / Donut Mix Color / Donut Discolor / Icon Rotation / Icon Open / Pseudo Icon Rotation / Pseudo Icon Open
Direction options Clockwise / CounterClockwise
Start Angle is the angular location of the min value
Sweep Angle is the effective angular area that relatively begin form the Start Angle for sensing
Background
Show Base Color show the Donut shape background even at min value
(in Mix Color Mode, Background color is the Gap color)
Base Color is the Donut background color
(Mix Color Mode, Background color is the Gap color)
Internal Radius define the middle hole of the Donut
Edge Width can selected as an outline over the Donut
Foreground
Step Width is for adjust display Levels color size
Gap Width is for adjust the display Levels color gap which show Base Color
No.Of Levels
2 for Donut Mix Color Mode show a gradient mix of two color
3-26 for Donut Discolor Mode change the whole donut color w.r.t. VP value
Rotation Center
Rotation Center could be Icon Center (auto select) or by manual
Rotation Center X, Rotation Center Y define the is the rotation reference point
Content
VP Resource is the type of VP hold the content (VP_N16 by default)
VP Address is the VP that hold the value
Min Value is the minimum tachometer value to be show (value smaller than this value will hide the tachometer)
Max Value is the maximum tachometer value to be show (value bigger than this value will hide the tachometer) 
Properties Control (advance feature)
Enable VP is none by default (element operate normally)
Select a VP for real time element control.
VP value will set to 1 as enable at power-on. It can be disabled (hidden) by a zero value.
Color Array VP is for changing the color for visual effect
VP value will copy the above selected Color at power-on.
Preview
Preview Value is only for displaying text in SGTools environment

Note

*1. Definition of Radius and Angle *2. example: Direction = Clockwise; Start Angle = 255°; Sweep Angle = 270

*3. Donut Mix Color Mode example

*4. Donut Discolor Mode example

Progress Bar (B16)

General
Show the basic information of the element
X and Y is the location of element on screen, reference point is element top-left corner
Width and Height are in pixels
top-left corner of the screen = 0,0
Style
Mode options are
Color Mode, longer color bar could be show with a no. close to max (bar color could also be a mix of Forecolor1 & 2)
Icon Mode, Icon will move to the far end with a no. close to max
Fill Icon Mode, bar color could be replaced by an IMG_ICO
Direction options are
L->R / R->L / Up->Dn / Dn->Up
Forecolor1 Progress start color
Forecolor2 Progress end color
Transparent
False by default
True: enable transparent effect to show the IMG_ICO
Gap/Transparent Color function depends on mode selected
In Fill Color Mode, the selected color is gap color in the Progress Bar
In Icon Mode with Transparent Enabled, the selected color in the IMG_ICO will show as transparent.
(it is suggested to use pure color for transparent effect)(e.g. pure-magenta pure-black, pure-white, etc…)
Gap Width is in pixel for gap in the bar
Step Width is in pixel for the distance between gap
Content
VP Resource is the type of VP hold the content (VP_N16 by default)
VP Address is the VP that hold the value
Icon for Move Icon mode or Fill Icon mode
Min Value is the minimum Progress Bar value
Max Value is the maximum Progress Bar value
Properties Control (advance feature)
Enable VP is none by default (element operate normally)
Select a VP for real time element control. VP value will set to 1 as enable at power-on. It can be disabled (hidden) by a zero value
Foreground color1 VP is none by default (using the above selected color)
Select a VP for real time color change
VP value will copy the above selected color at power-on.
Foreground color2 VP is none by default (using the above selected color)
Select a VP for real time color change
VP value will copy the above selected color at power-on.
Transparent color VP is none by default (using the above selected color)
Select a VP for real time transparent color change
VP value will copy the above selected color at power-on.
Transparent VP is none by default (using the above option)
Select a VP for real time transparent background control VP value will copy the above transparent config at power-on. It can be enabled by a non-zero value or disable by a zero
ICON VP is none by default (using the above selected font)
Select a VP for real time change the IMG_ICO ID
VP value will copy the above ID at power-on.
Preview
Preview Value is only for displaying text in SGTools environment

note

*1. Progress Bar Operating Mode (Dn-->Up) Idea

Color Mode Fill Icon Mode Icon Mode
100% 60% 100% 60% 100% 60% 0%
. 100% 60%

100% 60%

100% 60% 0%