此例子来自《深入浅出WPF》,刘铁猛。

VS2010

源码1:不使用Bingding

源码2:使用Binding

下面展示一些代码:

主窗体XAML代码:

<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1"
Title="MainWindow" Height="350" Width="623" ResizeMode="NoResize">
<Window.Resources>
<local:AutomakerToLogoPathConverter x:Key="a2l"></local:AutomakerToLogoPathConverter>
<local:NameToPhotoPathConverter x:Key="n2p"></local:NameToPhotoPathConverter> <DataTemplate x:Key="carDetailViewTemplate">
<Border BorderBrush="Black" BorderThickness="1" CornerRadius="6">
<StackPanel Margin="5">
<Image Width="400" Height="250" Source="{Binding Name,Converter={StaticResource n2p}}"></Image>
<StackPanel Orientation="Horizontal" Margin="5,0">
<TextBlock Text="Name:" FontWeight="Bold" FontSize="20"></TextBlock>
<TextBlock Text="{Binding Name}" FontSize="20" Margin="5,0"></TextBlock>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5,0">
<TextBlock Text="Automaker:" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Automaker}" Margin="5,0"></TextBlock>
<TextBlock Text="Year:" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Year}" Margin="5,0"></TextBlock>
<TextBlock Text="Top Speed:" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding TopSpeed}" Margin="5,0"></TextBlock>
</StackPanel>
</StackPanel>
</Border>
</DataTemplate>
<DataTemplate x:Key="carListItemViewTemplate">
<Grid Margin="2">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Automaker,Converter={StaticResource a2l}}" Grid.RowSpan="3" Width="64" Height="64"></Image>
<StackPanel Margin="5,10">
<TextBlock Text="{Binding Name}" FontSize="16" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Year}" FontSize="14"></TextBlock>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</Window.Resources>
<StackPanel Orientation="Horizontal" Margin="5">
<UserControl ContentTemplate="{StaticResource carDetailViewTemplate}" Content="{Binding SelectedItem,ElementName=listBoxCars}"></UserControl>
<ListBox x:Name="listBoxCars" Width="180" Margin="5,0" ItemTemplate="{StaticResource carListItemViewTemplate}"></ListBox>
</StackPanel>
</Window>

XAML文件

主窗体XAML文件的后台:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes; namespace WpfApplication1
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
InitialCarList();
} private void InitialCarList()
{
List<Car> carList = new List<Car>()
{
new Car(){Automaker="VolksWagen",Name="Beetle",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Golf GTI",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Jetta",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Pheaton",Year="",TopSpeed=""}
};
listBoxCars.ItemsSource = carList;
}
}
}

后台代码

实体Car类:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes; namespace WpfApplication1
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
InitialCarList();
} private void InitialCarList()
{
List<Car> carList = new List<Car>()
{
new Car(){Automaker="VolksWagen",Name="Beetle",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Golf GTI",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Jetta",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Pheaton",Year="",TopSpeed=""}
};
listBoxCars.ItemsSource = carList;
}
}
}

Car类

下面是两个Converter:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows.Data;
using System.Windows.Media.Imaging; namespace WpfApplication1
{
class AutomakerToLogoPathConverter:IValueConverter
{
#region IValueConverter 成员 public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
string uriStr = string.Format(@"/Resources/Logos/{0}.jpg",(string)value);
return new BitmapImage(new Uri(uriStr, UriKind.Relative));
} public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
} #endregion
}
}

AutomakerToLogoPathConverter

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows.Data;
using System.Windows.Media.Imaging; namespace WpfApplication1
{
class NameToPhotoPathConverter:IValueConverter
{
#region IValueConverter 成员 public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
string uriStr = string.Format(@"/Resources/Images/{0}.jpg",(string)value);
return new BitmapImage(new Uri(uriStr, UriKind.Relative));
} public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
} #endregion
}
}

NameToPhotoPathConverter

下面是文档结构:

WPF的模版的更多相关文章

  1. WPF Template模版之DataTemplate与ControlTemplate【一】

    WPF Template模版之DataTemplate与ControlTemplate[一] 标签: Wpf模版 2015-04-19 11:52 510人阅读 评论(0) 收藏 举报  分类: -- ...

  2. WPF Template模版之寻找失落的控件【三】

    “井水不犯河水”常用来形容两个组织之间界限分明.互不相干,LogicTree与控件内部这颗小树之间就保持着这种关系.换句话说,如果UI元素树上有个X:Name=“TextBox1”的控件,某个控件内部 ...

  3. WPF Template模版之DataTemplate与ControlTemplate的关系和应用【二】

    1. DataTemplate和ControlTemplate的关系 学习过DataTemplate和ControlTemplate,你应该已经体会到,控件只是数据的行为和载体,是个抽象的概念,至于它 ...

  4. 【转】WPF Template模版之DataTemplate与ControlTemplate的关系和应用(二)

    1. DataTemplate和ControlTemplate的关系 学习过DataTemplate和ControlTemplate,你应该已经体会到,控件只是数据的行为和载体,是个抽象的概念,至于它 ...

  5. 【转】WPF Template模版之DataTemplate与ControlTemplate(一)

    WPF系统不但支持传统的Winfrom编程的用户界面和用户体验设计,更支持使用专门的设计工具Blend进行专业设计,同时还推出了以模板为核心的新一代设计理念. 1. 模板的内涵 作为表现形式,每个控件 ...

  6. WPF三大模板简介(Z)

    WPF三大模板简介   WPF支持以下类型的模板: (1) 控件模板.控件模板可以将自定义模板应用到某一特定类型的所有控件,或是控件的某一实例.决定控件外观的是ControlTemplate,它决定了 ...

  7. WPF三大模板简介

    WPF支持以下类型的模板: (1) 控件模板.控件模板可以将自定义模板应用到某一特定类型的所有控件,或是控件的某一实例.决定控件外观的是ControlTemplate,它决定了控件“长成什么样子”,因 ...

  8. 在普通的"类库"项目中添加 WPF 的 Window 对象

    最近开发一个 WPF 项目, 在此项目中有个类库工程, 在开发的过程中发现在类库工程中竟然添加不了 WPF 窗口对象和一些其他的 WPF 对象,在新建窗口中选 WPF 类型,只有一个 “用户控件(WP ...

  9. WPF/Silverlight HierarchicalDataTemplate 模版的使用(转)

    上一篇 对Wpf/Silverlight Template 进行了总结,本篇继续上一篇,主要是介绍 HierarchicalDataTemplate 的使用方法.HierarchicalDataTem ...

随机推荐

  1. LCD深度剖析

    LCD 深度剖析 来源:http://blog.csdn.net/hardy_2009/article/details/6922900 http://blog.csdn.net/jaylondon/a ...

  2. redis学习大全

     http://blog.csdn.net/menergy/article/details/17577985 http://blog.sina.com.cn/s/blog_64008ed70102uy ...

  3. UVA - 10239 The Book-shelver&#39;s Problem

    Description Problem D The Book-shelver's Problem Input: standard input Output: standard output Time ...

  4. iOS中保证线程安全的几种方式与性能对比

    来源:景铭巴巴 链接:http://www.jianshu.com/p/938d68ed832c 一.前言 前段时间看了几个开源项目,发现他们保持线程同步的方式各不相同,有@synchronized. ...

  5. springmvc使用aop心得

    第一步:创建aop拦截类: @Component @Aspect public class ControllerSelectorInterceptor { @Before("executio ...

  6. ubuntu下创建c语言程序之hello world

    将要学习c语言了,先记录一下在ubuntu下,使用vim创建一个最基本的hello world程序: 打开终端,使用cd命令转到操作的目录,如我在home下的program files文件内创建, 就 ...

  7. chrome跨域配置

    "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --use ...

  8. 实现QQ空间图片预览效果

    今天项目遇到需求 要求 实现图片预览效果 .  类似于扣扣空间那种,本人也到网上找过 代码量太大了   ,类多到处是注释看的有点恶心 .然后自己写了一个图片预览的效果,其实很简单的 . 首先我们来分析 ...

  9. 自定义组合控件,适配器原理-Day31

    自定义组合控件,适配器原理-Day31 mobile2.1 主页定义 手机上锁功能 1.弹出设置密码框. 手机下载进度 自定定义控件 控件的属性其实就是控件类一个属性设置属性调用类的set方法方法, ...

  10. PAT_1008 数组元素循环右移问题

    题目描述: 一个数组A中存有N(N>0)个整数,在不允许使用另外数组的前提下,将每个整数循环向右移M(M>=0)个位置,即将A中的数据由(A0A1……AN-1)变换为(AN-M …… AN ...