Homescreen guide for beginners

[Guest w411y]

This guide is aimed to teach beginners (maybe advanced users :) ) the general ground to creating a homescreen. For those who tend to rip out their hair and go mad.... no need for a parecetomal today Ill walk you through no problems :D ...(I hope :D )

Well heres the contents....

-Background Information About Homescreens

-Compiling an XML File

-Resource of Standard Plugins

Background Information

A homescreen is basically made up of background image/s and an XML file.

The XML file basically tells the phone where to display things on the homescreen (such as Time and Date/Message Count etc) and how (location, colour etc)

Creating an XML is pretty easy when you get the just of it and it doesn't require any expensive software. I personally use Notepad (Start - All programs - Accessories - Notepad) which is included with all PCs but you can use any text editing software of your choice.

A homescreen is made up of a layer of plugins. Ill illustrate this using images. If we look at my icon screen...

We can see the layers of plugins that make up this screen.

Plugins, as previously said, are basically layers of the screen. Each plugin is specific in what it displays (So the 'Message Count plugin' will display any new SMS/MMS/Email)

Heres a list of plugins that are included as standard with your phones....

-Iconbar - displays battery life, signal strength, gprs availability etc

-Profile - displays profile currently in use

-Message Count - displats any new messages

-Calendar - displays an upcoming appointments

-Allday - displays an allday event

-MRU - displays icons of Most Recently Used applications

Resources of these plugins can be found towards then end of this guide

-Missed Calls - displays how many missed calls you currently have

Theres also 3rd party apps which you can purchase and some are even free;

-SBSH Facade - love this plugin, displays tasks, calendar appointments and a launcher tab of programmes which is customisable. Sweet

-Smart Monitor - Can display battery % left using icons or text labels. Also shows signal strength, memory remaining, SD memory remaining, all in all this plugin is sweet too. DrBlow incorporates this well

- RJTime and SLiClock - both show the time in an animated analogue clock and also other things such as date time and carrier etc. Nice

- Fizz Traveller - Not a personal favourite but shows the weather on the homescreen. Looks nice on skins including ones by Encece

-MadBeetle AnimPlugin - Displays animations on the homescreen. A lot of nice stuff made by GPCarreon

I create the background image before the XML. This way I can fit the words into the place of the image I want. The image must be 240pixels wide and 293pixels in height to fit perfect. I personally use Adobe Photoshop. Others may use Paint Shop Pro. If you dont have either of these then this link may be worth looking into...

http://www.eecs.wsu.edu/paint.net/

Compiling the XML

From here I will split up the XML of my Icons screen and explain what each part of it does and also how it can differ. Anything you see in a code box is part of the XML and is what you type into Notepad (or your chosen text editor). Also note, the order in which the plugins are listed on the homescreen are the order they are written in on the XML. You'll get it as we go along :D

Each homescreen starts off like this ....

<?xml version="1.0"?>

<home>

The version will show when the XML has been updated. So the first time you make the homescreen it will be 1.0. Updating it will then be 1.1 for example or 2.0 .Its not vital you do this but it can be useful. Things between < and > are known as tags. Tags open and then close. So the 'home' tag opens like this and closes like this . Everything between the two tags is what makes up the homescreen. You'll be introduced to more tags as the guide progresses. We then include the following information...

<author>w411y</author>

<contacturl>http://www.w411y.com</contacturl>

<title>w411y - Icons</title>

<version>1.0</version>

Notice more tags. Between the author tag you put your name or your online status... whatever. Between the contact URL tag can go your email address or your website or any means of contacting you about the screen for problems or praise. What you type between the title tag will be displayed on your phones 'Start - Settings - Home Screen' Version tag (explained previously) Now the defaults....

<!-- Defaults -->

<default target-width="240" target-height="320" font-face="Segoe Condensed" font-size="19" font-weight="normal" padding-left="0" padding-right="0" bgcolor="transparent" fgcolor="COLOR_HOMETEXT" padding-top="0" b-border-color="COLOR_HOMERULE" b-border-width="0">

	<format state="selected" fgcolor="COLOR_HOMEHIGHLIGHTTEXT"/>

</default>

Before I continue ... anything between <!-- and --> is not read by the phone so nothing is displayed on the actual homescreen. The <!-- and --> is just a way of keeping the XML organized so if you ever need to edit something you can find it quicker. The default width is set to 240x320 (screen size of QVGA devices such as C550, C550 Qtek 8310 SP5 etc) The default font for WM5 is 'Segoe Condensed' and for WM2003 it's 'Nina' Font size is set to '19'. This means that if you do not include the font size in the plugin it will be size 19. Font weight can either be 'normal' or 'bold' Padding is how many pixels on the designated side are left blank. Its best to leave them all set to 0... it makes things easier later on. Things in the default section are not much important as the font size and colour etc are usually included in the code for the plugin. Now we continue with the background image...

<!-- Background -->

<background bgimage="Icon Background.jpg" valign="top" bgcolor="#000000" />

The background image "Icon Background.jpg" is this image ... 'valign' stands for vertical align and can be either top or bottom. As long as your background image is 240x293 you shouldn't have to worry about this. Same applies for the background colour as your image will cover the screen at 240x293. Now for the colour scheme...

<!-- Colour Scheme -->

<scheme>

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

	<color name="COLOR_WINDOWTEXT" value="#000000"/>

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

	<color name="COLOR_STATICTEXT" value="#000000"/>

	<color name="COLOR_GRAYTEXT" value="#CCCCCC"/>

	<color name="COLOR_WINDOWFRAME" value="#64C84C"/>

	<color name="COLOR_HIGHLIGHT" value="#A3A2A5"/>

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

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

	<color name="COLOR_MENUTEXT" value="#000000"/>

	<color name="COLOR_GRADLEFT" value="#AEC6DE"/>

	<color name="COLOR_GRADRIGHT" value="#AEC6DE"/>

	<color name="COLOR_INTGRADLEFT" value="#AEC6DE"/>

	<color name="COLOR_INTGRADRIGHT" value="#AEC6DE"/>

	<color name="COLOR_HIGHGRADLEFT" value="#A3A2A5"/>

	<color name="COLOR_HIGHGRADRIGHT" value="#A3A2A5"/>

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

	<color name="COLOR_TRAYGRADRIGHT" value="#AEC6DE"/>

	<color name="COLOR_TRAYTEXT" value="#000000"/>

	<color name="COLOR_BTNFACE" value="#64C84C"/>

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

	<color name="COLOR_SCROLLBAR" value="#A3A2A5"/>

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

	<color name="COLOR_alertTITLE" value="#444444"/>

	<color name="COLOR_alertRULE" value="#000000"/>

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

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

	<color name="COLOR_HOMERULE" value="#A3A2A5"/>

	<color name="COLOR_HOMEHIGHLIGHT" value="#A3A2A5"/>

	<color name="COLOR_STARTMENUTEXT" value="#000000"/>

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

</scheme>

Heres what each part stands for .... COLOR_WINDOW Background color for all application windows and controls, including the transparent portions of the scroll bar stripes. COLOR_WINDOWTEXT Text color for list views, controls, and labels. Does not set menu text color, soft key text color, or button text color. COLOR_STATIC Background color for static controls, such as labels. Also sets the background color for message boxes. COLOR_STATICTEXT Text color for static controls such as labels. COLOR_HIGHLIGHT Color of selection for list views, controls, menus, and soft key buttons. COLOR_HIGHLIGHTTEXT Color of text when an item has selection, such as a list view element or a control, and highlighted soft keys. COLOR_MENU Background color for menus. COLOR_MENUTEXT Text color for menu items. COLOR_GRAYTEXT Color for disabled text, such as disabled menu items and soft key buttons. COLOR_GRADLEFT Starting color value for the background gradient. COLOR_GRADRIGHT Ending color value for the background gradient. COLOR_INTGRADLEFT Starting color value for the secondary background gradient. COLOR_INTGRADRIGHT Ending color value for the secondary background gradient. COLOR_HIGHGRADLEFT Gradient highlights are not supported. COLOR_HIGHGRADLEFT and COLOR_HIGHGRADRIGHT must be set to the same value. COLOR_HIGHGRADRIGHT Gradient highlights are not supported. COLOR_HIGHGRADLEFT and COLOR_HIGHGRADRIGHT must be set to the same value. COLOR_TRAYGRADLEFT Starting color value for the title bar gradient. COLOR_TRAYGRADRIGHT Ending color value for the title bar gradient. COLOR_TRAYTEXT Color for the title bar text. COLOR_WINDOWFRAME Color of the dividing line between the main window and the soft key region, and the bounding rectangle around the scroll bar thumb. COLOR_BTNFACE Unselected background color for the soft key region. COLOR_BTNTEXT Unselected text color for the soft key region, navigation glyph and scroll bar thumb. COLOR_SCROLLBAR Color of the stripes on the scroll bar. COLOR_alertTITLE Color of the title text in an alert. COLOR_alertWINDOW Background color for alerts. COLOR_alertRULE Color of the dividing lines on the Home screen. COLOR_HOMERULE Color of unselected text on the Home screen. COLOR_HOMEHIGHLIGHTTEXT Color of selected text on the Home screen. COLOR_HOMEHIGHLIGHT Background color of a selected plug-in on the Home screen. This image may also help you .... By the way.. the way the colours are wrote #F456DA is known as a HEX colour code. If you have photshop you will notice the code on the bottom right of the pop up windows when selecting a new colour. However there are also websites which wil give you the codes such as .... http://hotwired.lycos.com/webmonkey/reference/color_codes/ Now we start including the plugins... First up is the Iconbar Plugin

<!-- IconBar Plugin -->

<plugin clsid="{837FC251-FE69-43ad-84E0-EBCEDEBA0884}" name="iconbar" height="0"><iconbar fgcolor="#FFFFFF"/><background bgcolor="transparent" b-border-color="COLOR_WINDOWFRAME" b-border-width="0"/></plugin>

Each plugin has its own unique clsid which is how the homescreen identifies the plugin. Its then followed by the plugins name. This is not the best plugin to explain how height works. But for the iconbar its 27 pixels in height by default. So even though height is set to 0...its taking up 27 pixels in height. So if the height was set to 20, then the plugin would take up 47pixels on the homescreen. The fgcolor is the colour of the things displayed... in this case white (#FFFFFF) The background is transparent. I prefer this as you can draw your own background to the iconbar on the image rather than have a flat colour (such as black #000000) Borders I feel look a bit scrappy so I tend to leave it as 0 but its down to you if you want one or not. Heres an image to help illustrate this... Next up we have the Date/Time/Carrier Plugin...

<!-- Date/Time/Carrier Plugin -->

<plugin clsid="{E09043DF-510E-4841-B652-388316977A7A}" name="carrier" height="78">

	<clock>

 �<time font-weight="bold" fgcolor="#000000" font-size="30" valign="top" halign="left" mode="24" y="53" x="57" />

 �<date font-weight="normal" fgcolor="#000000" font-size="19" valign="top" halign="left" mode="short" y="60" x="125" />

	</clock>

</plugin>

This plugin can display the current Date,Time and your Carrier (ie Orange, Vodafone etc) Again you see the clsid and the plugin name. The height being 54 pixels. So there is an area of 240pixels wide by 54pixels high where the date time and carrier can be displayed. The font weight can either be "bold" or "normal" fgcolor is the colour the time will be displayed so in this case its black (#000000) The font size is 30. valign stands for vertical align(either top or bottom) and halign stands for horizontal align(either left or right) mode="24" means the time will be displayed as 24 hour clock. You can set it to 12 and this will show as 3:45PM. To decide where to place the time you use x and y co-ordinates. x = the number of pixels from the left of the screen y = the number of pixels down from the top of the plugin Being as our valign is top and halign is left then the top left of the time is at 57,53 as shown in the picture below. Everything is the same for date except you'll see mode is equal to short. short is 27/11/1989 for example and long would be 27th November 1989. This picture may also help visualize how it all works..... Now we type out the Message Count Plugin....

<!-- SMS Count Plugin -->

<plugin clsid="{2F930BF0-6FE9-4a53-9E17-88E9247BAB48}" name="SMScount" height="54">

	<background>

 �<format state="selected" bgcolor="transparent"/>

	</background>

	<label y="38" x="159">

 �<format state="selected" halign="left" bgcolor="transparent" fgcolor="#000000" font-weight="bold" font-size="16" />

 �<format state="unselected" halign="left" bgcolor="transparent" fgcolor="#000000" font-weight="normal" font-size="16" />

 �<text>Email:<unreadEmail/></text>

	</label>

	<label y="38" x="59">

 �<format state="selected" halign="left" bgcolor="transparent" fgcolor="#000000" font-weight="bold" font-size="16" />

 �<format state="unselected" halign="left" bgcolor="transparent" fgcolor="#000000" font-weight="normal" font-size="16" />

 �<text>SMS:<unreadSMS/></text>

	</label>

	<label y="38" x="105">

 �<format state="selected" halign="left" bgcolor="transparent" fgcolor="#000000" font-weight="bold" font-size="16" />

 �<format state="unselected" halign="left" bgcolor="transparent" fgcolor="#000000" font-weight="normal" font-size="16" />

 �<text>M@il:<unreadMMS/></text>

	</label>

</plugin>

All pretty much straight forward, pretty much the same as the Date Time and Carrier plugin. You get the clsid, name and height. No border and then all the details for the labels (labels being what is displayed) Everything between and is what is actually displayed. The will display how many new SMS messages you have. So on the homescreen it will be seen as SMS: 0 because if you notice, inside the text tags and before the amount of new messages there is a prefeix of SMS. Another thing to note is this plugin is a selectable plugin (aswell as Profile, Calendar, Allday, MRU) This means that when you are scrolling through the layers using the joystick you can select this layer and press the joystick taking you to Messages. Unlike Date/Time/Carrier and Iconbar which is not selectable. As it is a selectable plugin then you will notice and This is a way of identifying which layer of the plugin you have just scrolled on to. There are many ways of going about this. When scrolling onto the plugin you can do one of the following... -Make the text go bold or go from bold to normal -Change the color of the text -Change the background image -Change the size of the font Its pretty straight forward, anything in the selected part is what the label will look like when scrolled on to, and anything in the unselected part is what the label will look like when the plugin is not in selection. In the above example you can see that when the plugin is in selection the font goes bold. Note/ the code for adding a background image is bgimage="path to image file" and put that in the background selected part somewhere. Heres the profile plugin.....

<!-- Profile Plugin -->

<plugin clsid="{95976968-45D5-40c9-9779-2B859B1C2FEC}" name="Profile" height="46">

	<background>

 �<format state="selected" bgcolor="transparent"/>

	</background>

	<label h="16">

 �<format state="selected" x="59" y="30" font-weight="bold" fgcolor="#000000" font-size="16"/>

 �<format state="unselected" x="59" y="30" font-weight="normal" fgcolor="#000000" font-size="16"/>

	<text>Profile:<profile/></text>

	</label>

</plugin>

Everything here is the same as the message plugin. Exactly the same layout and tags. Same applies for the next plugin, the calendar plugin.....

<!-- Profile Plugin -->

<plugin clsid="{95976968-45D5-40c9-9779-2B859B1C2FEC}" name="Profile" height="46">

	<background>

 �<format state="selected" bgcolor="transparent"/>

	</background>

	<label h="16">

 �<format state="selected" x="59" y="30" font-weight="bold" fgcolor="#000000" font-size="16"/>

 �<format state="unselected" x="59" y="30" font-weight="normal" fgcolor="#000000" font-size="16"/>

	<text>Profile:<profile/></text>

	</label>

</plugin>


<!-- Calendar Plugin -->

<plugin clsid="{865A354A-4A96-4687-B001-C155DC0DBE76}" name="calendar" height="54">

	<background>

 �<format state="selected" bgcolor="transparent"/>

	</background>

	<label w="177" h="16" x="59" y="34">

 �<format state="selected" font-weight="bold" fgcolor="#000000" font-size="16"/>

 �<format state="unselected" font-weight="normal" fgcolor="#000000" font-size="16"/>

 �<text><subject/></text>

	</label>

</plugin>

The only thing different thing with this plugin is what goes between the text tags. In this example the subject of an upcoming appointment is shown. You can alos include time and location etc as I will explain in the plugin resource later on. Now that all the plugins are listed we close the XML with this.....wait for it..... Tuh Duh

</home>

Yes ladies and gentlemen thats it :D Scroll down for a resource of plugins to use in your very own homescreens and Ill also highlight what is edittable in all of the plugins. Plugin Resource Here you will find a resource of code for all the standard plugins and what you can edit with them. Feel free to use these in your own homescreens... after all, thats what its here for :) Iconbar Plugin

<!-- IconBar Plugin -->

<plugin clsid="{837FC251-FE69-43ad-84E0-EBCEDEBA0884}" name="iconbar" height="?">

<iconbar fgcolor="#??????"/><background bgcolor="transparent" b-border-color="COLOR_WINDOWFRAME" b-border-width="?"/>

</plugin>

Choose designated height in pixels (Total height of screen is 293) fgcolor is the colour the labels are displayed as so put a HEX Colour here (eg// white #ffffff) bgcolor is the background colour of the plugin so put a HEX Colour. If set to transparent you can see background image behind plugin (which in my opinion looks best) b-border width adds a border. If 0 then no border (which in my opinion looks best) MRU Plugin

<!-- MRU Plugin -->

<plugin clsid="{79EFB752-CB70-446d-B317-499723482B3D}" name="startmru" height="??">

	<background b-border-width="?" />

	<mru icon-size="?" x="?" y="?" halign="left" valign="top" max-buttons="?" />

</plugin>

Icon Size can be set to 16 or 32 Max Buttons is the ammount of icons display (bearing in mind it must fit on the screen) Date/Time/Carrier

<!-- Carrier Plugin -->

<plugin clsid="{E09043DF-510E-4841-B652-388316977A7A}" name="carrier" height="??">

	<label bgcolor="transparent" halign="left" font-weight="normal" y="?" x="?" w="?" font-size="?" fgcolor="#??????">

		<text><carrier/></text>

	</label>

	<clock>

		<time font-weight="normal" fgcolor="#??????" font-size="??" valign="?" halign="?" mode="?" y="?" x="?" w="?"/>

		<date font-weight="normal" fgcolor="#??????" font-size="??" valign="?" halign="?" mode="?" y="?" x="?" w="?"/>

	</clock>

</plugin>

Mode in can be set to 12 or 24 .. for 24 hour or 12 hour. Mode in can be set to long or short .. for 22nd June 2006 or 22/06/06 Profile

<!-- Profile Plugin -->

<plugin clsid="{95976968-45D5-40c9-9779-2B859B1C2FEC}" name="Profile" height="?">

	<background>

		<format state="selected" bgcolor="transparent"/>

	</background>

	<label h="?">

		<format state="selected" x="?" y="?" font-weight="?" fgcolor="#??????" font-size="?"/>

		<format state="unselected" x="?" y="?" font-weight="?" fgcolor="#??????" font-size="?"/>

	<text>Profile:<profile/></text>

	</label>

</plugin>

Profile: is the prefix (There doesn'y have to be a prefix is what displays the current proffile Message Count

<!-- SMS Count Plugin -->

<plugin clsid="{2F930BF0-6FE9-4a53-9E17-88E9247BAB48}" name="SMScount" height="?">

<background b-border-width="?"/>

	<label y="?" x="?">

		<format state="selected" halign="?" bgcolor="transparent" fgcolor="#???????" font-weight="?" font-size="?" />

		<format state="unselected" halign="left" bgcolor="transparent" fgcolor="#??????" font-weight="?" font-size="?" />

		<text>Email:<unreadEmail/></text>

	</label>

	<label y="?" x="?">

		<format state="selected" halign="?" bgcolor="transparent" fgcolor="#??????" font-weight="?" font-size="?" />

		<format state="unselected" halign="?" bgcolor="transparent" fgcolor="#??????" font-weight="?" font-size="?" />

		<text>SMS:<unreadSMS/></text>

	</label>

	<label y="?" x="?">

		<format state="selected" halign="?" bgcolor="transparent" fgcolor="#??????" font-weight="?" font-size="?" />

		<format state="unselected" halign="?" bgcolor="transparent" fgcolor="#??????" font-weight="?" font-size="?" />

		<text>MMS:<unreadMMS/></text>

	</label>

</plugin>

Nothing new here Calendar

<!-- Calendar Plugin -->

<plugin clsid="{865A354A-4A96-4687-B001-C155DC0DBE76}" name="calendar" height="?">

	<background>

		<format state="selected" bgcolor="transparent"/>

	</background>

	<label w="?" h="?" x="?" y="?">

		<format state="selected" font-weight="?" fgcolor="#??????" font-size="?"/>

		<format state="unselected" font-weight="?" fgcolor="#??????" font-size="?"/>

		<text><time/> <subject/></text>

	</label>

	<label w="240" h="?" x="?" y="?">

		<format state="selected" font-weight="?" fgcolor="#??????" font-size="?"/>

		<format state="unselected" font-weight="?" fgcolor="#??????" font-size="?"/>

		<text><time/> <location/></text>

	</label>

</plugin>

As you can see that shows 2 enries from the calendar. If you want one line then only have one Between text you can put or Allday

<!-- All Day Calls Plugin -->

<plugin clsid="{2FFD93B3-0FF0-4228-A6D6-D2DF177D7D92}" name="alldayevent" height="?">

	<background>

		<format state="selected" bgcolor="transparent"/>

	</background>

	<format state="noevent" visible="?"/>

	<label h="19">

		<format state="selected" x="?" y="?" font-weight="?" fgcolor="#??????" font-size="?"/>

		<format state="unselected" x="?" y="?" font-weight="?" fgcolor="#??????" font-size="?"/>

	<text>Allday:<subject/></text>

	</label>

</plugin>

In the format state="noevent" you can set visible to true or false. Basically, if there is no event, you can chose whether it is visible on the homescreen or not Missed Calls

<!-- Missed Calls Plugin -->

<plugin clsid="{0BA8ABB8-1F1D-417f-88C6-DA8530E2E7A6}" name="missedcalls" height="?">

	<background>

		<format state="selected" bgcolor="transparent"/>

	</background>

	<format state="nocall" visible="?"/>

	<label h="?">

		<format state="selected" x="?" y="?" font-weight="?" fgcolor="#??????" font-size="?"/>

		<format state="unselected" x="?" y="?" font-weight="?" fgcolor="#??????" font-size="?"/>

	<text>Missed Calls :<calls/></text>

	</label>

</plugin>

Missed calls: is the prefix displays any missed calls Again we se the format state"noevent" visible="true or false" .. Many people use this so that when there is a missed call it takes up the whole screen Call Progress

<plugin file="sysplug.dll" clsid="{37391041-C324-4725-BEE1-3232ED3539CA}" height="?">

	<background>

	   <format state="selected" bgcolor="#??????"/>

	</background>

	<format state="nocall" visible="?"/>

	<label>

	   <text>Call in progress: <progress/></text>

</plugin>

Nothing new here. Text Plugin (Displays a static piece of text)

<plugin file="sysplug.dll" clsid="{5419F376-6520-4407-B8B8-740F5B353EDA}">

	<label bgtext="#??????">

	   <text>Hello</text>

	</label>

</plugin>

Owner Info

<plugin file="sysplug.dll" clsid="{4824B576-EFFE-45cf-BAE9-649B930CD244}" height="?">

	<background>

	   <format state="selected" bgcolor="#??????"/>

	</background>

	<label>

	   <text>?</text>

	</label>

</plugin>

Between text the following are supported ... , , , and . Kind of obvious what they will display Spacer

<!-- Spacer Plugin -->

<plugin file="sysplug.dll" clsid="{5419F376-6520-4407-B8B8-740F5B353EDA}" height="?"></plugin>

Ideal if you want to move the Iconbar down the screen a bit

..And thats it folks. You should be set to go now so no excuses :D

Wally | w411y

[Guest Monster99]

I... Love.... YOU.....!

Thank you w4lly!! :rolleyes:

Great tutorial! A+

I´m gonna make me a cool theme and upload it:) since i love bleach it will probably be a bleach one;p

Edited May 27, 2007 by Monster99

[Guest ImayT]

hi

thanks of this great post.

i want to have area info in my home screen ( this option in nokia phones named : "cell info on display")

what should i do?

[Guest SmileyBri]

Wow! What a great resource. I have been editing my home page and getting great results using this article!

One problem I am having is that on the calendar plugin I am only getting one appointment even when I have two tags. The calendar has two back to back appointments in it.

Even reverting back to the default Windows home screen there is only one. I did edit a little something in that xml though, but not near the calendar area.

Any suggestions. My code is near exactly what you have listed, but only one calendar item shows and the xml validates.

Thanks again for the article!

[Guest tinomolloy]

so for the missed calls and all day event plug ins, there is the nocall and noevent state. thats so you can hide the plugin if u dont want it to show. is there something like this for calendar and/or text? maybe noappt or nocalevent or nosms or notext. id like to be able to hide these plugins as well instead of saying no upcoming events or 0 msgs. u can email me if u want at [email protected]

thanks

Tim

[Guest unleashedvigilante]

Seriously W411y, you are the greatest man alive!

Within about five minutes of reading this tutorial, you answered a question that has been making me pull my hair out for hours.

Thanks again for your amazing homescreens and this tutorial!!!

[Guest edaw33]

Seriously W411y, you are the greatest man alive!

Within about five minutes of reading this tutorial, you answered a question that has been making me pull my hair out for hours.

Thanks again for your amazing homescreens and this tutorial!!!

question.

how do i change the highlight color of things in my tasks and on my call history? what changes that?

Edited August 4, 2007 by edaw33

[Guest beaufort]

Great tutorial. Made everything a lot clearer.

One thing I couldn't find in your tutorial is the following:

When I go to my calender and press week view. The color of the background of the bar showing the day and date i.e

m10 t11 w12 t13 f14 and the color of the font are different from the day view.

Could you tell me the colornames for these colors?

Regards,

Bert

[Guest nolageek]

Excellent tutorial, really helpful!

I have one question though that's driving me crazy. I modified the Cash theme (not sure where I got it from) and basically created several backgrounds for it. What I've noticed is that the default background (as configured in the Cash xml file) works flawlessly. However if I go through Start>Settings>Background and select another background image that I created (using the same exact dementions) the backgound is positioned directly above the bottom mru plugin. Also, the background to the mru is white, which looks horrible. I've tried setting the bgcolor to black, but that didn't seem to work. Here's an example:

Homepage using "Default" in Start>Settings>Background, displaying the images configured in the xml file:

Homepage using alternate background image as set in Start>Settings>Background. Notice how the highlighted areas no longer match up with the information.. the image is positioned from the bottom, above the mru.

Yes, I have a thing for guys in ties. ;)

Thanks!

[Guest Map0r]

I have messed around with making a very very simple homescreen for my Tmobile Dash/HTC. Basically it is the Windows Simple homescreen, but with the Iconbar at the bottom and everything transparent... My only problem is, I cannot figure out how to load the homescreen and put it to use... I have renamed the XML file to Mysimple.home.xml and inside I have changed the title as well. But the homescreen is not showing up in the loading area with all the others.

Any help would be great! This is my extreme first time ;)

[Guest Looby]

Hi, have you changed the name of your theme in the background bgimage area as well?

background bgimage="\Application Data\Home\My Simple\image.jpg" bgimag-rotated="\Application Data\Home\My Simple\image.jpg" valign="top"/> ;)

Edited November 4, 2007 by Looby

[Guest Map0r]

Awesome, thanks mucho!

It wasnt the background info that needed to be changed, but the fact that I did not know I needed to put the same file into both Windows & Application Data\Home! Thanks for the reply, Im workin it all out now.

*edit* Another question: Is there a way to get the Time and Date plugin into the Iconbar plugin????

What I am trying to do is put everything: Time, Date, Msg, VoiceMail, Battery, Signal all into one transparent plugin right above the Start/Contacts menu buttons. Also, can I make Contacts menu button link to Calendar instead?

Edited November 4, 2007 by Map0r

[Guest logkeys]

Hi there,

Great explanation how everyting works. Right now I am having a problem with putting a plugin on the bottom off the screen.

I've tried valign="bottom" and align="bottom" and margin-bottom="0". None of these seem to work.

Could any of you help me with this?

[Guest gbernard]

Hi i am using the cardwheel home screen in wm6 blackjack i600.

which file do I modify the text in to change it to something I want ?

[Guest alvin002]

great info about how it works ;)

[Guest mtg1974]

I hope this isn't a silly question. Is there a way to make a plug-in stay in a certain location? For example: I want to set the all day event plug-in to hide when there is not an event. The problem is that when it hides the MRU plug-in at the bottom moves up the screen. Is there a way to fix this?

Thanks,

Michael

[Guest dwlewisii]

Great write up. I just a have a novice question, I'm sure. How do I write it so that the plugin I select is not colored? That is, I just want it to be transparent? I'm so close to getting it!

this is the plugin I want to change:

state="selected" bgcolor="transparent" />

state="selected" bgcolor="transparent" />

state="selected" bgcolor="transparent" />

state="selected" bgcolor="transparent" />

Edited December 12, 2007 by dwlewisii

[Guest SofQ]

I hope this isn't a silly question. Is there a way to make a plug-in stay in a certain location? For example: I want to set the all day event plug-in to hide when there is not an event. The problem is that when it hides the MRU plug-in at the bottom moves up the screen. Is there a way to fix this?

Thanks,

Michael

Me thinks if you set this in the 'All-day plugin' below:

Also not sure if you should set autoheight="FALSE" ... note: same line as the

[Guest eclipse]

PLEASE does anybody know how do i change the color of alert screen text? Not header color, but the color of the message. I'm trying to create dark gray theme, everythings fine, but black text on dark background is absolutely unreadable.

PS: wm2003

[Guest mtg1974]

Me thinks if you set this in the 'All-day plugin' below:

Also not sure if you should set autoheight="FALSE" ... note: same line as the

[Guest Cabana]

Is there a way to force plugins to go to the bottom of the screen, like a valign for the whole thing? I can't set exact positions because of some plugins that disappear when there is no event.

[Guest Cyprine]

Looks like most of the info here is also available on the Microsoft Developer Network:

http://msdn2.microsoft.com/en-us/library/ms839391.aspx

The article on the MSDN site refers to Microsoft Smartphone 2002 but I guess it applies to later versions as well. There is some additional info on there also that could be applicable.

I have been able to change colors & do some minor changes on my home screen layout to suit my purposes with this tutorial but there is still one thing that really bothers me and I can't figure out or find anyone else wanting to change this. How the heck do I change the background color of the bar that says Smartphone when I press the CALL button? (I am using a Rogers-branded HTC S621/Dash/Excalibur). It's the only thing that doesn't match everything else now!!!

I'll try to take a picture at home tonight...

This guide is aimed to teach beginners (maybe advanced users :) ) the general ground to creating a homescreen. For those who tend to rip out their hair and go mad.... no need for a parecetomal today Ill walk you through no problems :D ...(I hope :D )

Well heres the contents....

[Guest]

Is there a way to get the menu buttons on your homescreen (start and contacts) to be transparent? I'm using a VOX

[Guest behole]

i have gone through this tutorial and it has been very helpful. but, i want to make a homescreen that is diffrent than most and i cannot really figure out how to do it or if its possible. any help would be greatly appreciated.

the homescreen i want is very simple but again may be hard to code or not possible.

i have a dash so its 320 by 240

i want a white back ground, white icon bar with black text, white "start/menu" bar with black text, both in their standard spots (top and bottom).

next i want three icons that i have designed to take up the screen and link to certain things

a "phone" icon to link to call log

a "message" icon to link to sms, mms

a "calendar" icon to link to the calendar.

simple as that.

is this possible and if so can someone help me with coding it?

thanks in advance

josh

after i think about it...it may be sort of a disembodied iphone esque set up but with 3 icons only and big like the attach image

Edited May 6, 2008 by behole

[Guest Bluest Hue]

Excellent thread. I did want to know if there is a way to give the MRU a background image or if I have to apply a bg image to the whole background and position it on top. I have a bg image behind my iconbar and I'm looking to do something similar for the MRU.