Binding Using a DataTemplate : DataTemplate « Data « Silverlight






Binding Using a DataTemplate

Binding Using a DataTemplate
  

<UserControl x:Class='SilverlightApplication3.MainPage'
    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' 
    mc:Ignorable='d' 
    d:DesignWidth='640' 
    d:DesignHeight='480'
    xmlns:datacontrols="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data">

  <UserControl.Resources>
<DataTemplate x:Key="dtAddress">
  <StackPanel>
    <TextBlock x:Name="tblkStreet" Text="{Binding Street}"/>
    <StackPanel>
      <TextBlock  x:Name="tblkCity" Text="{Binding City}"/>
      <TextBlock  x:Name="tblkComma" Text=","/>
      <TextBlock  x:Name="tblkState" Text="{Binding State}"/>
      <TextBlock  x:Name="tblkZip" Text="{Binding ZipCode}"/>
    </StackPanel>
  </StackPanel>
</DataTemplate>
    <DataTemplate x:Key="dtEmployee">
      <StackPanel>
        <Rectangle HorizontalAlignment="Stretch"/>
        <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" 
                   RadiusY="3" Stroke="#FF686868" StrokeThickness="0" 
                   Width="Auto">
        </Rectangle>
        <Rectangle HorizontalAlignment="Stretch" Margin="3,3,3,3" 
                   Stroke="#FF0A28EE" Grid.RowSpan="1" 
                   StrokeThickness="5" VerticalAlignment="Stretch"/>
        <StackPanel>
          <TextBlock x:Name="tblkFirstName" Text="{Binding FirstName}"/>
          <TextBlock x:Name="tblkLastName" Text="{Binding LastName}"/>
        </StackPanel>
        <StackPanel>
          <ContentControl ContentTemplate="{StaticResource dtAddress}" Content="{Binding Address}"/>
          <TextBlock x:Name="tblkPhoneNum" Text="{Binding PhoneNum}"/>
        </StackPanel>
      </StackPanel>
    </DataTemplate>
  </UserControl.Resources>

  <StackPanel>
    <ContentControl x:Name="cntctrlEmployee" ContentTemplate="{StaticResource dtEmployee}"/>
    <ListBox x:Name="itmctrlEmployees" 
             HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
             ItemTemplate="{StaticResource dtEmployee}" 
             />
  </StackPanel>  
</UserControl>


//File: Page.xaml.cs
using System.Collections.Generic;
using System.Windows.Controls;

namespace SilverlightApplication3
{
  public partial class MainPage : UserControl
  {
    public MainPage()
    {
      InitializeComponent();

      List<Employee> EmployeeList = new List<Employee>();

      EmployeeList.Add(new Employee
          {
            FirstName = "A",
            LastName = "B",
            PhoneNum = 2,
            Address = new Address { Street = "2 Street", City = "New York", State = "NY", ZipCode = 10006 }
          });

      EmployeeList.Add(new Employee{
            FirstName = "C",
            LastName = "D",
            PhoneNum = 7,
            Address = new Address { Street = "1 Road", City = "New York", State = "NY", ZipCode = 10016 }
          });

      cntctrlEmployee.Content = EmployeeList[0];
      itmctrlEmployees.ItemsSource = EmployeeList;
    }
  }
  public class Employee
  {
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public long PhoneNum { get; set; }
    public string ImageUri
    {
      get
      {
        return "/" + FirstName + ".png";
      }
    }
    public Address Address { get; set; }
  }

  public class Address
  {
    public string Street { get; set; }
    public string City { get; set; }
    public string State { get; set; }
    public int ZipCode { get; set; }
  }
}

   
    
  








Related examples in the same category

1.A DataTemplate used with a ContentControlA DataTemplate used with a ContentControl