Jump to content

Color: Difference between revisions

From LabVIEW Wiki
Add more details about System colors
Update and add contents
Line 1: Line 1:
'''Colors''' are represented in LabVIEW by an unsigned 32-bit integer. The integer is of the hexadecimal form 0x00RRGGBB, where RR, GG, and BB represent the red, green, and blue components of the color, respectively.
{{Underconstruction}}


== Special cases ==
LabVIEW represents colors as unsigned 32-bit integers in the form <code>0x00RRGGBB</code>, where <code>RR</code>, <code>GG</code>, and <code>BB</code> represent the ''red'', ''green'', and ''blue'' color components, respectively. The upper byte (<code>00</code>) is reserved for special colors like [[#Transparency|Transparent]] and [[#System Colors|System colors]] in which the least significant bit is set to <code>1</code>.


LabVIEW uses the upper byte (00) for special colors, normally this byte is used for transparency so using these color values in a different program might give odd results.
== Transparency ==


== Transparent  ==
The "transparent" color has the value <code>0x01000000</code>. Elements with this color appear fully transparent.


Transparent has a color value 0x01000000 the last bit of the transparency byte is high, this can be used to create 'holes' controls:
It is <u>not</u> possible to set a semi-transparent color to individual elements in LabVIEW<ref>[https://lavag.org/topic/5563-control-transparency/ Control Transparency] (LAVA)</ref>.


== System Background  ==
== System Colors ==
 
This color turns the background into the background of the front-panel/block diagram. It's value is 0x01000037, special details: [[System Label|System_Label]].
 
== System Color ==


{{ambox|text=What are the system colors on Linux and macOS?}}
{{ambox|text=What are the system colors on Linux and macOS?}}
Line 81: Line 77:
== User colors  ==
== User colors  ==


LabVIEW has additional colors that are used for specific elements, like the tank fill color, here's an overview of these colors and their LabVIEW color value, these are not stored with a special value, the following lists the default values for these colors. LabVIEW defines 15 colors per default, but has support for 3 additional colors.  
LabVIEW provides slots for up to 18 user colors that can be set to custom values. By default, 15 colors are pre-defined.


{| class="wikitable"
{| class="wikitable"
! colspan="2" | LabVIEW color table
! colspan="1" | Name
|-
! colspan="2" | Value
! Default LabVIEW color name
! Default LabVIEW color value
|-
|-
| 3D object  
| 3D object  
| <code>0x00BCBCBC</code>
| <code>0x00BCBCBC</code>
| <div style="display: block; background-color: #BCBCBC; padding: 10px;" />
|-
|-
| Control background  
| Control background  
| <code>0x00FAFAFA</code>
| <code>0x00FAFAFA</code>
| <div style="display: block; background-color: #FAFAFA; padding: 10px;" />
|-
|-
| Indicator background  
| Indicator background  
| <code>0x00D2D2D2</code>
| <code>0x00D2D2D2</code>
| <div style="display: block; background-color: #D2D2D2; padding: 10px;" />
|-
|-
| 3D Active object  
| 3D Active object  
| <code>0x00969696</code>
| <code>0x00969696</code>
| <div style="display: block; background-color: #969696; padding: 10px;" />
|-
|-
| Text  
| Text  
| <code>0x00000000</code>
| <code>0x00000000</code>
| <div style="display: block; background-color: #000000; padding: 10px;" />
|-
|-
| Led On  
| Led On  
| <code>0x0064FF00</code>
| <code>0x0064FF00</code>
| <div style="display: block; background-color: #64FF00; padding: 10px;" />
|-
|-
| Led Off  
| Led Off  
| <code>0x001E4B00</code>
| <code>0x001E4B00</code>
| <div style="display: block; background-color: #1E4800; padding: 10px;" />
|-
|-
| Thermometer Fill  
| Thermometer Fill  
| <code>0x00FF0000</code>
| <code>0x00FF0000</code>
| <div style="display: block; background-color: #FF0000; padding: 10px;" />
|-
|-
| Slide Fill  
| Slide Fill  
| <code>0x000041DC</code>
| <code>0x000041DC</code>
| <div style="display: block; background-color: #0041DC; padding: 10px;" />
|-
|-
| Slide Housing  
| Slide Housing  
| <code>0x006D6D83</code>
| <code>0x006D6D83</code>
| <div style="display: block; background-color: #6D6D83; padding: 10px;" />
|-
|-
| Tank Fill  
| Tank Fill  
| <code>0x000041DC</code>
| <code>0x000041DC</code>
| <div style="display: block; background-color: #0041DC; padding: 10px;" />
|-
|-
| Tank Housing  
| Tank Housing  
| <code>0x00A9B3CB</code>
| <code>0x00A9B3CB</code>
| <div style="display: block; background-color: #A9B3CB; padding: 10px;" />
|-
|-
| Classic Object  
| Classic Object  
| <code>0x00B3B3B3</code>
| <code>0x00B3B3B3</code>
| <div style="display: block; background-color: #B3B3B3; padding: 10px;" />
|-
|-
| Classic Slide Object  
| Classic Slide Object  
| <code>0x003399FF</code>
| <code>0x003399FF</code>
| <div style="display: block; background-color: #3399FF; padding: 10px;" />
|-
|-
| Refnum Wire  
| Refnum Wire  
| <code>0x00007F7F</code>
| <code>0x00007F7F</code>
| <div style="display: block; background-color: #007F7F; padding: 10px;" />
|}
|}


Line 139: Line 148:
[[File:ColorDropDownUser.png]]
[[File:ColorDropDownUser.png]]


== Adjustment  ==
=== Custom user colors ===
 
User colors can be set in the options dialog under ''Tools > Options... > Environment > Custom Colors...'':
 
[[File:ColorAdjustUser.png]]


To adjust (or add) colors use the LabVIEW options Dialog. In LabVIEW 2009 the colors can be set in the ''Environment'' section.
== Environment colors ==


A special dialog is available for the 18 supported colors:
When the least significant bit of the upper byte is set to <code>1</code>, LabVIEW returns environment colors. For example [[#Transparency|transparent]] (<code>0x01000000</code>). These environment colors are mostly undocumented. However, some resources are available<ref>[http://www.ni.com/example/29125/en/ Using System Colors] (NI Example Programs)</ref><ref>[https://labviewcvi.wordpress.com/2010/05/11/“secret”-labview-system-colors/ "Secret" LabVIEW System Colors] (Vision Technologies)</ref> which list following colors:


[[File:ColorAdjustUser.png]]
{| class="wikitable"
! Color
! Value
! Description
|-
| <code>0x01000000</code>
| <div style="display: block; background-color: #000000; opacity: 0; padding: 10px;" />
| Transparent
|-
| <code>0x01000001</code>
| ''---''
| '''Most Recent Color''': Represents whichever color was selected most recently.
|-
| <code>0x01000002</code>
| ''---''
| '''Bad Color''': Represents an ''invalid'' color.
|-
| <code>0x01000003</code>
| <div style="display: block; background-color: #646464; padding: 10px;" />
| '''Window Frame''' (System): Represents the system color for <code>COLOR_WINDOWFRAME (6)</code>
|-
| <code>0x01000004</code>
| <div style="display: block; background-color: #FFFFFF; padding: 10px;" />
| '''BtnHiLight''' (System): Represents the system color for <code>COLOR_BTNHILIGHT (20)</code>
|-
| <code>0x01000005</code>
| <div style="display: block; background-color: #A0A0A0; padding: 10px;" />
| '''BtnShadow''' (System): Represents the system color for <code>COLOR_BTNSHADOW (16)</code>
|-
| <code>0x01000006</code>
| <div style="display: block; background-color: #000000; padding: 10px;" />
| '''BtnText''' (System): Represents the system color for <code>COLOR_BTNTEXT (18)</code>
|-
| <code>0x01000007</code>
| <div style="display: block; background-color: #6D6D6D; padding: 10px;" />
| '''GrayText''' (System): Represents the system color for <code>COLOR_GRAYTEXT (17)</code>
|-
| <code>0x01000008</code>
| <div style="display: block; background-color: #0078D7; padding: 10px;" />
| '''HiLight''' (System): Represents the system color for <code>COLOR_HIGHLIGHT (13)</code>
|-
| <code>0x01000009</code>
| <div style="display: block; background-color: #FFFFFF; padding: 10px;" />
| '''HiLightText''' (System): Represents the system color for <code>COLOR_HIGHLIGHTTEXT (14)</code>
|-
| <code>0x0100000A</code>
| <div style="display: block; background-color: #FFFFFF; padding: 10px;" />
| '''Window''' (System): Represents the system color for <code>COLOR_WINDOW (5)</code>
|-
| <code>0x0100000B</code>
| <div style="display: block; background-color: #F0F0F0; padding: 10px;" />
| '''MsgBox''': Represents the color for message boxes.
|-
| <code>0x0100000C</code>
| <div style="display: block; background-color: #000000; padding: 10px;" />
| '''WindowText''' (System): Represents the system color for <code>COLOR_WINDOWTEXT (8)</code>
|-
| <code>0x0100000D</code>
| <div style="display: block; background-color: #000000; padding: 10px;" />
| '''ScrollArrow''': Arrow color on the scrollbar.
|-
| <code>0x0100000E</code>
| <div style="display: block; background-color: #000000; padding: 10px;" />
| '''ScrollArrowT''': Arrow color on the scrollbar when pressed.
|-
| <code>0x0100000F</code>
| <div style="display: block; background-color: #F0F0F0; padding: 10px;" />
| '''ScrollBtn''': Color for the scrollbar button.
|-
| <code>0x01000010</code>
| <div style="display: block; background-color: #F0F0F0; padding: 10px;" />
| '''ScrollBtnT''': Color for the scrollbar button when pressed.
|-
| <code>0x01000011</code>
|
| '''ListBoxContent''':
|-
| <code>0x01000012</code>
|
| '''ListBoxText''':
|-
| <code>0x01000013</code>
|
| '''ListHilite''':
|-
| <code>0x01000014</code>
|
| '''EditTextBg''':
|-
| <code>0x01000015</code>
|
| '''BtnFaceOff''':
|-
| <code>0x01000016</code>
|
| '''BtnFaceOn''':
|-
| <code>0x01000017</code>
|
| '''BtnFaceOffT''':
|-
| <code>0x01000018</code>
|
| '''BtnFaceOnT''':
|-
| <code>0x01000019</code>
|
| '''BtnTextOff''':
|-
| <code>0x0100001A</code>
|
| '''BtnTextOn''':
|-
| <code>0x0100001B</code>
|
| '''BtnTextOffT''':
|-
| <code>0x0100001C</code>
|
| '''BtnTextOnT''':
|-
| <code>0x0100001D</code>
|
| '''BevelBtnFaceOff''':
|-
| <code>0x0100001E</code>
|
| '''BevelBtnFaceOn''':
|-
| <code>0x0100001F</code>
|
| '''BevelBtnFaceOffT''':
|-
| <code>0x01000020</code>
|
| '''BevelBtnFaceOnT''':
|-
| <code>0x01000021</code>
|
| '''BevelBtnHilite''':
|-
| <code>0x01000022</code>
|
| '''BevelBtnShadow''':
|-
| <code>0x01000023</code>
|
| '''BevelBtnTextOff''':
|-
| <code>0x01000024</code>
|
| '''BevelBtnTextOn''':
|-
| <code>0x01000025</code>
|
| '''BevelBtnTextOffT''':
|-
| <code>0x01000026</code>
|
| '''BevelBtnTextOnT''':
|-
| <code>0x01000027</code>
|
| '''RingBtnTextOff''':
|-
| <code>0x01000028</code>
|
| '''RingBtnTextOn''':
|-
| <code>0x01000029</code>
|
| '''RingBtnTextOffT''':
|-
| <code>0x0100002A</code>
|
| '''RingBtnTextOnT''':
|-
| <code>0x0100002B</code>
|
| '''TipStripBG''':
|-
| <code>0x0100002C</code>
|
| '''TipStripText''':
|-
| <code>0x0100002D</code>
|
| '''MenuFG''':
|-
| <code>0x0100002E</code>
|
| '''MenuBG''':
|-
| <code>0x0100002F</code>
|
| '''MenuBarFG''':
|-
| <code>0x01000030</code>
|
| '''MenuBarBG''':
|-
| <code>0x01000031</code>
|
| '''ScrollBarFG''':
|-
| <code>0x01000032</code>
|
| '''ScrollBarBG''':
|-
| <code>0x01000033</code>
|
| '''TabHidden''':
|-
| <code>0x01000034</code>
|
| '''TabNorm''':
|-
| <code>0x01000035</code>
|
| '''3DDarkShadow''':
|-
| <code>0x01000036</code>
|
| '''3DLight''':
|-
| <code>0x01000037</code>
|
| '''SystemOwner''':
|-
| <code>0x01000038</code>
|
| '''Title Bar Active''':
|-
| <code>0x01000039</code>
|
| '''Title Bar Inactive''':
|-
| <code>0x0100003A</code>
|
| '''Title Bar Text Active''':
|-
| <code>0x0100003B</code>
|
| '''Title Bar Text Inactive''':
|-
| <code>0x0100003C</code>
|
| '''Radio Button Text''':
|-
| <code>0x0100003D</code>
|
| '''Checkbox Text''':
|}


== References ==
== References ==

Revision as of 08:50, 16 November 2019

LabVIEW represents colors as unsigned 32-bit integers in the form 0x00RRGGBB, where RR, GG, and BB represent the red, green, and blue color components, respectively. The upper byte (00) is reserved for special colors like Transparent and System colors in which the least significant bit is set to 1.

Transparency

The "transparent" color has the value 0x01000000. Elements with this color appear fully transparent.

It is not possible to set a semi-transparent color to individual elements in LabVIEW[1].

System Colors

LabVIEW provides six system colors that change depending on the selected color theme of the Operating System[2]:

Name Value
LabVIEW Windows[3] LabVIEW Windows[3]
Panel & Object COLOR_BTNFACE (15) 0x01000016 0x00F0F0F0
Panel & Object Text COLOR_BTNTEXT (18) 0x01000006 0x00000000
Window COLOR_WINDOW (5) 0x0100000A 0x00FFFFFF
Window Text COLOR_WINDOWTEXT (8) 0x0100000C 0x00000000
Highlight COLOR_HIGHLIGHT (13) 0x01000008 0x000078D7
Highlight Text COLOR_HIGHLIGHTTEXT (14) 0x01000009 0x00FFFFFF

There's a VI on ni.com that demonstrates all the LabVIEW system colors, which includes many more than can be selected from the color picker dialog: [1]

Change system colors on Windows 10

Windows 10 has no built-in dialog to change system colors[4]. The color values, however, can still be modified directly in the Registry under HKEY_CURRENT_USER\Control Panel\Colors (requires reboot) or via SetSysColor[5] (doesn't require reboot).

Reads a system color using GetSysColor[3]
Sets a system color using SetSysColor[5]

User colors

LabVIEW provides slots for up to 18 user colors that can be set to custom values. By default, 15 colors are pre-defined.

Name Value
3D object 0x00BCBCBC
Control background 0x00FAFAFA
Indicator background 0x00D2D2D2
3D Active object 0x00969696
Text 0x00000000
Led On 0x0064FF00
Led Off 0x001E4B00
Thermometer Fill 0x00FF0000
Slide Fill 0x000041DC
Slide Housing 0x006D6D83
Tank Fill 0x000041DC
Tank Housing 0x00A9B3CB
Classic Object 0x00B3B3B3
Classic Slide Object 0x003399FF
Refnum Wire 0x00007F7F

These color's are stored in the LabVIEW configuration file with the token colorUserItem

Custom user colors

User colors can be set in the options dialog under Tools > Options... > Environment > Custom Colors...:

Environment colors

When the least significant bit of the upper byte is set to 1, LabVIEW returns environment colors. For example transparent (0x01000000). These environment colors are mostly undocumented. However, some resources are available[6][7] which list following colors:

Color Value Description
0x01000000
Transparent
0x01000001 --- Most Recent Color: Represents whichever color was selected most recently.
0x01000002 --- Bad Color: Represents an invalid color.
0x01000003
Window Frame (System): Represents the system color for COLOR_WINDOWFRAME (6)
0x01000004
BtnHiLight (System): Represents the system color for COLOR_BTNHILIGHT (20)
0x01000005
BtnShadow (System): Represents the system color for COLOR_BTNSHADOW (16)
0x01000006
BtnText (System): Represents the system color for COLOR_BTNTEXT (18)
0x01000007
GrayText (System): Represents the system color for COLOR_GRAYTEXT (17)
0x01000008
HiLight (System): Represents the system color for COLOR_HIGHLIGHT (13)
0x01000009
HiLightText (System): Represents the system color for COLOR_HIGHLIGHTTEXT (14)
0x0100000A
Window (System): Represents the system color for COLOR_WINDOW (5)
0x0100000B
MsgBox: Represents the color for message boxes.
0x0100000C
WindowText (System): Represents the system color for COLOR_WINDOWTEXT (8)
0x0100000D
ScrollArrow: Arrow color on the scrollbar.
0x0100000E
ScrollArrowT: Arrow color on the scrollbar when pressed.
0x0100000F
ScrollBtn: Color for the scrollbar button.
0x01000010
ScrollBtnT: Color for the scrollbar button when pressed.
0x01000011 ListBoxContent:
0x01000012 ListBoxText:
0x01000013 ListHilite:
0x01000014 EditTextBg:
0x01000015 BtnFaceOff:
0x01000016 BtnFaceOn:
0x01000017 BtnFaceOffT:
0x01000018 BtnFaceOnT:
0x01000019 BtnTextOff:
0x0100001A BtnTextOn:
0x0100001B BtnTextOffT:
0x0100001C BtnTextOnT:
0x0100001D BevelBtnFaceOff:
0x0100001E BevelBtnFaceOn:
0x0100001F BevelBtnFaceOffT:
0x01000020 BevelBtnFaceOnT:
0x01000021 BevelBtnHilite:
0x01000022 BevelBtnShadow:
0x01000023 BevelBtnTextOff:
0x01000024 BevelBtnTextOn:
0x01000025 BevelBtnTextOffT:
0x01000026 BevelBtnTextOnT:
0x01000027 RingBtnTextOff:
0x01000028 RingBtnTextOn:
0x01000029 RingBtnTextOffT:
0x0100002A RingBtnTextOnT:
0x0100002B TipStripBG:
0x0100002C TipStripText:
0x0100002D MenuFG:
0x0100002E MenuBG:
0x0100002F MenuBarFG:
0x01000030 MenuBarBG:
0x01000031 ScrollBarFG:
0x01000032 ScrollBarBG:
0x01000033 TabHidden:
0x01000034 TabNorm:
0x01000035 3DDarkShadow:
0x01000036 3DLight:
0x01000037 SystemOwner:
0x01000038 Title Bar Active:
0x01000039 Title Bar Inactive:
0x0100003A Title Bar Text Active:
0x0100003B Title Bar Text Inactive:
0x0100003C Radio Button Text:
0x0100003D Checkbox Text:

References