This was from the windows mobile team blog. More to follow but wanted to post it for those who don't read that.
Original link: http://blogs.msdn.com/windowsmobile/archive/2008/06/03/customizing-the-sliding-panel-homescreen.aspx
Customizing the Sliding Panel Homescreen
from Windows Mobile Team Blog by Jorge Peraza
Hi, my name is Jorge Peraza; I am a Developer on the Windows Mobile team that was responsible for the new “Sliding Panel” home screen in Windows Mobile 6.1.
When we were working on the visual style and functionality of the home screen we tried to make something that looked both professional and appealing while still showcasing all the information the user is going to need to know what’s important and requires attention. While I think the default design looks really cool, we added some customization features to enable users to make it their own.
Customizing the layout
The home screen layout can be modified using the same home.xml file from previous versions of WM, the schema of the file was extended to allow the customization of many of its elements, this includes the art assets that are used for most of the plug-ins.
When you open the SlidingPanel.home.xml file (inside \ApplicationData\Home) you will find the plug-in element that corresponds to the sliding panel home screen (its CLSID is {E9267CAB-02EE-4f37-8216-6BF6A8FF5A71}). All the child elements inside it are designed to tweak and customize the way the home screen will look.
The top level element is the plugins tag, this has one attribute called “Order” and it’s used to list the plug-ins that will be shown and the order they are going to be laid out on the screen.
The built in plug-in names are:
1)CClock – The big clock
2)CAppointments - The calendar plugin
3)CHome – The notifications plugin
4)CMyPhotos – The photos plugin
5)CMessage – The message center (this is off by default on all sliding panel built in layouts.
6)CMusic – The music plugin
7)Settings – The settings plug-in
8)Custom Plugin – Users can specify custom plug-ins with static content that can be displayed on the home screen.
For example, the XML snippet bellow moves the photos plug-in to the first position and enables the message center (which is turned off by default on both "Sliding Panel" and "Sliding Panel Media")
<plugin clsid="{E9267CAB-02EE-4f37-8216-6BF6A8FF5A71}" name="Bronze" height="266">
<Plugins Order="CMyPhotos;CClock;CMessage" />
</plugin>
There are many other ways of customizing the home screen using the plug-in settings like overriding the default images or even adding your own custom plug-ins that display static content, I'll post and updated entry latter on on how to do this in detail but for now, you can use the provided home.xml files to start experimenting with this.
The notifications plug-in and message center
In the sliding panel home screen, the notifications plug-in by default serves as a dual-purpose notifications/gateway to all you phone/message accounts where every page represents one account (so, if you have multiple notifications in one category they will be shown as one summary page).
There is however an alternative behavior where individual notifications are added as independent pages (Similar to what the T-Mobile shadow home screen does) and the plug-in only shows accounts that have new notifications in them. One cool feature of this alternate behavior is that each individual notification can be dismissed without having to leave the home screen.
You can enable this alternative behavior by setting the following registry key to a value other than 2 (The actual value indicates how many pages of each notification type will be added to the home screen before collapsing them into a summary page. We have tested 2 and 5 but feel free to experiment with other values)
[HKLM\Software\Microsoft\Chome\Chome]
PageCollapseThreshold: DWORD
Note that this prevents you from being able to access the email/phone account data if there are no notifications for it. If you still want to be able to do that you can always re-enable the message center as described in the previous section as a separate plug-in.
There is one more behavioral change you can make that allows you to “dock” the condensed view of the first plug-in to the top of the screen when it is not active, we added this for people like me that want to have the clock always visible. To enable just set the following registry key to “1”
[HKLM\Software\Microsoft\Chome]
DockOperatorBar: DWORD
Advanced layout modification
There are even more advanced things you can do to further tweak the look of the home screen but it is unsupported by Microsoft at this moment so you’ll have to experiment on your own J (Hint, look at the following files \windows\CHome_240x320.cpr and \windows\CHome_320x240.cpr).
----------------------------------------------------------------------------------------------------
Thanks to djNutz for posting this information & OrganicM for his efforts.
I wanted to create a post with info about what the different keys do in the CHome section of the registry. So, I'll start with a brand new one, that I bet nobody knows about....
[HKLM\Software\Microsoft\Chome\Chome]
PageCollapseThreshold: 2 or 5 (DWORD Value)
This will collapse your Notifications panel to only show active notifications. You can enable this alternative behavior by setting the following registry key to a value other than 2 (The actual value indicates how many pages of each notification type will be added to the home screen before collapsing them into a summary page. 2 and 5 were tested and work pretty well.
More to come of course....
should this change be made to the security section too, or does that matter? actually, do changes to the security section ever matter, cause they seem to apply even when you only edit the software section.
p.s.
i'm pretty sure people are gonna ask, so maybe i'll save some trouble instead of looking like an ass by answering preemptively. This DWORD value must be created with your registry editor, it's not already there, at least on ricky v24.
2 = default or normal (i assume cause it looks the same as before) and 5 = condensed.
But for the rest of us who don't have the time to be on every WM blog and forum at once here's my favorite:
To “dock” the condensed view of the first plug-in to the top of the screen when it is not active, set the following registry key to “1”
[HKLM\Software\Microsoft\Chome]
DockOperatorBar: DWORD
This is so you can have the clock always visible, no matter which panel you're on. You could also set it so that CHome Weather's compact view is always on top. Whatever plugin is first on the list.
More info from MS coming down the pipe:
We can get the day of the week on the clock plugin at the top of CHome by doing this:
Replace this portion...
<!-- Date --> <Text ID="Date" Left="180" Top="83" Width="110" Height="19" FontFamily="Segoe Condensed" FontSize="9" FontStyle="Bold" Wrap="False" HorizontalAlignment="Left" Trimming="EllipsisCharacter"></Text>
With this!
<!-- Date -->
<Text ID="Date" Left="180" Top="83" Width="110" Height="19" FontFamily="Segoe Condensed" FontSize="9" FontStyle="Bold" Wrap="False" HorizontalAlignment="Left" Trimming="EllipsisCharacter"></Text>
<Text ID="Day of Week" Left="65" Top="83" Width="110" Height="19" FontFamily="Segoe Condensed" FontSize="9" FontStyle="Bold" Wrap="False" HorizontalAlignment="Right" Trimming="EllipsisCharacter"></Text>
I will incorporate this in Chome Weather fore sure!
Here you go, the first is my Home
2nd is Scroll Down once
3rd is Scroll Down twice
4th is Scroll Down Thrice
heh
Edit: Tried Month in cpr, no luck.
will keep trying
I'm glad people are finally getting this information out. It makes customization that much easier. I'm adding the tips to the wiki as well, as they come out.
How to Reload the Homescreen
I have two questions:
1. After editing my CHome cpr file, how do I reload the homescreen without having to reboot the device?
2. How can I show any text on the clock panel? Regular text is defined by Text ID = "xxxxx", where xxxxx is something like Time, Network Name, etc. However, suppose I want to have the text "Knowledge Rules", how do I set it up in XML?
I have very little programming and Excalibur experience. So, I apologize if these questions are too naive or have been answered before.
Thanks a lot in advance.
you can use this if you dont use OrganicM Chome Weather
I don't think Microsoft has put out much documentation on the sliding panels plugin yet. Most of the CHome configurations use
Code:
TextID="text 1"
as the delimiter for static text. But that's not to say that the clock plugin will recognize that as a valid section. Could work. Could make your phone useless.
beartard said:
I don't think Microsoft has put out much documentation on the sliding panels plugin yet. Most of the CHome configurations use
Code:
TextID="text 1"
as the delimiter for static text. But that's not to say that the clock plugin will recognize that as a valid section. Could work. Could make your phone useless.
Click to expand...
Click to collapse
I do not understand. How do I make the phone know that:
text 1 = Knowledge Rules?
Typical syntax seems to be Text ID = "xxxx", where xxxx is a variable name, which is recognized by the device. If Text 1 is a valid variable for the device, how do I assign it a value? Am I rambling here?
No, you're not rambling. As far as the information coming from Microsoft and disseminated here on this site goes, it's a best guess right now.
someone at msdn blog asked the same question.
Someone at msdn blog asked the same question. Let's wait to see if we get an answer from there...
From http://blogs.msdn.com/windowsmobile...ustomizing-the-sliding-panel-homescreen.aspx:
"Jorgeba, thanks for taking the time to educate your user. I have some questions.
How do you change the text in the condense clock? The .cpr file has Text ID="Text 1". How is "Text 1" define? I would love to add the date to the condense layout.
The ActionURL and Softkey2 URL in the Appointments plug-in always open calendar in the today view. Is there a way to make one of the button opens calendar in the month view? Setting the default view for calendar does not help."
Easy as pie......
If you know what you are doing.
If you have any xml experience,then you'll know how to adjust x and y values to position things in different places. Yes, you can do that. Just change x=whatever and y=whatever to where you would like them to be. Just know this means that it will start on the left and move x pixels over and y pixels down. If you put in negative values, it will shift them in the opposite direction.
Eg. x=-whatever will move it to the left vs a + value which will move it to the right. Same for y=
Also, you can adjust the valignment and halignment to center, left, or right.
Have fun with these. They apply to everything in your cpr (That's the layout for your homescreen.It's in your \Windows directory on your phone).I mean everything, from where your network displays, right down to your pictures.
That's it. Have fun!
jaymit said:
Hi,
Sorry Im kind of a newbie :s, is it possible to edit home screen panels? I wanted to change the layout and look of the clock plugin.
Thanks!
Click to expand...
Click to collapse
Does anybody know how to change font color for certain panels or certain lines of text in the panel? Is it only possible for the whole homescreen?
As far as I know even as far as old xml coding works, you can only change a font color for a selected word or unselected word. Meaning, if you have the old 6.0 your plugins that are selected could have a different color, but unselected could be another color. This applied to the entire homescreen. I have not seen different colors for different plugins, since each panel style is basically its own plugin (each has its own unique GUID), then I doubt you can change font color for each plugin. You can more than likely only change the active selected panel and inactive panel fonts. I am not sure what their titles are in the cpr, but I know that in the old 6.0, the homecolor was one of the fonts colors and the other was called something else.
Eventhough this is 6.1, it doesn't look like much has changed as far as the fonts color goes. You could, however, always try adding a "fontcolor=" command in the cpr and a hex code and try it, to see if it works.
Hope this helps.
Edit your registry or get CHome Config
Both do the same thing. You want to change the plugin order for CHome. It's located in HKLM\Security\CHome\Default Settings and in HKLM\SOFTWARE\Microsoft\CHome. Edit the order you want your plugins to go. Reboot your phone and the new edits should be reflected in your homescreen layout. If you are having trouble cause this is new. Just search this thread for CHome Configurator. It's stickied at the top of this forum. Download it and it will let you select the order in a much easier way. Make sure you reboot, though, or else your changes won't show. Hope this fixes your problem. Later.
tae-xda said:
How to change the default location for where the CMyPhotos plugin
Click to expand...
Click to collapse
rollingondubs1 said:
I have that already, All my games are under a folder which i cant make it as a action url
Click to expand...
Click to collapse
try this
"ACTIONURL" = "\Windows\Start Menu\Games\xxxxx xxxx.lnk
or this
"ACTIONURL" = "\windows\fexplore.exe; \windows\start menu\games"
Yes you can
One last time, I think I've figured out how to help you.
1. Open Chome Config.
2. Scroll to MyApplication and select it with your center button.
3. Scroll to any page you want to edit. Then scroll down to where it says ActionURL. Press menu.
4. Once in the menu select the "1 Change URL" item.
5. Once you have selected that it will take you to a file explorer. Go to \Windows\Start Menu\Games. This is where your games should be. If not, then wherever you store, your games, navigate yourself to that folder and select the file you want.
I think this should cover it. Hope this solved your problem. HOLLA!!!!
rollingondubs1 said:
I have that already, All my games are under a folder which i cant make it as a action url
Click to expand...
Click to collapse
How to change the location of CMyPhoto to \Storage Card\My Documents\My Picturs
Hi guys,
HTC uses Lua (opensoure programming language) to implement thinks like contacts, weather, etc. to each tab of touchflo3d.
I tried to decompile those scripts with LuaDC and LuaDEC but both decompilers won't work with the htc-files.
Then I tried to code my own script. Just printing 'hello world'.... and I add it to the home-tab like this:
Code:
<Page Order="0" Name="home.page" PackageName="HTC" Default="true" Title="[[IDS_HOMETITLE]]" [B]ExternalScriptPath="myfile.luac"[/B]>
<ComponentReference Name="page" Mode9Path="HTC\home.mode9?testParam=1" Component="GizmoRoot" SmartComponent="true" />
<ComponentReference Name="icon_normal" Mode9Path="HTC\icons.mode9" Component="Home_Off" />
<ComponentReference Name="icon_selected" Mode9Path="HTC\icons.mode9" Component="Home_On" />
<ComponentReference Name="icon_preview" Mode9Path="HTC\icons.mode9" Component="Home_Preview" />
</Page>
But after this, manila won't start.
So we have to figure out, how the script files have to look like!
If we got it, then we are able to add own tabs with own functionality to manila like today-plugins for windows mobile!
Try a simpler approach.
Start with just adding a empty tab.
No, that is not so import...
Status
Hi!
i'm really interested in adding own tabs! So have you been able to get one step further?
regards
I too am interested in being able to have tabs added, I personally would like a calendar tab.
Nighthawk said:
I too am interested in being able to have tabs added, I personally would like a calendar tab.
Click to expand...
Click to collapse
meanwhile you can use second today + spb diary
I would love to change the Music tab to launch Slide2Play instead of the standard music ap. Any one have any ideas?
Jules
Did you guys find a solution to these issues?
Adding tabs
Changing the functionality of an existing tab
Thanks.
hom edit my png files and ad my windows folder so it works?
Same to mee.I want change in my touchflo 3d,,,bu pictures are somekind of nuber filef hom edit my png files and ad my windows folder so it works?????
CPR File Editing For the HTC Excalibur/S620/T-Mobile Dash
In this tutorial, you will learn how to safely, and effectively, modify the HomeScreen CPR File on your phone.
This tutorial will be based off of the Windows Mobile 6.5 Titanium_320x240.CPR file (found in Ookba's 3VO 2.8 ROM)
First off, make a backup of your current .CPR file (located in /Windows) to a separate folder, or duplicate it. This is in case something goes wrong. (Do the same for the .home.xml file located in /Application Data/Home)
[Pre-Tutorial] - A Couple of Handy Apps
(This is updated as recommendations come by)
1)Free XML Editor - Here - hewhoisnotasothers
2)Notepad++ - Here - Me
[Tutorial Part 1] - Intro to the CPR file.
The Windows Mobile CPR file is located in the /Windows folder on your phone. This file controls the positioning, sizing, and some effects applied to text and image objects present on the Today Screen. While its extension is CPR, it can be opened by any text editor, and edited like any XML. After editing the CPR (and placing it in the /Windows folder) you must run a program (included in Ookba's ROM's and which can be found by searching) called TitaniumRefresh which reloads the Today Screen. This tutorial assumes you know the basics of the XML language, so if you do not, it is recommended you visit this link.
[Tutorial Part 2] - A First Look: Opening and Analyzing
To open the CPR file, I use Notepad++ (which can be found here). Alternatively, you can use Notepad or any other text editor. After opening the file, we see it starts with <form>, like any XML will. Scroll down a couple lines, and look at the first chunk of code.<Image ID="Background" Opacity="1.0" Top="-54" Width="320" Height="240" Source="ConfettiPlus::WallpaperBitmap"/>
<Layer ID="StaticHomeArea" Visible="False" />
Let us break this down. First off, I colored Image and Layer RED. For the rest of the tutorial, I will refer to these RED colored texts as "tags" (as they are referred to in XML). The Image tag, much like HTML, will create an image on the Today Screen. The Layer tag will tell the Today Screen to move UP a layer and start putting newly inserted objects ABOVE all previously created objects. In this case, anything declared after this snippet of code will be put over the "Background" Image.
The text in DARK BLUE will be referred to as "ID's" (coming straight from their name). ID's will be covered later on, but basically they interact with either the Registry or the files used to create a panel. These are essential to any CPR file.
The text in LIGHT BLUE will be referred to as "parameters" (because they define specific details about the tags). Look at the Image tag. The use of the parameter is to tell the Today Screen exactly what to do. Without the Width or Height parameters, how would your phone know how big to make the image? Most parameters are self-explanatory because of their names, but as I see that some may become confusing, I will point them out. For instance, "Top". The function of Top, in any case, is to define how far from the top of the defined layer the object should be placed.
[Tutorial Part 3] - The .home.xml file
Before getting any deeper into the CPR file, lets see some background on it. How does the Today Screen know which panels to place where, and what the Background is? After all, the image tag for background had some gibberish about Confetti!
Now then, go to /Application Data/Home/ and pick out any .home.xml file with the name Titanium. (I will be using my own slightly modified Horizon.home.xml file from my Horizon Skin). Just like the CPR file, open this up with a text editor. Notice the first couple of lines just talk about who made the theme, and where it is located. We can ignore that for now, as it is not essential. Look now at this snippet of code:
<default target-width="240" target-height="320" font-face="Segoe Condensed" font-size="19" font-weight="bold" padding-left="5" padding-right="5" bgcolor="transparent" fgcolor="COLOR_HOMETEXT" padding-top="3" b-border-color="COLOR_HOMERULE" b-border-width="0">
<format state="selected" fgcolor="COLOR_HOMEHIGHLIGHTTEXT" />
</default>
The default tag is describing to the Today Screen what the default screen orientation is. It is telling it to have a width of 240 pixels and a height of 320 pixels. It is telling it to set the default font to Segoe Condensed, size to 19, weight/style to bold. It is also telling it to leave some space on the top/bottom and sides of the screen (5 pixels) so that you don't get objects cut off by the edge of the screen. It is telling it to have no background color and the Foreground color is defined later on by a variable COLOR_HOMETEXT. Same principles go for the format tag.
Move on to the next snippet of code:<background bgimage="\Program Files\Horizon\BGIMG.jpg" bgimage-rotated="\Program Files\Horizon\BGIMG.jpg" valign="bottom" bgcolor="COLOR_TRAYGRADLEFT" />
Just from the tag, you can see how this is related to the background tag in the CPR file. So all that confetti jargon is really just telling it to look here (for the initial setup that is. The value in the registry is changed when the background is changed). So this tag is telling the Today Screen to set the image at "\Program Files\Horizon\BGIMG.jpg" as the default background. Since there is currently no way (as far as I know) to change the screen orientation, the bgimage-rotated is the same as the bgimage. "valign", which should sound familiar, is set to the bottom, and bgcolor is set to the variable COLOR_TRAYGRADLEFT.
So what are these variables exactly? Lets see:<scheme>
<color name="COLOR_TRAYGRADLEFT" value="#000000" />
<color name="COLOR_HOMEHIGHLIGHT" value="#4683af" />
<color name="COLOR_HOMEHIGHLIGHTTEXT" value="#C0C0C0" />
<color name="COLOR_HOMETEXT" value="#FFFFFF" />
<color name="COLOR_HOMERULE" value="#4683af" />
<color name="COLOR_HIGHLIGHT" value="#4683af" />
</scheme>
Scheme, which is not an evil plot in this case, refers to the color presets for the phone's theme. Those variables I mentioned earlier are defined here. The value (which is the color value) is written in HEX-HTML code. It goes from 00 - FF, where F is the greatest, 0 the least, and is written in 2's. so COLOR_TRAYGRADLEFT has 00, which is 0 RED, 00, which is 0 GREEN, and 00, which is 0 BLUE. These aren't too important unless you are doing a whole theme makeover for your phone.
Below that you may have a plugin tag with the "name" parameter equal to iconbar. You won't deal with that much. So look at the next plugin tag, which is titled "name = Bronze". Lets look at that:<plugin clsid="{E9267CAB-02EE-4f37-8216-6BF6A8FF5A71}" name="Bronze" height="266">
<Plugins Order="CMyPhotos;CMusic;CLinks;CLauncher;CComm;Settings;TitaniumWeather;CClock;CHome;CAppointments;CPhone;CText;CMessage;CEmail;CVoicemail;CWindowsLive" CPRFileName="Horizon" />
</plugin>
This is the big one. Here you can see, from the plugin tag, that the Plugins (or more commonly called Panels) are given 266 pixels of space on the homescreen. Below that is the Plugins tag, which very nicely tells us what the order, from top to bottom, is for the Panels. This is how the Today Screen knows how to put what where! Notice that the parameter "CPRFileName = "Horizon"" in the example. This changes depending on the CPR being used. This gives users the choice to run either their own theme or the default theme provided without having to delete any other CPR files.
[[CONTINUED IN NEXT POST]]
Tutorial Continued
[Tutorial Part 4] - Venturing On: Digging Deeper into the CPR File
[Tutorial Part 4.1] - Looking at more of the essentials
Go back to the CPR file you had opened for [Tutorial Part 2]. Let us start off by looking at a snippet of code below what we analyzed earlier. This is what I refer to :<TitaniumListView ID="HomeNav" Width="320" Height="185" Columns="1" Rows="5" ItemWidth="320" ItemHeight="34">
<Layer ID="Focus" Width="320" Height="67" Clip="False">
<Image ID="Image Default" Left="0" Top="-6" Width="320" Height="82" ScalingAlgorithm="TriLinear" Opacity="1.0" />
<ControlSequence ID="Action Sequence" FramesPerSecond="30" Loop="False">
<Image ID="Image" Left="0" Top="0" Width="320" Height="67" ScalingAlgorithm = "TriLinear" Opacity="1.0" />
</ControlSequence>
</Layer>
<Layer ID="ListItem" Visible="False" />
<Layer ID="No Items" Opacity="0">
<Text ID="Text" Width="100" Height="19" FontFamily="Segoe Condensed" FontSize="8" FontStyle="Bold" Wrap="False" Trimming="EllipsisCharacter">No Items</Text>
</Layer>
</TitaniumListView>This is quite a large snippet, and may look confusing, but in reality it does just the very basic functions of setting up the Today Screen. To start off, a new tag is called "TitaniumListView." In older roms, this is named "BronzeListView." The Titanium part makes it so that the middle panel (CClock on default set-ups) is centered on the screen in default position. So in this CPR, the Today Screen Panels are given 320 pixels across (the full screen width) and only 185 pixels top-to-bottom to fit into. These values can be changed, but be warned that they will change most everything. The effect of changing the screen size will be discussed in greater detail later on when I go over specific object positioning.
The first tag under "TitaniumListView" is "Layer", which, as mentioned earlier, is creating a new layer for objects ontop of everything prior. This layer is titled "Focus" and it is a vague name, but think of the Today Screen. You have the main panel and the semi-hidden panels, so the MAIN one must be the FOCUSED one. Now that that is understood, let us see what it is saying. It is defining the DEFAULT width and height for a Focused panel. The parameter "Clip = False" is just saying that 'if an image/text goes out of the boundaries assigned, do not omit it from rendering, render it on top of layers before it anyway'. So usually that is a good thing, since nobody wants half an image or part of their text to be cut off randomly.
Next up, it is describing an image that is being loaded to be rendered onto the screen. The location of this image is found in the registry, which will be discussed with greater detail later on.
This is obviously clean code, since everything opens and closes correctly. It isn't recommended to tinker with these values too much unless you have a backup and are willing to get some funky results.
Moving on...
Below this snippet, you see comments about NPI and MPI. What the heck is a NPI? Well, the NPI is actually the arrows you see when on a multi-page panel. Feel free to reposition them to your liking. As far as the MPI, I will be honest, I do not entirely know what it is. I have changed its values and have yet to have results, but fear not, I am venturing!
Moving on...
Below this snippet, you may see a Branding Comment. This is just a Text tag which writes to the screen at the given coordinates a "branding" message to show people who made the CPR or ROM. For the sake of being nice and not stealing, leave this alone (unless you make a custom CPR).
Moving on...
[Tutorial Part 4.2] - Looking at the CClock Panel
Finally! You get to see the code behind the most well-known panel out there, the CClock Panel! So lets take it slow and savor the joy:<Layer ID="ClockExpanded" Visible="False" Width="320" Height="82" Clip="False">
<Layer ID="Page" Clip="False">In just these two lines of code, the Today Screen is instructed to do many things. It is told to make a new Panel called "ClockExpanded" (which goes back to Focus) with a width of 320 and a height of 82, and to be nice, clip is set to false. But wait, How does it know where to put the panel?!?! Well remember about the TitaniumListView VS BronzeListView ... well in Titanium it is centerbased, in Bronze it is top based! (Ohhhh!)
But wait! It says Visible is false? How do I see it?! Well, as far as I know from the tinkering I have done, that is like a Switch. The default is set to false for every panel to avoid issues, however when the Today Screen is shifting panels, it will flip these switches. So I wouldn't concern myself with this too much.
Next up, it is creating a Layer , within a Layer. This is just to make sure that objects created from then on are put to the "top" of the screen, visible to everyone.
Moving on...<Image ID="ImageFixed" Source="\Program Files\TitaniumWeather\condicons\CurrentIcon.png" Left="205" Top="-30" Width="120" Height="100" />Okay, this looks simple enough... For starters, the CPR file is telling the Today Screen to create an image called ImageFixed at (205, -30) ... wait ... -30? Well look closer. The parameter says "Top="-30"", and I mentioned earlier that Top refers to position from the top of the layer. And since this layer is located in the middle of the screen and is only 80~ pixels tall, without clipping, we can place images anywhere! Have fun, try changing this value and see what happens! Continuing on, the image is given the size of 120 x 100.
You now know how the Image on the 'top' right of the CClock panel got there!<Image ID="ImageFixed" Source="\Windows\carrier.png" Left="-3" Top="3" Width="30" Height="15" ScaleStyle="Fit"/>
<Text ID="Network Name" Left="22" Top="3" Width="100" Height="18" FontFamily="Segoe Condensed" FontSize="7" FontStyle="Regular" Wrap="False" VerticalAlignment="Top" Trimming="EllipsisCharacter" HorizontalAlignment="Left">
<TextStage TextOffsetType="TextOffsetDropBottomRight" Color="#00000000" TextOffset="1" BlurFactor="3" Alpha="1.0"/>
<TextStage TextOffsetType="TextOffsetNone" Color="#FFFFFFFF"/>
</Text>Let us analyze! This snippet starts off with creating another Image called ImageFixed whose source is a carrier.png. Luckily, the creator of this CPR was nice and made things easy to comprehend. Obviously this is making the little "bars" and Operator text on the panel. Now that we know what it is, lets see how it comes to be. (Which takes up to the next part of the tutorial.)
[Tutorial Part 4.2.1] - The ID 'parameter' and How it is Helpful!
Looking at the Text tag, one thing comes to mind...I know what the result is, but where on earth is it getting this data from! Well I have been mentioning the registry a lot and saying I will explain later, well...I am not going to fully explain now since this is just the basics!, but I will do a brief fill-in on the topic. In the registry is a Key set up to let this panel operate. Inside of it are values that tell the Today Screen what to make the SoftKeys do, what the text should be, image sources, etc. But how does it all get accessed? Well the ID is also like a variable! The ID (in many cases) is compared to the Registry Key for the panel, and the resulting output is what is located in the registry under that ID name (for that reason, making two ID's the same name is dangerous!).
[[CONTINUED IN NEXT POST]]
Tutorial Continued
[Tutorial Part 4.2.1.1] - A Good Example of ID usage!
Let us look at my custom 'Horizon' Skin. A nice feature I added in was a CComm (Communications) Panel that allowed you to see ALL the connection status's at the same time. In order to do this I had to edit a file related to the CComm panel and tell it to add more registry entries when doing what it needed to do. Even though any of you could install my custom theme (hint hint), I will just put the code here.<Image ID="icon1" Left="40" Top="25" Width="90" Height="115" ScaleStyle="Stretch" />
<Image ID="icon2" Left="260" Top="5" Width="40" Height="56" ScaleStyle="Stretch" />
<Image ID="icon3" Left="260" Top="58" Width="40" Height="56" ScaleStyle="Stretch" />
<Image ID="icon4" Left="260" Top="105" Width="40" Height="56" ScaleStyle="Stretch" />
While it may strike some as odd, that entire feature is right here in these 4 lines of code! See, the reason I refer to ID's as Variables is because they change as pages change! In this case, the CComm panel (like most, if not all, others) does not tell you every single page in its code! So by adding lines to the file associated with CComm (as i metioned earlier) i was able to load pointers to images into the variables icon1 - 4 and place them in the corresponding folders in the registry. [If you want to learn more into how I did that, PM me or check it out by installing and investigating]
[Tutorial Part 5] - Interactions with the Registry
Like many programs on a windows OS, there are registry keys and values related to the executable (or similar). The Today Screen is no exception to this rule. In this section I will inform you on how the Today Screen 'interacts' with the registry and how you can make your own interactions.
[Tutorial Part 5.1] - How it works!
I have been mentioning a lot about how the Today Screen (consisting of multiple DLL's and XML files) interacts with the registry, when that is actually not true! In order to interact, it must be able to write and read. To the extent of my knowledge the Today Screen CANNOT write to the registry.
"WAIT WHAT!!! So how is it that when I click on that awesome CComm set-up you have stuff happens!?!"
Well...It is magic! ... The magic of PROGRAMMING! There is no actual command for the Today Screen to write something. It can only read. So amazing people figured out how to gain this access.
Like I explained, the ID's act like variables, reading certain entries in the Registry. So let's get a bit more in depth with that by an example. Below is the code for my CComm Panel layout ... I reviewed this earlier, but will use this as a prime example.
<Image ID="icon1" Left="40" Top="25" Width="90" Height="115" ScaleStyle="Stretch" />
<Image ID="icon2" Left="260" Top="5" Width="40" Height="56" ScaleStyle="Stretch" />
<Image ID="icon3" Left="260" Top="58" Width="40" Height="56" ScaleStyle="Stretch" />
<Image ID="icon4" Left="260" Top="105" Width="40" Height="56" ScaleStyle="Stretch" />Now, let us all grab our phones, go to the start menu, and open up RegEdit or Resco Registry (or any app that you use). I want you to navigate to:
HKEY_LOCAL_MACHINE\Software\Microsoft\CHome\
In there is everything that has to do with the Today Screen (Remember it is also called CHome!) More specifically, for the sake of this tutorial, go into CComm. Remember I mentioned "pages" and layering. Well this is where it matters. Notice there are 6 Keys called Page1 - Page6 (and there are 6 pages on the Today Screen!) Take a walk around, investigate for a moment, the continue reading and see if you got what you thought correct....
...
...
Okay, so the correct assumptions for how all this works would be that what is written in the CPR is exactly what is taken from the Registry. But that brings us to another question...HOW does all this get there? What all-mighty programming goblin is in my phone feeding this information!?!
Simple...that is covered in the next section...
[Tutorial Part 5.2] - Going from Acting to Inter-Acting!
Now it gets a bit more complicated...you, the eager [young] computer programmer wants to make a panel that gives all this information to the user and does a bunch of changes on the phone, but HOW!
The simplest (not the only) way to do this is to use MortScript (in my opinion). MortScript is a scripting language that is very basic when you get the hang of it. It will do everything you need it to do, in most cases, as long as it doesn't involve things it can't do (duhh).
I strongly advise people interested in the Today Screen to learn MortScript because it will make a bunch of things a whole lot easier!
[Tutorial Part 5.2.1] - My First Registry Interaction!
Let us say you want to make a panel that shows you the Phone Owner's name, email, and a random note. To start off, open up NotePad ++ (or whichever text editor you want to use) and make a program. Done. Haha, just kidding! Let us take this step by step.
Let us assume the panel has a registry entry already and is called MyFirstPanel (located at HKML\Software\Microsoft\CHome\MyFirstPanel) There is one page, so we go to the Page1 Key.
We can do this one of two ways. We can make it Device Specific and pre-define all that data, or we can make it device independent and use MortScript to fill in the blanks. I will opt for number 2, but for those who do decide to do the first, make some Strings with your data, then in the CPR, add those ID's (correctly with the correct tags, which I will go over in a later tutorial).
Taking the second method, go back to your text editor. Let us see what we need to do. We need to find the user information, assuming there is any, and access it. The problem with the Registry interactions and the Today Screen is that the Today Screen is LIMITED to the Chome\PANELNAME key. That is where MortScript comes in handy...
I will tell you this time that the Owner Information (which can be entered in settings) is located at HKCU\ControlPanel\Owner\ . So let us make a script that will copy this data.
Code:
//Reads the Registry Entry for the NAME
name = RegRead("HKCU", "\ControlPanel\Owner", "Name")
//Reads the Registry Entry for the Telephone Number
phone = RegRead("HKCU", "\ControlPanel\Owner", "Telephone")
//Reads the Registry Entry for the E-Mail
email = RegRead("HKCU", "\ControlPanel\Owner", "E-mail")
//Reads the Registry for an extra note
note = RegRead("HKCU", "\ControlPanel\Owner", "Notes")
//Writes the NAME to OUR PANEL for later use.
//Assigns the ID to be used to name1 (I use numbers as a precautionary)
RegWriteString("HKLM", "\Software\Microsoft\CHome\MyFirstPanel\Page1", "name1", name)
//Writes the PHONE NUMBER to OUR PANEL
RegWriteString("HKLM", "\Software\Microsoft\CHome\MyFirstPanel\Page1", "phone1", phone)
//Writes the EMAIL to OUR PANEL
RegWriteString("HKLM", "\Software\Microsoft\CHome\MyFirstPanel\Page1", "email1", email)
//Writes the NOTE to OUR PANEL
RegWriteString("HKLM", "\Software\Microsoft\CHome\MyFirstPanel\Page1", "note1", note)
That is it! Assuming you have learned enough of this language, this should act as a great backbone when it comes to registry interactions.
So now that you know the very basics of the CPR file, and how some things work, you can rest assured that I will continue this tutorial when more time becomes available! It pains me to say it but:
TUTORIAL TO BE CONTINUED!!!
saved
Saved for future reference
Sweeeeeet added to sticky
great tutorial, thanx , really , good job.
Wonderful job Cyclone..!!!! keep it up
this free program is very useful in editing both cpr and home.xml files....it will color code and proof the tags for you..
hewhoisnotasothers said:
this free program is very useful in editing both cpr and home.xml files....it will color code and proof the tags for you..
Click to expand...
Click to collapse
Thanks for the link. I'm going to make a post/section specifically for software. Will be sure to add this.
I believe MPI is the arrows for the Media Player. They are arrows, that's for sure. Just which arrows, I don't know to be certain. I would think Media Player as "M". Media Page Indicator? or Media Player Indicator? NPI=Next/Previous Indicator?
waiting...
Have been checking this thread in the hope that the tutorial continues.
Please
I have lots of questions that might be solved by the next part of the tutorial.
Hey,
Sorry for not updating sooner. I am still in school and this past week I had intense Marching Band rehearsals to lead up to our competition on sunday. Its all over now, so I have distinctly more time get back to my projects. Expect an update soon.
Cyclonezehpyrxz7
I did a minor update. I am sort of out of ideas. I did the unthinkable and left this alone for too long and lost my train of thought. So now I call upon you, the eager readers! What is it that I need still incorporate?
Don't mention the following because i already plan on implementing them:
-Interactions with the Registry (a bit more in depth with examples).
-Simple guide to making a basic panel (that doesn't do much)
-Go over more specifics about different TAG types.
Thats it...my mind is dry (oddly and unfortunately enough). So please, anything you would like to know more indepth (or at all) just post it here and I will fill as many requests as possible!
CPR - Registry interaction
Most of my 100000000's questions are Registry related so for that part I'll wait until your Tut covers it.
In the meantime, do you know what this does?
<ControlSequence ID="Action Sequence" FramesPerSecond="30" Loop="False">
YesHoney said:
Most of my 100000000's questions are Registry related so for that part I'll wait until your Tut covers it.
In the meantime, do you know what this does?
<ControlSequence ID="Action Sequence" FramesPerSecond="30" Loop="False">
Click to expand...
Click to collapse
The ControlSequence tag is, in our case, useless. As Drkfngthdrgnlrd explained it to me a while ago, that controls animations that go on on-screen. It works for making buttons, etc. but since our phone's not a touch-screen, buttons really cannot exist. I believe that it is in there because this is a "stock" CPR, and realize that there is no OFFICIAL 6.5 for our smartphone, what the master chefs here have done is take megapacks (i believe that is what they are called) from official 6.5 ROM's for other phones and sort of splice them together to emulate a 6.5 environment.
Thank you
Why do I think you will come up with some rom made by you?
Thanks for the tutorial!
Regards
ControlSequence ID="Action Sequence"
According to what you explained, I deleted
<ControlSequence ID="Action Sequence" FramesPerSecond="30" Loop="False">
<Image ID="Image" Left="0" Top="0" Width="320" Height="67" ScalingAlgorithm = "TriLinear" Opacity="1.0"/>
</ControlSequence>
from the CPR and absolutely nothing changed in the behaviour of the home screen.
Which is expected. Like I said, it is a "stock" CPR...that is designed for button's, etc. Much like the cmhome.dll (which contains the atual code for the CPR), it is all pretty stock and based for touchscreens because M$ knows that if they dare change anything, they could mess it all up (haha *sigh*).
Now that you mention cmhome... could you please see http://forum.xda-developers.com/showthread.php?t=573863
Plspls