<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://draft.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.

Monday, June 05, 2006

Using the “assembly” when mapping clr-namespace

I was playing around today with Data binding in WPF using the ObjectDataProvider. It is a powerful concept and you can apply it effectively if you understand it well. Beatriz Costa has been blogging for a while about DataBinding and her blog is a great resource.

Since the Feb CTP of WinFX the syntax has changed for mapping a CLR namespace to a XML namespace. Using the new syntax the mapping can be part of the root tag as:

<Grid

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:d="http://schemas.microsoft.com/expression/interactivedesigner/2006"

mc:Ignorable="d"

Background="#FFFFFFFF"

x:Name="DocumentRoot"

x:Class="UntitledProject1.Scene1"

Width="640"
Height="480"

xmlns:f="clr-namespace:MyHelper;assembly=MyHelper"

xmlns:system="clr-namespace:System;assembly=mscorlib">

Note the highlighted line which contains the mapping. With this concise syntax, we are creating a XML namespace “system” which maps to the CLR namespace of “System”. In the same line we also have an “assembly” attribute. This tells the XAML parser that the aforementioned namespace is not in the current assembly but lies in an external assembly (in this case “mscorlib”).

Thus when the XAML parser sees a fragment like below:

<ObjectDataProvider
x:Key="odp_1"
ObjectType="{x:Type f:MyHelper}"/>

<ObjectDataProvider
x:Key="odp_2"
MethodName="GetPhotos"
ObjectInstance="{StaticResource odp_1}">

<ObjectDataProvider.MethodParameters>

<system:String>pavan-podila</system:String>

</ObjectDataProvider.MethodParameters>

</ObjectDataProvider>


it would know that the “system:String” is a Type defined in the CLR “System” namespace which lies in the mscorlib assembly.


I have had enough trouble debugging a solution when I missed the “assembly” attribute. I would keep getting a XamlParseException and when I drill down into the InnerException it would say:


{"Error at element 'String' in markup file 'TestUI;component/scene1.xaml' : 'f:MyHelper' string cannot be converted to object of type 'System.Type'."}


After scratching my head for a while it dawned on me that I was missing the “assembly” attribute. The mapping should be:

xmlns:f="clr-namespace:MyHelper;assembly=MyHelper"


WITH the assembly attribute!