社区 › 安全 › WPF 模板Template

丁若云 发表于 2025-10-14 16:00:02

WPF 模板Template

一、定义：
Template：在WPF中，Template通常指的是控件的模板，用于定义控件的外观和结构。每个控件都有一个默认的模板，但我们可以通过自定义模板来完全改变控件的外观，而不改变其行为。Template通常通过设置控件的Template属性来指定。

[*]ControlTemplate：控件模板，用于定义控件的视觉结构和外观。
[*]DataTemplate：数据模板，用于定义数据对象的视觉表现。
[*]ItemsPanelTemplate：项面板模板，用于定义ItemsControl的布局面板。
二、使用
   

[*]数据模板：数据内容的表现形式（决定数据外观）:DataTemplate 通常用于内容控件（如ContentControl）或列表控件（如ListBox、ComboBox）中，以指定如何显示数据对象。
<Window.Resources>
    <DataTemplate x:Key = "carInfoTemplate" DataType="{x:Type local:Person}">
      <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
            <TextBlock Text="{Binding Age}" Margin="10,0,0,0"/>
      </StackPanel>
    </DataTemplate>
</Window.Resources>
<UserControl ContentTemplate="{StaticResource carInfoTemplate}"/>   

[*]控件模板：算法内容的表现形式（决定控件外观）:

[*]ControlTemplate 通过定义一组元素（如Border、Grid、ContentPresenter等）来构建控件的视觉树。ControlTemplate不改变控件的逻辑行为，只改变其外观。
[*]ItemsPanelTemplate ：用于定义ItemsControl（如ListBox、ItemsControl）的项布局面板。默认情况下，ItemsControl使用StackPanel作为项布局面板，但你可以通过ItemsPanelTemplate将其改为其他面板，如WrapPanel、UniformGrid等。

<ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button">
    <Grid>
      <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/>
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</ControlTemplate><ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button">
    <Grid>
      <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/>
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</ControlTemplate>            三、拓展

[*]ContentPresenter（内容呈现器）: 是一个用于显示内容的控件。它通常在ControlTemplate中使用，作为占位符，表示控件的内容应该显示的位置。ContentPresenter会自动应用相应的DataTemplate来显示内容。
<ControlTemplate TargetType="Button">
    <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
      <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    </Border>
</ControlTemplate>

[*]DataTemplate中的DataContext：
　　　常见问题：在DataTemplate中绑定的命令，全部来自于ViewModel。但是这些命令却始终无法生效，调试发现这些命令根本没有绑定上。
　    解决方案：因为DataTemplate中无法访问到DataTemplate控件层以外的资源，包括ViewModel中的命令。为了访问到ViewModel中的命令，我们需要改变命令源，通过指定父级来访问全局的DataContext。
<Window.Resources>
    <DataTemplate x:Key = "carInfoTemplate" DataType="{x:Type local:Person}">
      <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
            <TextBlock Text="{Binding Age}" Margin="10,0,0,0"/>
      </StackPanel>
    </DataTemplate>
</Window.Resources>
<UserControl ContentTemplate="{StaticResource carInfoTemplate}"/><ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button">
    <Grid>
      <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/>
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</ControlTemplate><ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button">
    <Grid>
      <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/>
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</ControlTemplate>    四、使用场景

[*]当你想要改变一个控件的外观（如按钮、文本框）时，使用ControlTemplate。
[*]当你想要自定义数据对象在界面上的显示方式时，使用DataTemplate。
[*]当你想要改变一个ItemsControl的项布局方式时，使用ItemsPanelTemplate。
[*]当你在ControlTemplate中需要显示控件的内容时，使用ContentPresenter。
<Window.Resources>
    <DataTemplate x:Key = "carInfoTemplate" DataType="{x:Type local:Person}">
      <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
            <TextBlock Text="{Binding Age}" Margin="10,0,0,0"/>
      </StackPanel>
    </DataTemplate>
</Window.Resources>
<UserControl ContentTemplate="{StaticResource carInfoTemplate}"/>   <Window.Resources>
    <DataTemplate x:Key = "carInfoTemplate" DataType="{x:Type local:Person}">
      <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
            <TextBlock Text="{Binding Age}" Margin="10,0,0,0"/>
      </StackPanel>
    </DataTemplate>
</Window.Resources>
<UserControl ContentTemplate="{StaticResource carInfoTemplate}"/><ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button">
    <Grid>
      <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/>
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</ControlTemplate><ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button">
    <Grid>
      <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/>
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</ControlTemplate>
来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

钱匾 发表于 2025-11-2 01:08:09

yyds。多谢分享

驳嗦 发表于 2025-11-8 00:56:38

前排留名，哈哈哈

遑盲 发表于 前天 02:00

用心讨论，共获提升！

章海 发表于 前天 06:08

分享、互助 让互联网精神温暖你我

查看完整版本: WPF 模板Template