Skip to content

Creating Layouts

Jump to bottom
Robert Beekman edited this page Dec 18, 2017 · 4 revisions

Layouts are XML-files containing detailed information on the size and LED alignments of a specific device. Image-mappings for the UI can (should) be included too.
Each layout represents exactly one physical layout. This could be for example a US-keyboard, or a UK-keyboard (note that for example DE or FR wouldn't be its own layout, since the keys are physically aligned in the same way as the UK keyboard, they are only logically different!)

Layouts can be grouped into three different parts of which the first two are required, the third is optional.

  1. General information about the device.
  2. LED-data specifying which LEDs are on the device and how they are aligned.
  3. Image-Layouts

Finished layouts can be validated against the layout schema file.

1. General information about the device.

Field Description
Name The name of the layout.
Description The description of the layout.
Author The author of the layout.
Type The type of the device. Check this enum for available values.
Lighting The lighting mode of the device. Check this enum for available values.
Vendor The name of the device-manufacturer.
Model The exact model-name of the device.
Shape The shape of the device. Check this enum for available values. This value is optional and in most cases not needed since the default (rectangle) is correct.
Width The exact physical width in mm of the device.
Height The exact physical height in mm of the device.
LedUnitWidth The default width of a led used for layout calculations. This value is,optional with a default value of 19mm which should be correct for,standard keyboards. Other devices might need other values here.
LedUnitHeight The default height of a led used for layout calculations. This value is,optional with a default value of 19mm which should be correct for,standard keyboards. Other devices might need other values here.

2. LED-data

In the Leds-element you can provide a list of Led-elements specifying the exact layout of a single LED.
Each Led-element must have an Id-Attribute specifying the Id of the LED. Check this enum for available values. All other values are optional.
Shape The shape of the device. Check this enum for available values. Custom isn't meant to be used as a value here, instead provide an SVG-path to shape the led.
X The X-position of the led. There are multiple ways to calculate this. The default is +.

  • "+" Sets the location to be directly after the last led.
  • "+0" (0 can be any number) Sets the location to be after the last led with a gap of the given size.
  • "=" Sets the led to the same location as the previous led.
  • "-" Sets the location to be directly before the last led.
  • "-0" (0 can be any number) Sets the location to be before the last led with a gap of the given size.
  • "~" Acts as - but not from the start but the end of the led.
  • "~0" (0 can be any number) Acts as -0 but not from the start but the end of the led.

Y See X.
Width The width of a led can either be specified relative to the LedUnitWidth of the device by setting a value like 1.25 or 2, or as a absolute value by adding the mm suffix like 18mm.
Height See Width

3. Image-Layouts

Adding image-layout data is quite easy. Just create a LedImageLayout-element inside the LedImageLayouts-element for every layout specifying the logical layout name (Remember: DE and FR, etc) in the Layout-attribute.
After that you can add LedImage-elements to the LedImages-array for every led you laid out above. There are only two attributes required, Id and Image which contains the LedId ind the path to the image.

Example Layout

<?xml version="1.0" encoding="utf-8"?>
<Device xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
  <Name>RGB.NET example keyboard - Physical UK</Name>
  <Description>Physical UK-Layout of the RGB.NET example keyboard (Logical: DE, EU)</Description>
  <Author>Darth Affe</Author>
  <Type>Keyboard</Type>
  <Lighting>Key</Lighting>
  <Vendor>RGB.NET</Vendor>
  <Model>Example keyboard</Model>
  <Width>500</Width>
  <Height>165</Height>
  
  <Leds>
    <!-- Esc -> F12 -->
    <Led Id="Keyboard_Escape">
      <X>68</X>
      <Y>28</Y>
    </Led>

    <Led Id="Keyboard_F1">
      <X>+12.667</X>
    </Led>
    <Led Id="Keyboard_F2" />
    <Led Id="Keyboard_F3" />
    <Led Id="Keyboard_F4" />

    <Led Id="Keyboard_F5">
      <X>+12.667</X>
    </Led>
    <Led Id="Keyboard_F6" />
    <Led Id="Keyboard_F7" />
    <Led Id="Keyboard_F8" />

    <Led Id="Keyboard_F9">
      <X>+12.667</X>
    </Led>
    <Led Id="Keyboard_F10" />
    <Led Id="Keyboard_F11" />
    <Led Id="Keyboard_F12" />

    <!-- ^ -> 0- -->
    <Led Id="Keyboard_GraveAccentAndTilde">
      <X>68</X>
      <Y>49</Y>
    </Led>
    <Led Id="Keyboard_1" />
    <Led Id="Keyboard_2" />
    <Led Id="Keyboard_3" />
    <Led Id="Keyboard_4" />
    <Led Id="Keyboard_5" />
    <Led Id="Keyboard_6" />
    <Led Id="Keyboard_7" />
    <Led Id="Keyboard_8" />
    <Led Id="Keyboard_9" />
    <Led Id="Keyboard_0" />
	
	<!-- Tab -> Enter -->
    <Led Id="Keyboard_Tab">
      <X>68</X>
      <Y>+</Y>
      <Width>1.5</Width>
    </Led>
    <Led Id="Keyboard_Q" />
    <Led Id="Keyboard_W" />
    <Led Id="Keyboard_E" />
    <Led Id="Keyboard_R" />
    <Led Id="Keyboard_T" />
    <Led Id="Keyboard_Y" />
    <Led Id="Keyboard_U" />
    <Led Id="Keyboard_I" />
    <Led Id="Keyboard_O" />
    <Led Id="Keyboard_P" />
    <Led Id="Keyboard_BracketLeft" />
    <Led Id="Keyboard_BracketRight" />
    <Led Id="Keyboard_Enter">
      <Shape>M0,0 L0,0.5 L0.16666666666,0.5 L0.16666666666,1 L1,1 L1,0 Z</Shape>
      <Width>1.5</Width>
      <Height>2</Height>
    </Led>
  </Leds>

  <LedImageLayouts>
    <LedImageLayout Layout="DE">
      <LedImages>
        <LedImage Id="Keyboard_Escape" Image="K_Keys\Escape.png" />
        <LedImage Id="Keyboard_F1" Image="K_Keys\F1.png" />
        <LedImage Id="Keyboard_F2" Image="K_Keys\F2.png" />
        <LedImage Id="Keyboard_F3" Image="K_Keys\F3.png" />
        <LedImage Id="Keyboard_F4" Image="K_Keys\F4.png" />
        <LedImage Id="Keyboard_F5" Image="K_Keys\F5.png" />
        <LedImage Id="Keyboard_F6" Image="K_Keys\F6.png" />
        <LedImage Id="Keyboard_F7" Image="K_Keys\F7.png" />
        <LedImage Id="Keyboard_F8" Image="K_Keys\F8.png" />
        <LedImage Id="Keyboard_F9" Image="K_Keys\F9.png" />
        <LedImage Id="Keyboard_F10" Image="K_Keys\F10.png" />
        <LedImage Id="Keyboard_F11" Image="K_Keys\F11.png" />
        <LedImage Id="Keyboard_F12" Image="K_Keys\F12.png" />

        <LedImage Id="Keyboard_GraveAccentAndTilde" Image="K_Keys\Circumflex_Degree.png" />
        <LedImage Id="Keyboard_1" Image="K_Keys\1_ExclamationMark.png" />
        <LedImage Id="Keyboard_2" Image="K_Keys\2_QuotationMark_Exponent2.png" />
        <LedImage Id="Keyboard_3" Image="K_Keys\3_SectionSign_Exponent3.png" />
        <LedImage Id="Keyboard_4" Image="K_Keys\4_Dollar.png" />
        <LedImage Id="Keyboard_5" Image="K_Keys\5_Percent.png" />
        <LedImage Id="Keyboard_6" Image="K_Keys\6_Ampersand.png" />
        <LedImage Id="Keyboard_7" Image="K_Keys\7_Slash_CurlyBracketLeft.png" />
        <LedImage Id="Keyboard_8" Image="K_Keys\8_BracketLeft_SquareBracketLeft.png" />
        <LedImage Id="Keyboard_9" Image="K_Keys\9_BracketRight_SquareBracketRight.png" />
        <LedImage Id="Keyboard_0" Image="K_Keys\0_Equals_CurlyBracketRight.png" />
		
	<LedImage Id="Keyboard_Tab" Image="K_Keys\Tab.png" />
        <LedImage Id="Keyboard_Q" Image="K_Keys\Q_At.png" />
        <LedImage Id="Keyboard_W" Image="K_Keys\W.png" />
        <LedImage Id="Keyboard_E" Image="K_Keys\E_Euro.png" />
        <LedImage Id="Keyboard_R" Image="K_Keys\R.png" />
        <LedImage Id="Keyboard_T" Image="K_Keys\T.png" />
        <LedImage Id="Keyboard_Y" Image="K_Keys\Z.png" />
        <LedImage Id="Keyboard_U" Image="K_Keys\U.png" />
        <LedImage Id="Keyboard_I" Image="K_Keys\I.png" />
        <LedImage Id="Keyboard_O" Image="K_Keys\O.png" />
        <LedImage Id="Keyboard_P" Image="K_Keys\P.png" />
        <LedImage Id="Keyboard_BracketLeft" Image="K_Keys\UE.png" />
        <LedImage Id="Keyboard_BracketRight" Image="K_Keys\Plus_Asterisk_Tilde.png" />
        <LedImage Id="Keyboard_Enter" Image="K_Keys\Enter.png" />
      </LedImages>
    </LedImageLayout>
    <LedImageLayout Layout="EU">
      <LedImages>
        <LedImage Id="Keyboard_Escape" Image="K_Keys\Escape.png" />
        <LedImage Id="Keyboard_F1" Image="K_Keys\F1.png" />
        <LedImage Id="Keyboard_F2" Image="K_Keys\F2.png" />
        <LedImage Id="Keyboard_F3" Image="K_Keys\F3.png" />
        <LedImage Id="Keyboard_F4" Image="K_Keys\F4.png" />
        <LedImage Id="Keyboard_F5" Image="K_Keys\F5.png" />
        <LedImage Id="Keyboard_F6" Image="K_Keys\F6.png" />
        <LedImage Id="Keyboard_F7" Image="K_Keys\F7.png" />
        <LedImage Id="Keyboard_F8" Image="K_Keys\F8.png" />
        <LedImage Id="Keyboard_F9" Image="K_Keys\F9.png" />
        <LedImage Id="Keyboard_F10" Image="K_Keys\F10.png" />
        <LedImage Id="Keyboard_F11" Image="K_Keys\F11.png" />
        <LedImage Id="Keyboard_F12" Image="K_Keys\F12.png" />
		
        <LedImage Id="Keyboard_GraveAccentAndTilde" Image="K_Keys\AccentGrave_Tilde.png" />
        <LedImage Id="Keyboard_1" Image="K_Keys\1_ExclamationMark.png" />
        <LedImage Id="Keyboard_2" Image="K_Keys\2_At.png" />
        <LedImage Id="Keyboard_3" Image="K_Keys\3_Hash.png" />
        <LedImage Id="Keyboard_4" Image="K_Keys\4_Dollar.png" />
        <LedImage Id="Keyboard_5" Image="K_Keys\5_Percent_Euro.png" />
        <LedImage Id="Keyboard_6" Image="K_Keys\6_Circumflex.png" />
        <LedImage Id="Keyboard_7" Image="K_Keys\7_Ampersand.png" />
        <LedImage Id="Keyboard_8" Image="K_Keys\8_Asterisk.png" />
        <LedImage Id="Keyboard_9" Image="K_Keys\9_BracketRight.png" />
        <LedImage Id="Keyboard_0" Image="K_Keys\0_BracketRight.png" />
		
	<LedImage Id="Keyboard_Tab" Image="K_Keys\TabWText.png" />
        <LedImage Id="Keyboard_Q" Image="K_Keys\Q.png" />
        <LedImage Id="Keyboard_W" Image="K_Keys\W.png" />
        <LedImage Id="Keyboard_E" Image="K_Keys\E.png" />
        <LedImage Id="Keyboard_R" Image="K_Keys\R.png" />
        <LedImage Id="Keyboard_T" Image="K_Keys\T.png" />
        <LedImage Id="Keyboard_Y" Image="K_Keys\Y.png" />
        <LedImage Id="Keyboard_U" Image="K_Keys\U.png" />
        <LedImage Id="Keyboard_I" Image="K_Keys\I.png" />
        <LedImage Id="Keyboard_O" Image="K_Keys\O.png" />
        <LedImage Id="Keyboard_P" Image="K_Keys\P.png" />
        <LedImage Id="Keyboard_BracketLeft" Image="K_Keys\SquareBracketLeft_CurlyBracketLeft.png" />
        <LedImage Id="Keyboard_BracketRight" Image="K_Keys\SquareBracketRight_CurlyBracketRight.png" />
        <LedImage Id="Keyboard_Enter" Image="K_Keys\EnterWText.png" />
      </LedImages>
    </LedImageLayout>
  </LedImageLayouts>
</Device>
Clone this wiki locally