Home | Information

 

Motorola Q Color Scheme Tutorial

Here is a tutorial for making your own color schemes. It's pretty simple, and with some color mix and matching you'll have exactly what you want. Enjoy!

Rotation Placeholder www.rhstevenson.com

The code

So i'm going to start off with some sample code and go down and say what means what to make your job easier.

<colorscheme>
<author>YourName</author>
<title lang="0x0409">YourTheme</title>
<title lang="0x0809">YourTheme</title>
<title lang="0x040c">YourTheme</title>
<title lang="0x0407">YourTheme</title>
<title lang="0x0410">YourTheme</title>
<title lang="0x0816">YourTheme</title>
<title lang="0x040a">YourTheme</title>
<title lang="0x0804">YourTheme</title>
<background bgimage="YourTheme.jpg" valign="bottom" />
<scheme>
<color name="COLOR_TRAYGRADLEFT" value="#006600" />
<color name="COLOR_HOMEHIGHLIGHT" value="#00CC00" />
<color name="COLOR_HOMEHIGHLIGHTTEXT" value="#FFFFFF"/>
<color name="COLOR_HOMETEXT" value="#FFFFFF"/>
</scheme>
</colorscheme>

So to begin with you can do this sort of thing with Notepad or a basic text editor; I use Dreamweaver, either way you'll get the job done. Under the <author> tag you just put your name or nothing if you don't care; it won't show up anywhere

Under <title lang> Each one of those is what your title is in a different language, if you care. It doesn't really matter, i just copy and paste the same thing into each spot.

under <background bimage> you want that to be the background (320x240) image of your choice. It's important to put this name in here otherwise you'll have a colored bar at the top of the screen instead of the background going all the way up.

Now on to the colors!

Four different places to edit your colors, and i'll go through each one separately.

<color name="COLOR_TRAYGRADLEFT" value="#006600" />

This is what color you want your start menu tray to be. Pick a good color, because it is also the color you will be seeing for borders and what highlights your contacts and messaging! The OS uses that color to different degrees and shades throughout, for example the scroll bar on the left will be a lighter shade of the color you picked...

<color name="COLOR_HOMEHIGHLIGHT" value="#00CC00" />

This is the 'highlight' color, which will be the background color when you roll over icons as well as select things on your home screen.

<color name="COLOR_HOMEHIGHLIGHTTEXT" value="#FFFFFF"/>

This is the color of highlighted text. When you roll over a selection on your home screen the text under it will change color. So just like the tag says, it's the home screen highlight text!

<color name="COLOR_HOMETEXT" value="#FFFFFF"/>

finally pretty explanatory, HomeText is what color you want all your text to be (except the highlighted of course) You'll probably end up using white or black because they go the best with most backgrounds.

Final Steps

Save your code as YourTheme.scheme.xml and you should have your own customized scheme!

You'll want to test your scheme out a couple of times before it's exactly what you want, so after you've put it on your Q in the directory \Application Data\Home you can access it through the Home Screen option under settings. Scroll through the color schemes and yours should be named whatever you called it under the <title> tag. Load it up and see if you like it! One thing to remember is that you have to unload your theme before you copy a new version of it over. So if you have YourTheme loaded, go into the settings and select another color theme, load it, and then copy over the new version of YourTheme, otherwise it won't recognize it.

Finally you have to remember that the Home Screen color scheme will overwrite yours if you have color scheme left to default. If you're making a home screen that's another tutorial, but you can set the colors in there too, this is just the easy way of doing it without getting too complicated. One more note about the background image. Should there STILL be a colored bar at the top of your home screen and NOT a full background, you have to go into the Home Screen XML and set the background image to be named the same as the one you want.

Hopefully i've helped some of you out! Thanks for your interest!