Tutorial :How can I create a DataTemplate with Expression Blend 3?


I'm currently experimenting with Expression Blend 3 MIX09 version with the idea to use it primarily for an MVVM structured site with databinding, being able to view live data as I design. So far I've been very impressed and have to say that Blend 3's generated XAML is not as bad as people say it is. I got the following two examples working, one with data binding and one with user controls (views) being loaded dynamically. I can stay in Expression Blend 90% of the time while I design my application, seeing live data coming from my ViewModels as I design. I switch to Visual Studio only for e.g. creating config files, or adding references is easier. The improved intellisense of Blend 3 enabled me to stay in Blend for much of my coding as well:

One thing I'm surprised that I can't do in Expression Blend, though, is after I have created a ListBox, I would expect that I could do a right-click and create a DataTemplate. I can of course create a DataTemplate in code, then under Resources/Window I find it again, can click on a button next to it to "go into the DataTemplate" and see the controls inside in my Objects and Timeline panel, which is nice. But creating a DataTemplate from a control is so common, I would think there is a way to do it that I am just missing.

Where in Blend 3 can you "create a DataTemplate" for a ListBox or ListView, etc?

<UserControl      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"      xmlns:local="clr-namespace:TestDynamic456"      mc:Ignorable="d"      x:Class="TestDynamic456.CustomersView"      x:Name="UserControl"      d:DesignWidth="640" d:DesignHeight="480">        <UserControl.Resources>          <local:CustomersViewModel x:Key="CustomersDataProvider"/>      </UserControl.Resources>      <StackPanel x:Name="LayoutRoot" Background="{x:Null}">            <ListBox ItemsSource="{Binding Path=GetAll, Source={StaticResource CustomersDataProvider}}"/>        </StackPanel>  </UserControl>  


In Blend 3, you create a DataTemplate for ItemsControl's in the same place where you do it in Blend2 ;)

Right Click the control->Edit Other Templates->Edit Generated Items(ItemTemplate)->CreateEmpty

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »