XtreMe PCR->General Options->Themes

 

Theme Creation and Submission Guide

Version 1.00 of XtreMe PCR supports Themes.  Themes define the visual aspects of the user interface -- background colors, button shading, menu and toolbar colors, etc.  Themes bring life and personality to the XtreMe PCR software.

As a user, you have the ability to create themes for XtreMe PCR.  All it takes is a bit of knowledge of HTML color values, a sense of what "looks good", Windows Notepad, and a bit of patience.  From here on out, I am going to reference Notepad as the editor.  You can use your favorite editor in place of Notepad -- just make sure that it will save a plain text document.  Microsoft Word is not a recommended editor.

The first thing to do is to find where the themes are stored.  If you've installed XtreMe PCR to the default location, you should find a bunch of themes in the C:\Program Files\XtreMe PCR\Themes folder.  Look for the files with a ".xtheme" extension.  These are the actual theme definition files.  If you change the name of a file from anything but .xtheme, XtreMe PCR will ignore it.  The theme name displayed in the XtreMe PCR is actually the file name (minus the .xtheme) extension.

 

In the Themes folder, you should find such files as "Atmosphere.xtheme", "Born in the USA.xtheme", "Carribean Blue.xtheme", and so on.  Open one of these files in Notepad, and you'll quickly see the work that lies ahead of you.  (I recommend you do a "File->Save As...", to save an existing theme with a different name.

 

There is a bit of explanation to get out of the way before we dig into the specifics of each color entry in this file.  Some of the colors support Alpha values (color with transparency), while some of the colors must be solid colors.  As each color is read out of the file, XtreMe PCR knows which values should have alpha values, and which shouldn't.

  • If an alpha value is supplied, but is not used for that particular user element, XtreMe PCR ignores it.

  • If an alpha value is required but not supplied, XtreMe PCR assumes an alpha channel value of FF.

  • 6-digit values are called RGB values.  8-digit values are called ARGB values.  All values are prefaced with a # symbol.

  • #FFFFFF is solid white, no alpha channel.  #AAFFFFFF is solid white, but that white is 66% transparent.  In this case, the AA portion of the 8-digit color reference is the 'A' value.

  • RGB values are represented as RRGGBB.  The range of each is 00 to FF, in hexidecimal.

  • ARGB values are represented as AARRGGBB.  The range of each is, likewise, 00 to FF in hexidecimal.

Most of the color values that do not support Alpha blending are due to them being 'base' colors.  You cannot have an alpha blend against an 'unknown' background.  If a background is first filled with a known value, another color can be "layered" on top of it to create a (sometimes) stunning effect.  Here is a good sample of an alpha blended area.  This is a cropped part of the XtreMe PCR theme "Born in the USA":

In this case, we have a flag pattern (as a .jpg image) as our background base.  The alpha blending of a bluish color over top of the flag graphic still allows you to recognize much of the red and white portions of the flag, while supplying a blue tint to the whole thing.

If you look very closely, the vertical bars that run down the extreme left and right hand sides of the frame go from a reddish color at the top, and gradually fade into a bluish color at the bottom of the frame.  This type of effect is called a gradient.  A gradient has a start color and an end color -- as well as a direction.  It may be a bit hard to tell, but the sample above actually starts with a more transparent blue value at the top of the frame, and gradually turns to a darker blue at the bottom of the frame.  I call this a gradient alpha blend, vertically.  People who actually do graphics for a living would probably disagree on my terminology, but it's good enough for this tutorial.

Here is a sample graphic that doesn't do alpha blending, but it does do a gradient blend from white to blue (left to right). I call this a horizontal gradient brush.  Hint:  If you want a solid color instead of a gradient, simply specify the same nnnStart value as the nnnEnd value.  The result will be a solid color.

As these explanations for each of the user elements continues, please refer to the above samples for an explanation of my terminology.  Here are each of the element names, a short description of what part of XtreMe PCR they're used for, and whether alpha blending is supported for that particular user interface element.

HINT:  While changing values in the .xtheme file, you can leave XtreMe PCR running.  Make your change to the file, save the change, then switch back to XtreMe PCR and press [F9].  [F9] will cause the current theme to be reloaded from disk, and it will repaint all of its windows.  Additionally, it will open up a notification window so that you can see what changes to that area of the program has made.  F9 works in both Full and Compact view modes.

 

Element Name Valid Values Alpha Transparency Supported? Comments
Name Any Text Values No A short description of your theme's name.  This information is displayed in the XtreMe PCR Theme Manager.
Comment Any Text Values No A short comment about your theme.  This information is displayed in the XtreMe PCR Theme Manager.
Author Any Text Values No The Author of this theme's name.  If you're going to plaigarize (err, borrow) something, it would be good to also put a 'based on theme by UserX' as well as your name in the Author field.
MenuBarBase #RGB No The color used by XtreMe PCR when painting the main menu and toolbar.  Note that this is the 'base' color.  XtreMe PCR will do several calculations based on the value you enter here in order to give the menu gradient and shadowing effects.  Trial and error is best with this one, I'm afraid.
MenuBarText #RGB No The color of the text on the menu bar.  Normally this is black, but a very dark menu will need something closer to white (#FFFFFF) to be readable.
MainBkgndStart #RGB No Start color for painting the main window background.  If there is no background graphic (like the "Blue Monday (XtreMe PCR Default)" scheme, this is the color that will show on the main window.
MainBkgndEnd #RGB No End color for painting the main window background.  The start and end colors get formed into a gradient brush, and will be painted either horizontally or vertically, based on the next option.
MainBkgndBrush 0 or 1 No 1 = Paint main window with MainBkgndStart value, ending with MainBkgndEnd value from top to bottom.  A value of 0 paints these colors from left to right.
MainBkgndImage File Name Graphic Dependent The main background image can be a .jpg, .gif, .bmp, or .png file.  Specify the file name here, with no drive or path information.  The graphic must be located in the XtreMe PCR\Themes folder, or it will not be located and loaded.  You should name your graphic file the same as, or similar to your theme name so that users can easily distinguish these files.
MainBkgndDrawMode Tiled, Stretched, or Normal N/A If a MainBkgndImage is specified, XtreMe PCR can paint the background with this image in three ways -- Tiled (graphic is repeated to fill the screen), Stretched (the image is stretched to fill the entire client area), and Normal (no tiling or stretching is done).  This acts very similarly to the Windows Display settings for wallpaper backgrounds.
ButtonTextActive #RGB No Color of the active 'action button's on the left of the channel listing.
ButtonTextInactive #RGB No Color of an inactive 'action button's' text on the left of the channel listing.
ButtonDoBlend 0 or 1 No 0 = leave entire button transparent.  A 1 means that the button will get an alpha overlay applied to it (this is to help make the buttons visible and readable when the background bitmap is too 'busy' for it to be seen clearly).  A good example of this is found in the standard "Shiny Happy People" theme.
ButtonBlendStart #ARGB Yes If 'ButtonDoBlend' is 1, this is the start color of the gradient that will be used to paint the button's background.
ButtonBlendEnd #ARGB Yes If 'ButtonDoBlend' is 1, this is the end color of the gradient that will be used to paint the button's background.
ButtonBlendBrush 0 or 1 No 1 = Start to End is applied from top to bottom.  0 = Start to End is applied from left to right.
ProgressFill #ARGB Yes Color used to fill the current title progress bar.
ProgressEmpty #ARGB Yes Color used to draw the empty progress bar control for the current title.
Sat1ProgressFill #ARGB Yes Color used to fill the satellite meter on the 'View Signal Status' menu item (off the Functions menu)
Sat1ProgressEmpty #ARGB Yes Color used to draw the empty progress bar control for the satellite #1 meter.
Sat2ProgressFill #ARGB Yes Color used to fill the satellite #2 meter.
Sat2ProgressEmpty #ARGB Yes Color used for empty portions of the satellite #2 meter.
TerrProgressFill #ARGB Yes Color used to fill the terrestrial signal meter
TerrProgressEmpty #ARGB Yes Color used for empty portions of the terrestrial signal meter.
ListBkgndNormal #RGB No Color used for the unsorted columns background of the full-view channel/artist/song list.  Users can sort on different columns by clicking the header for the list control.
ListBkgndSort #RGB No Color used for the current sort column background in the main list view window.
ListText #RGB No Color of the text within this window that is not highlighted.
ListTextSel #RGB No Color of the text that appears on the active row (on the highlight bar) when the application does not have focus.  Simulate this in your testing by watching the highlight bar's text color change if you click away from XtreMe PCR -- such as clicking somewhere on the Windows desktop.
ListTextSelFocus #RGB No Color of the text that appears on the active row (on the highlight bar) when the application does have focus.
ListSelbarStart #RGB No Color of the start of the highlight bar (top)
ListSelbarEnd #RGB No Color of the end of the highlight bar (bottom).  The top and bottom values are formed into a gradient brush and always go top to bottom.  You cannot make this gradient go left and right.
ListboxGridLine #RGB No Color of the grid lines that are painted between rows on the main selection list.  Note that a user can enable and disable the painting of grid lines, so if you prefer to have them off, it should be tested with this view option enabled.  If you leave this value out or blank, XtreMe PCR will calculate a grid color automatically.
NowPlayingBkgndStart #ARGB Yes The area above the main channel/artist/title list is called the Now Playing area.  Specify the beginning alpha and color value that should be used to start the gradient.
NowPlayingBkgndEnd #ARGB Yes Specifies the ending alpha and color value for the Now Playing area gradient.
NowPlayingBkgndBrush 0 or 1 N/A A value of 1 will paint the gradient, Start to End, from top to bottom.  A value of 0 will paint Start to End from left to right.
NowPlayingArtist #RGB No Color of the text in upper-left of Now Playing box (artist)
NowPlayingTitle #RGB No Color of the text in lower-left of Now Playing box (title)
NowPlayingChannel #RGB No Color of the text in upper-right of Now Playing box (channel)
NowPlayingView #RGB No Color of the text in lower-right of Now Playing box (view)
FrameLeftStart #ARGB Yes The Now Playing area has a box surrounding it, along with a divider line down the center.  This box style is repeated throughout the program (usually minus the center divider).  The bar on the View Signal Status screen, the Favorites Manager, Trash Manager, Etc.  The Framexxx colors are also used in compact view to draw frames around various items.

This is the start gradient color for the top of the left line going vertically.

FrameLeftEnd #ARGB Yes End gradient color for the bottom of the left line going vertically.
FrameRightStart #ARGB Yes Start gradient color for the top of the right line going vertically
FrameRightEnd #ARGB Yes End gradient color for the bottom of the right line going vertically
FrameTopStart #ARGB Yes Start gradient color for the left of the top line, going horizontally
FrameTopEnd #ARGB Yes End gradient color for the right of the top line, going horizontally
FrameCenterStart #ARGB Yes Start gradient color for the left of the center line, going horizontally
FrameCenterEnd #ARGB Yes End gradient color for the right of the center line, going horizontally
FrameBottomStart #ARGB Yes Start gradient color for the left of the bottom line, going horizontally
FrameBottomEnd #ARGB Yes End gradient color for the right of the bottom line, going horizontally
DialogLabel #RGB No Text colors for dialog labels -- for example, the text "Signal Status" and "Antenna Present" on the View Signal Status dialog.
DialogSubLabel #RGB No Text colors for dialog sub-labels -- for example, the text "Demodulator Lock (DEMOD)" on the View Signal Status dialog.
DialogText #RGB No Text colors for standard dialog text -- for example, the text "Yes/Unknown/No" for the Radio Activated status on the View Signal Status dialog.
DialogButtonText #RGB No Text color used for button labels, such as "Edit", "Delete", etc. on the Trash manager and Favorites manager windows.
NotifyCaptionStart #RGB No Color used to paint 'title bar' of the mini-popup notification windows.  This is the gradient start color.
NotifyCaptionEnd #RGB No End color used to paint 'title bar' of the mini-popup notification windows.
NotifyCaptionBrush 0 or 1 No 0 = Paint Start to End Horizontally, 1 = Paint Start to End vertically.
NotifyBorder #RGB No There is a one-pixel border that is drawn around the entire notification popup window.  This is that color.
NotifyBkgndStart #RGB No Start color for the background of the popup notification windows.
NotifyBkgndEnd #RGB No End color for the background of the popup notification windows.
NotifyBkgndBrush 0 or 1 No 0 = Paint Start to End Horizontally, 1 = Paint Start to End vertically.
NotifyChannelText #RGB No Text color used to display the channel name and number on the notification bar, such as "XtreMe PCR - 48 SquiZZ xL"
NotifyPlayingText #RGB No Text color used to display the current artist and title on the notification bar (the part that underlines when you hover the mouse over it).
CompactCaptionStart #RGB No Color used to fill the caption/title bar of the Compact mode player -- this is the gradient start color
CompactCaptionEnd #RGB No Color used to fill the caption/title bar of the Compact mode player -- this is the gradient end color.
CompactCaptionBrush 0 or 1 No 0 = Paint Start to End Horizontally, 1 = Paint Start to End vertically.
CompactBorder #RGB No XtreMe PCR draws a one pixel border around the entire compact mode player with the color specified here.
CompactBkgndStart #RGB No Start gradient color for the player background (Note that the won't be seen with some Themes.  If you have a graphic that covers the entire area of the compact window, these won't need to be specified.  However, if you have transparency in your image file, that transparency will allow the CompactBkgnd colors to show through.
CompactBkgndEnd #RGB No End gradient color for the compact viewer background
CompactBkgndBrush 0 or 1 No As usual, 0 = Paint Start to End Horizontally, 1 = Paint Start to End vertically.
CompactBkgndImage File Name Graphic Dependent The compact mode background image can be a .jpg, .gif, .bmp, or .png file.  Specify the file name here, with no drive or path information.  The graphic must be located in the XtreMe PCR\Themes folder, or it will not be located and loaded.  You should name your graphic file the same as, or similar to your theme name so that users can easily distinguish these files.
CompactBkndDrawMode Tiled, Stretched, or Normal N/A If a CompactBkgndImage is specified, XtreMe PCR can paint the background with this image in three ways -- Tiled (graphic is repeated to fill the screen), Stretched (the image is stretched to fill the entire client area), and Normal (no tiling or stretching is done).  This acts very similarly to the Windows Display settings for wallpaper backgrounds.
CompactPlayingBkgndStart #ARGB Yes Start color painting the compact viewer's Now Playing area (center of screen where Artist and Title are displayed)
CompactPlayingBkgndEnd #ARGB Yes End color of paint in the compact viewer's Now Playing area.
CompactPlayingBkgndBrush 0 or 1 N/A Again, 0 = Paint Start to End Horizontally, 1 = Paint Start to End vertically.
CompactPlayingText #RGB No Color used to draw the text and labels for the current Artist and Title
CompactChannelText #RGB No Color used to draw the text and labels for the current channel information (top of window)

 

That's it.  Simple, eh?  It's really not so bad if you're bored.  Grab a beer, pull up a chair, start a visualization, crank up XM, and start hacking.  On second thought, the beer may not be recommended.  You'll find yourself staring at the visualizations for hours, and you'll never get anything done!

If you would like to share your creation, I will package it up into an installation file (makes it REAL easy for users!), and put it up on the Themes download section.  If it weren't for the spam-bots, I'd post my email address here for clicking.  Instead, you'll have to settle for a cheesy graphic: