Alex Golesh's Blog About Silverlight Development

Silverlight for Windows Phone 7 Quick Tip: Fix missing icons while using DatePicker/TimePicker controls

Recently in one of my applications I used DatePicker control from Silverlight for Windows Phone 7 Toolkit.

When launched the app and tried to change the date I “discovered” unpleasant surprise – the Done/Cancel icons in Application Bar were missed:

I had to look in Toolkit’s sources I found the following definition (same for DatePicker and TimePicker):

<primitives:DateTimePickerPageBase.ApplicationBar>
    <shell:ApplicationBar IsVisible="True">
        <!--
        Due to platform restrictions, ApplicationBarIconButton.IconUri content can not come from the
        Microsoft.Phone.Controls.Toolkit assembly, so it is up to the application developer to ensure
        these resources are placed in the right location and marked as Build Action=Content. For
        convenience, platform-consistent images are included with the Toolkit installer.

        Note: ApplicationBarIconButton.Text automatically comes from the Microsoft.Phone.Controls.Toolkit
        resources (where it can be localized).
        -->
        <shell:ApplicationBarIconButton
            IconUri="/Toolkit.Content/ApplicationBar.Check.png"
            Text="DONE"/>
        <shell:ApplicationBarIconButton
            IconUri="/Toolkit.Content/ApplicationBar.Cancel.png"
            Text="CANCEL"/>
    </shell:ApplicationBar>
</primitives:DateTimePickerPageBase.ApplicationBar>

Quick Tip: In order to make icons work properly the project should have “Toolkit.Content” project folder under project root and two icons with the following names marked as “Content” resources:

ApplicationBar.Cancel.png

ApplicationBar.Check.png

The default icons could be found at the following location (default location – your location could vary):

C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Toolkit\Sep10\Bin\Icons

After adding those icons to the project the problem were fixed:

Stay tuned,

Alex