Use this guide to replace the button in the application template with the one from the Z sample application. This is a good example of separation of logic/data from the visuals enabling development of each to remain separate in a distributed development environment.

1.       Start a new application with the Windows Media Center Application template and complete the application as outlined in the readme.htm file.

2.       Using Windows Explorer copy the following files from the Z sample application source folder into the corresponding new application folders, overwriting existing files if present:

a.        \Markup\Button.mcml

b.       \markup\Styles.mcml

c.        \images\ButtonFocus.png

d.       \images\ButtonNonFocus.png

3.       Select the Images folder in Solution Explorer.

4.       Select Project > Add Existing Item from the menu.

5.       In the Add Existing Item dialog:

a.        Select Image Files in the Files of type drop down list.

b.       Navigate to the \Images folder for the project and multi-select ButtonFocus.png and ButtonNonFocus.png by clicking on them with the mouse while holding down the Control key on the keyboard.

c.        Click the Add button.

6.       Open Resources.resx for editing.

7.       In Resources.resx:

a.        Press Control+2 on the keyboard to switch to images.

b.       Drag and drop ButtonFocus.png, ButtonNonFocus.png and ButtonNonFocus.png from the Solution Explorer into Resource.resx to embed these files in the assembly.

8.       Double click \Markup\Button.mcml in Solution Explorer for to open for editing.

9.       Find and replace every instance of "resx://Z/Z" with "resx://[ApplicationName]/[ApplicationName]" where [ApplicationName] is the name of your project. For example: "resx://Z/Z.Resources/Styles" would read "resx://Application1/Application1.Resources/Styles"

10.    Double click \Markup\Styles.mcml in Solution Explorer for to open for editing.

11.    In Styles.mcml:

a.        Delete the following MCML: <Image Name="ContainerImage" Source="resx://Z/Z.Resources/Container" NineGrid="40,40,40,40"/>

b.       Add the following MCML: <Color Name="BackgroundColor" Color="Black"/>

c.        Find and replace every instance of "resx://Z/Z" with "resx://[ApplicationName]/[ApplicationName]" where [ApplicationName] is the name of your project.

12.    Select Compile and test using DevInstall.cmd or create the MSI as outlined in readme.htm to install and test.