DZone
Mobile Zone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
  • Refcardz
  • Trend Reports
  • Webinars
  • Zones
  • |
    • Agile
    • AI
    • Big Data
    • Cloud
    • Database
    • DevOps
    • Integration
    • IoT
    • Java
    • Microservices
    • Open Source
    • Performance
    • Security
    • Web Dev
DZone > Mobile Zone > Changing the border for a DatePicker control on Windows Phone 7

Changing the border for a DatePicker control on Windows Phone 7

Denzel D. user avatar by
Denzel D.
·
Feb. 03, 11 · Mobile Zone · Interview
Like (0)
Save
Tweet
11.84K Views

Join the DZone community and get the full member experience.

Join For Free

There is a neat package of controls that comes pre-bundled with the Silverlight Toolkit for Windows Phone. It saves you a lot of time on creating custom user controls and at the same time keeps your application consistent with the main Windows Phone UI. One particular case I want to talk about today is that related to control customizations. Specifically, I tried to customize a DatePicker border.

The whole idea was triggered by this question. Surprisingly, setting the border directly via XAML had no effect whatsoever - I was able set the border thickness, but not the color. Not something out of the normal flow of things, so I fired up Expression Blend, referenced the control library, added the DatePicker control on the main page and tried to get its template. I already performed a similar "operation" on a ComboBox control and didn't expect this one to be any more complicated. However, a surprise was waiting:

No template that I can edit - pretty disappointing to see. After a minute of thinking I realized that somehow the default control properties are set anyway, and thanks to the fact that the toolkit has the source code available, I was able to take a look under the hood and see what's up.

And here is what I found out in the first place - all controls have their visual properties defined in one theme file - Generic.xaml, located in the Themes folder.

A template file is always a good place to start when there are visual property problems, so I scrolled a bit to the point when I saw the DatePicker control listed:

I noticed one weird thing about this particular style - it had no BorderBrush setter defined, therefore it makes total sense that the BorderBrush manual setting didn't work. An easy fix was implemented pretty quick.

In the main style, I added the following setter:

<Setter Property="BorderBrush" Value="Azure"/>

Of course you can set this to a different color or even to a static resource that will be linked to the phone theme. I am using azure just for testing purposes.

The picker you are seeing is nothing but a button, so I scroll down to the button part and add this property reference:

BorderBrush="{TemplateBinding BorderBrush}"

This links the border brush of the button to the border brush of the template. Nothing fancy here. Overall, you should have this:

Recompile the library and reference it instead in your project.

NOTE: If you have the toolkit installed on your system, the default reference for Microsoft.Phone.Controls.Toolkit will be taken from GAC instead of what you built. Either rename the library or make a local copy in the project folder.

Once done, you will be able to set the brush as you want it:

Windows Phone

Opinions expressed by DZone contributors are their own.

Popular on DZone

  • Top Soft Skills to Identify a Great Software Engineer
  • Enough Already With ‘Event Streaming’
  • How to Test JavaScript Code in a Browser
  • Choosing Between GraphQL Vs REST

Comments

Mobile Partner Resources

X

ABOUT US

  • About DZone
  • Send feedback
  • Careers
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • MVB Program
  • Become a Contributor
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 600 Park Offices Drive
  • Suite 300
  • Durham, NC 27709
  • support@dzone.com
  • +1 (919) 678-0300

Let's be friends:

DZone.com is powered by 

AnswerHub logo