EasyPainter Source Pack 2: Flickr, ComboCheckBox and more!

Mar 11, 2010

Yes! EasyPainter Source Pack 2 is here!

This source pack contains Flickr integration sample amongst other also important things (read below).

Download Source Code

The live demo:

Usage

  1. Go to http://www.flickr.com/services/api/, sign up and get an API key for your app
  2. Put the key in Flickr\FlickrHelper.cs
  3. Use the below code behind and XAML:

[code:c#]

public MainPage() {
    InitializeComponent();
    Globals.ToolbarRadioButtonStyle = (Style)Application.Current.Resources["ToolbarRadioButton"];
    IGenericUserInterface ui = (IGenericUserInterface)openDialog1;
    ui.Result += new GenericResultHandler(ui_Result);
}

void ui_Result(IGenericUserInterface sender, EasyPainter.Imaging.ResultType result, bool uiDismissed) {
    MessageBox.Show(String.Format("Result type: {0}\nPhoto Url: {1}", result, openDialog1.PhotoUrl));
}

[/code]

XAML:

<Grid x:Name="LayoutRoot" Background="White">
    <my:OpenDialog x:Name='openDialog1' />
</Grid>

License

The source code of the sample is licensed under MS-PL

Flickr usage is governed by their own license: check the terms of use on http://www.flickr.com/services/api/ for more details.

Source Code Information

Apart from Flickr, there are some other things interesting to developers in this sample:

  • Queuing for WebClient. The WebClient class does not allow to call DownloadStringAsync() while another download using WebClient is in progress. The WebClientQueue class in the sample allows you to queue work items, cancel them, gracefully display and recover from errors and get updates on progress.
  • Caching for WebClient REST API and other requests. The current cache is set in WebClientQeueue to 5 minutes. Huge speed improvement when browsing through the images!
  • ComboCheckBox control (far from perfect, but still usable for some cases)
  • Minimalistic WrapPanel. The 10KB version of the WrapPanel extracted from the Silverlight toolkit that is typically around 280 KB.
  • Lightweight XML parsing. Using XMLReader instead of Linq like other samples do helps shave off about 100KB of size from the sample
  • Small size! Combining the 2 above items, and the XAP file is only 27K (I wish it was less but life if life :))
  • ImageList control for showing and paging through images
  • ImageSwitchHelper – a "fit-and-finish" control that helps avoid "jumping" when the image on the right changes. The control preserves the frame size until the next image is loaded.
  • An easy way to keep UI alive and preserve the dialog view (DialogStore.cs). If you open EasyPainter you'll notice that every time you click "Open from Flickr" you will go to your previous view instead of resetting the UI.
  • IUserInterface – a kind of generic interface for reusable UIs and for connecting UIs with other parts of your program. This interface is used in all dialogs in EasyPainter, for example to update the view when filter values change. It also allows to click through effects without clicking Cancel on each dialog (for example). All EasyPainter filter UI dialogs are built on-the-fly from metadata info assigned to the filter (this would come in another sample sometime).

I almost missed something important: once you have the image Url, you can display it in an Image tag. If you want to use it from within WriteableBitmap though, you'll have to round-trip it through the server that serves the .xap file (in EasyPainter's case that's www.nokola.com).

Also note that Source Pack 1 has a refresh today too containing new features and bug fixes!

I hope this sample will help you make more responsive/pleasing UIs in addition to Flickr!

Hope you like it! Please comment :)