A First Look at WPUtils

Two days ago, I released WPUtils 1.0. This toolkit contains a set of attached properties/Blend behaviors that you can use to extent your components/controls.

In this first release, WPUtils contains the following stuff:

  1. ListBoxProperties.SelectedItems attached property
  2. ChoosePhotoBehavior
  3. UriToPhotoConverter
  4. and the navigation components migrated from AppBarUtils, see How to Do Navigation for Application Bar with AppBarUtils in XAML? for more infomation.

ListBox control can be used in a multiple selection mode when you set its SelectionMode property to Multiple. In this case, you can obtain a list of selected items from the built-in SelectedItems property. What bothers me is that built-in SelectedItems property is not a dependency property, so you cannot bind it to a property of your view model class. This is where the ListBoxProperties.SelectedItems attached property comes to rescue. What’s more, when the user changes the selection in the ListBox, ListBoxProperties.SelectedItems attached property will update your view model accordingly.

Recall the experience when you new/edit a contact in Windows Phone. You tap the photo to choose a different one from your media library. ChoosePhotoBehavior is used to mimic this experience. You attach it to an Image component, bind its PhotoUri property to your view model, and you’re done. Whenever the user choose a photo, it will copy that photo to the photos folder in your isolated storage, and update your view model with a URI prefixed with “isostore:”. This rule of URI is used to distinguish the photos in the installation folder from those in isolated storage.

To take advantage of the above rule of URI, WPUtils provide a UriToPhotoConverter to work with Image component. For photos shipped with your app, i.e. in the installation folder, you will continue to use the URI format you use before, e.g. /images/photo1.jpg. For photos created in the isolated storage when the app is running, prefix the URI with “isostore:”, and UriToPhotoConverter will take care of the rest.

One more thing, photo URIs pointing to isolated storage or returned from PhotoChooserTask.OriginalFileName doesn’t work with Image.Source in XAML. So you either read the photo to BitmapImage and set it to Image.Source manually, or make use of UriToPhotoConverter.

I hope this toolkit helps. And any comments/suggestions are welcome. Cheers!


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: