<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d13405220\x26blogName\x3dPavan+Podila\x27s+Blog\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dBLUE\x26layoutType\x3dCLASSIC\x26searchRoot\x3dhttp://pavanpodila.blogspot.com/search\x26blogLocale\x3den_US\x26v\x3d2\x26homepageUrl\x3dhttp://pavanpodila.blogspot.com/\x26vt\x3d7258010184004836690', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>

Friday, June 09, 2006

Simple Flickr Explorer with WPF databinding

Databinding is a great feature of the Windows Presentation Foundation and playing around with it has been fun. As a sample I made a simple Flickr explorer that would show the most recent photos of a user. It takes the username as input.


Databinding

The interesting part of this application is that it is entirely driven by Data-binding (markup + little code-behind). The markup creates the ObjectDataProvider which is then populated in the code-behind. All though I could have done everything in markup I deliberately chose to do some of it in code-behind just to have a taste of the API. I have a helper class which defines some public methods to get the list of photos and also the user-info. The ObjectDataProvider class has two properties: MethodName, MethodParameters which can be used to bind to methods of any CLR object. The data-binding engine would internally make calls on these methods to get the required data. The bindings to the ObjectDataProvider are set to asynchronous (by setting the Binding.IsAsync to True).

Styling

I have defined DataTemplates for the Photo class that represents each item in the list of photos. There are three different templates for different size of the photos. You can switch between the sizes using the radio-buttons. Additionally there are styles for the ListBox, Button and TextBox. For the ListBox I have changed the ItemTemplate to use a WrapPanel (which becomes the ItemsHost). All of these are declared in a separate ResourceDictionary and linked to the main XAML file.

Libraries

I am using the Flickr.NET library to communicate with Flickr.

Download Source and Binaries.