How to create a theme

[David]

Introduction
Smoresoft Sudoku players can completely change the look of the game by selecting from a list of theme files in the "Options", "Display" dialog.

A theme file contains the customizable settings that are used to display the Sudoku grid and background.  For example, a theme file may tell Smoresoft Sudoku to use the color green to display the clues or givens in a puzzle, and to display a picture of a sunset in the background.

Theme file name and location
A theme file must end with the extension ".theme".  For example, "MyTheme.theme" is a valid theme file name.

A theme file must be located in the "Themes" subfolder of the Smoresoft Sudoku installation folder.

For example, if the game is installed in "\Storage\Program Files\Smoresoft Sudoku", theme files will be in "\Storage\Program Files\Smoresoft Sudoku\Themes" (hereafter, the "Themes" folder).  Theme files can also be in any subfolder of the Themes folder, such as a "Themes\MyTheme" folder.

Theme file contents
A theme file is an XML document that can be edited with any text editor, such as Windows Notepad.  Following is a sample theme file:

Code: [Select]


 1. <configuration>
 2.  <theme>
 3.   <backColor>FFE6E1CF</backColor>
 4.   <backgroundImage>Glacier.jpg</backgroundImage>
 5.   <gridColor>FF6A4080</gridColor>
 6.   <gridBackColor>00000000</gridBackColor>
 7.   <oddBoxBackColor>FFD6CFE6</oddBoxBackColor>
 8.   <evenBoxBackColor>FFF7E6FF</evenBoxBackColor>
 9.   <givenColor>FF554080</givenColor>
10.   <inputColor>FF6030BF</inputColor>
11.   <invalidInputColor>FFE60066</invalidInputColor>
12.   <selectionColor>FFFFD700</selectionColor>
13.   <guideLineColor>FFFFEC8B</guideLineColor>
14.   <highlightColor>FFFFD700</highlightColor>
15.  </theme>
16. </configuration>

(NOTE: Line numbers are added to help explain the example.)

Line 1 is the configuration element. It is the container element for the theme settings.

Line 2 is the theme element. It indicates that the following XML content is a theme.

Line 3 is the first setting in the theme.  It specifies that the background color of the display should be set to the ARGB hexadecimal value "FFE6E1CF".  More on ARGB values later.

Line 4 specifies that the background image for the display should be read from the file "Glacier.jpg", which must be located in the same folder as the theme file.

Lines 5-14 contain the ARGB color settings for the rest of the display, such as the color of the lines used to draw the grid.

Lines 15 and 16 contain the closing XML tags that indicate the end of the theme file.

ARGB color values
"ARGB" stands for "Alpha", "Red", "Green", and "Blue", which are the components of every color that can be displayed in the game.  Each component is comprised of two hexadecimal digits, so the entire value is an 8-digit hexadecimal value.  "Alpha" is the transparency level, with "00" being completely transparent, and "FF" being completely opaque.  "Red", "Green", and "Blue" values simply represent the intensity of the respective colors, with "FF" being the most intense.  So, "FFFF0000" would be a completely opaque and intensely red color.

Fortunately, you don't have to know anything about ARGB values except that you can go to any number of web sites with a color palette, such as http://www.visibone.com/colorlab/big.html, click on a color, and the 6-digit RGB value will be displayed for you.  Then, all you have to do is add the "A" value, which is normally "FF" for completely opaque.

For example, the hexadecimal RGB value for "steel blue" is 4682B4, so the ARGB value for opaque steel blue is FF4682B4.

Once you've found the color you like, simply change the ARGB value between the XML tags for the color setting you wish to change. (See the "Reference" section below for a list of color settings.)

For example, to change the color of the digits entered while playing the game to steel blue, change the value between the "<inputColor>" and "</inputColor>" tags from FF6030BF to FF4682B4.

File name values
Some settings require a file name value, for example, the backgroundImage setting. The specified value should be the name of the file relative to the location containing the theme file.

Normally, you would install the image file in the same location as the theme file, so the value would simply be the name of the image file.

Installing your theme
Copy the theme file and any required resources, such as background images, to the "Themes" folder (see above), or, create a new folder under the "Themes" folder and copy your files there.

Your new theme should now show up in the list of themes in the "Options", "Display" dialog of the game.

Reference
The following theme settings are currently supported by Smoresoft Sudoku.

• backColor is the ARGB background color of the screen.
• backgroundImage is the filename of the image to display in the background of the screen, relative to the theme file. The image will be centered on the screen.
• evenBoxBackColor is the ARGB background color of the even-numbered boxes of the grid.
• givenColor is the ARGB color of the clues or "givens" that are provided at the beginning of the game.
• gridBackColor is the ARGB background color of the grid.
• gridColor is the ARGB color of the grid lines.
• guideLineColor is the ARGB color of the vertical and horizontal selection guidelines.
• highlightColor is the ARGB color used to highlight cells.
• inputColor is the ARGB color of the digits you enter as you play the game.
• invalidInputColor is the ARGB color of the invalid numbers you enter as you play the game.
• oddBoxBackColor is the ARGB background color of the odd-numbered boxes of the grid.
• selectionColor is the ARGB background color of the currently selected cell.