How to Change Disabled Button Background, Focused TextBox Border etc in Windows Phone

xster
xster
Published in
2 min readMay 11, 2012

In the properties tab or attributes of XAML, the level of control you can have over Silverlight controls is rather limited. You can’t change their behaviours in different states. To actually control it, you need to create a ControlTemplate. Sounds innocent enough but it’s basically forcing the user to redefine a user control and recreate the button or the textbox manually from their constituents (border, grid etc) which is extremely labour intensive if all you want to do is just change say the colour of the border when it is selected.

Instead of recreating the control from scratch, you can let Microsoft Expression Blend do some part of that job for you. Style your control to your liking as much as you can in Blend and then right-click to select Edit Template -> Edit a Copy. Then you get to define a key. Think of it like a CSS class and name it as you wish. Define it in the Application (App.xaml) so you can use it everywhere in your application. This will then generate a ControlTemplate for you based on the instance of control you selected Edit Template on.

From there, you can look at the code and notice the properties that are storyboard-animated to change on different events and customize them. Once that’s done you can start applying this new template to your controls by adding the

Template="{StaticResource TextBoxCustom}"

attribute to the tags.

--

--