无废话WPF系列17:数据模版

简介:

WPF模版主要分为俩大类:

ControlTemplate: 控件的外观,也就是控件是什么样子

DataTemplate: 是数据内容的表现,一条数据显示成什么样子

1. 数据模版常用的地方有以下几处:

  • ContentControl的ContentTemplate属性。
  • ItemsControl的ItemTemplate属性。
  • GridViewColumn的CellTemplate属性。

2. 示例

ItemsControl

image

image

image

ContentControl

image

image

 

3. DataTemplate除了可以作用在控件上,也可以作用再数据类型上

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
< Window  x:Class="DeepXAML.MainWindow"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:local="clr-namespace:DeepXAML"      
         xmlns:sys="clr-namespace:System;assembly=mscorlib"
          xmlns:cl="clr-namespace:System.Collections;assembly=mscorlib"
         Title="MainWindow" Height="250" Width="450">
     < Window.Resources >
         < DataTemplate  DataType="{x:Type local:Student}">           
             < StackPanel  Orientation="Horizontal" >
             < Grid  Margin="5">               
                 < Rectangle  Fill="YellowGreen"  Width="{Binding  Path=Score}"/>
                 < TextBlock   Text="{Binding Path=Name}"></ TextBlock >
             </ Grid >
                 < TextBlock  Text="{Binding Path=Score}" Margin="5"></ TextBlock >
             </ StackPanel >
         </ DataTemplate >
         < cl:ArrayList  x:Key="allStudentsList">
             < local:Student  Name="Jack" Gender="True" Score="80"></ local:Student >
             < local:Student  Name="Tom" Gender="False" Score="40"></ local:Student >
             < local:Student  Name="Jack" Gender="True" Score="75"></ local:Student >
         </ cl:ArrayList >
     </ Window.Resources >
     < StackPanel  x:Name="stackPanel">
         < ListBox  ItemsSource="{StaticResource ResourceKey=allStudentsList}" FontSize="15"></ ListBox >
         < TextBlock  Margin="10">Below is combox</ TextBlock >
         < ComboBox  ItemsSource="{StaticResource ResourceKey=allStudentsList}" FontSize="15"></ ComboBox >
     </ StackPanel >
</ Window >

 

image

 

4. DataTemplate作用在XML元素上

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
< Window  x:Class="DeepXAML.MainWindow"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:local="clr-namespace:DeepXAML"      
         xmlns:sys="clr-namespace:System;assembly=mscorlib"
          xmlns:cl="clr-namespace:System.Collections;assembly=mscorlib"
         Title="MainWindow" Height="250" Width="450">
     < Window.Resources >
         < DataTemplate  DataType="Student">           
             < StackPanel  Orientation="Horizontal" >
             < Grid  Margin="5">               
                 < Rectangle  Fill="YellowGreen"  Width="{Binding  XPath=@Score}"/>
                 < TextBlock   Text="{Binding XPath=@Name}"></ TextBlock >
             </ Grid >
                 < TextBlock  Text="{Binding XPath=@Score}" Margin="5"></ TextBlock >
             </ StackPanel >
         </ DataTemplate >
         < XmlDataProvider  x:Key="xmlDp" XPath="Students/Student">
             < x:XData >
                 < Students  xmlns="">
                     < Student  Name="Jack" Score="80"></ Student >
                     < Student  Name="Tom" Score="40"></ Student >
                     < Student  Name="David" Score="75"></ Student >
                 </ Students >
             </ x:XData >
         </ XmlDataProvider >
     </ Window.Resources >
     < StackPanel  x:Name="stackPanel">
         < ListBox  ItemsSource="{Binding Source={StaticResource xmlDp}}" FontSize="15"></ ListBox >
         < TextBlock  Margin="10">Below is combox</ TextBlock >
         < ComboBox  ItemsSource="{Binding Source={StaticResource xmlDp}}" FontSize="15"></ ComboBox >
     </ StackPanel >
</ Window >

image

本文转自敏捷的水博客园博客,原文链接http://www.cnblogs.com/cnblogsfans/archive/2011/02/27/1966172.html如需转载请自行联系原作者


王德水

相关文章
|
3月前
|
开发框架 前端开发 JavaScript
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(10) -- 在DataGrid上直接编辑保存数据
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(10) -- 在DataGrid上直接编辑保存数据
|
3月前
|
传感器 C# 监控
硬件交互新体验:WPF与传感器的完美结合——从初始化串行端口到读取温度数据,一步步教你打造实时监控的智能应用
【8月更文挑战第31天】本文通过详细教程,指导Windows Presentation Foundation (WPF) 开发者如何读取并处理温度传感器数据,增强应用程序的功能性和用户体验。首先,通过`.NET Framework`的`Serial Port`类实现与传感器的串行通信;接着,创建WPF界面显示实时数据;最后,提供示例代码说明如何初始化串行端口及读取数据。无论哪种传感器,只要支持串行通信,均可采用类似方法集成到WPF应用中。适合希望掌握硬件交互技术的WPF开发者参考。
68 0
|
3月前
|
数据处理 开发者 C#
WPF数据绑定实战:从零开始,带你玩转数据与界面同步,让你的应用程序更上一层楼!
【8月更文挑战第31天】在WPF应用开发中,数据绑定是核心技能之一,它能实现界面元素与数据源的同步更新。本文详细介绍了WPF数据绑定的概念与实现方法,包括属性绑定、元素绑定及路径绑定等技术,并通过示例代码展示了如何创建数据绑定。通过数据绑定,开发者不仅能简化代码、提高可维护性,还能提升用户体验。无论初学者还是有经验的开发者,都能从中受益,更好地掌握WPF数据绑定技巧。
76 0
|
3月前
|
开发框架 前端开发 搜索推荐
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(4) -- 实现DataGrid数据的导入和导出操作
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(4) -- 实现DataGrid数据的导入和导出操作
|
3月前
|
开发框架 .NET C#
WPF/C#:显示分组数据的两种方式
WPF/C#:显示分组数据的两种方式
56 0
|
3月前
|
XML C# 数据格式
WPF/C#:如何将数据分组显示
WPF/C#:如何将数据分组显示
37 0
|
3月前
|
C# Windows
WPF/C#:如何显示具有层级关系的数据
WPF/C#:如何显示具有层级关系的数据
51 0
|
12月前
|
算法 C# UED
浅谈WPF之控件模板和数据模板
WPF不仅支持传统的Windows Forms编程的用户界面和用户体验设计,同时还推出了以模板为核心的新一代设计理念。在WPF中,通过引入模板,将数据和算法的“内容”和“形式”进行解耦。模板主要分为两大类:数据模板【Data Template】和控件模板【Control Template】。
195 8
WPF 点击 Datagrid 中的TextBox 控件获取其所在行的数据
WPF 点击 Datagrid 中的TextBox 控件获取其所在行的数据