WPF控件模板

时间 2019-12-12

标签 wpf 控件模板繁體版

原文原文链接

　　引言：在进行WPF项目开发过程当中，因为项目的须要，常常要对某个控件进行特殊的设定，其中就牵涉到模板的相关方面的内容。本文也是在本身进行项目开发过程当中遇到控件模板设定时集中搜集资料后整理出来的，以供在之后的项目开发过程当中查阅。WPF有控件模板和数据模板，从字面上来看，控件模板主要是用来改变控件的外观，数据模板则定义控件中数据的表现方式。下面让逐一进行介绍。框架

控件模板ControlTemplate，有两部分：VistualTree视觉树，便是能看到的外观；Trigger触发器，里面包括外部条件达到某一条件下会引发的响应。字体

参考代码：spa

<Button Content="Button" Grid.Row="1" Height="136" HorizontalAlignment="Left" Margin="114,80,0,0" Name="button1" VerticalAlignment="Top" Width="205" >
            <Button.Template >
                <ControlTemplate >
                    <Grid >
                        <Ellipse Name="faceEllipse" Height="50" Width="100" Fill="{TemplateBinding Button.Background}"/>
                        <TextBlock Name="txtBlock"  />
                    </Grid >
                    <ControlTemplate.Triggers >
                        <Trigger Property="Button.IsMouseOver" Value="True">
                            <Setter Property="Button.Background" Value="blue"/>
                        </Trigger >
                    </ControlTemplate.Triggers >
                </ControlTemplate >
            </Button.Template >
        </Button >

　　在上面的前台代码中，包含button控件的视觉树和触发器。Grid部分是改变button控件的视觉树部分，意思是将button控件显示部分椭圆，而背景色是控件的本来色调；Triggers部分是当有鼠标在button控件上面是控件的背景色变为蓝色。设计

为了便于屡次利用，能够将其写入模板中，以下：code

<Window.Resources >
        <ControlTemplate x:Key="buttonTemplate" TargetType="Button" >
            <Grid >
                <Ellipse Name="faceEllipse" Height="50" Width="100" Fill="{TemplateBinding Button.Background}"/>
                <TextBlock Name="txtBlock"  />
            </Grid >
            <ControlTemplate.Triggers >
                <Trigger Property="Button.IsMouseOver" Value="True">
                    <Setter Property="Button.Background" Value="blue"/>
                </Trigger >
            </ControlTemplate.Triggers >
        </ControlTemplate >
    </Window.Resources >

调用时：<Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="216,224,0,0" Name="button3" Width="75" Template="{StaticResource buttonTemplate}"/>component

DataTemplate模板：blog

参考代码：ip

<ListBox Height="202" HorizontalAlignment="Left" Margin="21,12,0,0" Name="listBox1" VerticalAlignment="Top" Width="384" >
            <ListBox.ItemTemplate >
                <DataTemplate >
                    <StackPanel Orientation="Horizontal" >
                        <TextBox Width="60" Text="{Binding Path=Name}"/>
                        <TextBox Width="60" Text="{Binding Path=ID}"/>
                        <TextBox Width="60" Text="{Binding Path=Age}"/>
                    </StackPanel >
                </DataTemplate >
            </ListBox.ItemTemplate >
        </ListBox >

上例是将listbox做为实例来作展现，在一个listbox控件中为了显示多行和多列数据，使用ItemTemplate进行构造。资源

WPF中的style：style，样式风格的意思，简单来讲就是对属性值的批处理，在实际使用过程当中帮助很是大。开发

参考代码：

<Window.Resources >
        <ResourceDictionary >
            <Style x:Key="dgButton" TargetType="Button" >
                <Setter Property="Background" Value="Blue" />
                <Setter Property="FontSize" Value="20"/>
            </Style >
            <Style x:Key="cb" TargetType="CheckBox" >
                <Style.Triggers >
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="FontSize" Value=" 40"/>
                        <Setter Property="Foreground" Value="Red" />
                    </Trigger >
                </Style.Triggers >
            </Style >
        </ResourceDictionary >
    </Window.Resources >

调用方式：

上述代码有两个组成部分：

1 设置button的的背景色和字体大小，说到底也是对button的属性进行批量处理。固然在实际使用button控件时也可单独使用，此处只是便于处理。

2 设置checkbox的触发器，当对check进行选择是，字体和背景色都会作出改变。

总结：在项目开发过程当中，常常使用的也就是这些了，若是有更为特殊需求，那就须要另外寻求方案处理了。

add in 2014\9\10

作WPF项目，在界面排版时，每每由于分辨率的不一样而致使这样那样的问题，此处添加一个框架，适应于不一样的分辨率的开发机。

</Grid>
</Canvas>
</Viewbox>
</DockPanel>

虽然简单却很是实用。

add in 2014\11\11

wpf控件引用UI设计好的样式：

<Button Content="Button" Margin="0,8,8,0" VerticalAlignment="Top" Style="{DynamicResource closeButtonStyle}" Height="17.598"  Width="17.598" Click="Button_Click" />

在界面中必需添加引用：

<Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/StyleLibrary;component/ResourceDictionary.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>

由于界面是window界面，因此是Window.Resource,若是是page则Page.Resources。

如何使引用的其余项目中的控件资源，则应该在App.xaml中添加例如：

<Application.Resources>
        <ResourceDictionary >
            <ResourceDictionary.MergedDictionaries >
                <ResourceDictionary Source="/MonitorStyleLibrary;component/ResourceDictionary1.xaml"></ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>

项目中的控件直接引用资源名称便可：

<Button Content="登陆" Height="245" Style="{StaticResource logobtn}" HorizontalAlignment="Left" Margin="771,445,0,0" Name="btnLogin" Width="288" FontSize="40" Click="btnLogin_Click" />