zoukankan      html  css  js  c++  java
  • WPF ControlTemplate,DataTemplate

    The Control Template defines the visual appearance of a control. All of the UI elements have some kind of appearance as well as behavior, e.g., Button has an appearance and behavior. Click event or mouse hover event are the behaviors which are fired in response to a click and hover and there is also a default appearance of button which can be changed by the Control template.

    <Window.Resources>
    <ControlTemplate x:Key="ButtonTemplate" TargetType="Button">
    <Grid>
    <Ellipse x:Name="ButtonEllipse" Height="300" Width="1350">
    <Ellipse.Fill>
    <LinearGradientBrush StartPoint="0,0.2" EndPoint="0.2,1.4">
    <GradientStop Offset="0" Color="Red"/>
    <GradientStop Offset="1" Color="Orange"/>
    </LinearGradientBrush>
    </Ellipse.Fill>
    </Ellipse>
    <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>

    <ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
    <Setter TargetName="ButtonEllipse" Property="Fill">
    <Setter.Value>
    <LinearGradientBrush StartPoint="0,0.2" EndPoint="0.2,1.4">
    <GradientStop Offset="0" Color="YellowGreen"/>
    <GradientStop Offset="1" Color="Gold"/>
    </LinearGradientBrush>
    </Setter.Value>
    </Setter>
    </Trigger>

    <Trigger Property="IsPressed" Value="True">
    <Setter Property="RenderTransform">
    <Setter.Value>
    <ScaleTransform ScaleX="0.8" ScaleY="0.8" CenterX="0" CenterY="0"/>
    </Setter.Value>
    </Setter>
    <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
    </Trigger>
    </ControlTemplate.Triggers>
    </ControlTemplate>
    </Window.Resources>
    <StackPanel>
    <Button Content="Round Button!" Template="{StaticResource ButtonTemplate}" Width="350" Margin="50"/>
    <Button Content="Default Button!" Height="40" Width="150" Margin="5"/>
    </StackPanel>

      

    Data Template

    A Data Template defines and specifies the appearance and structure of a collection of data. It provides the flexibility to format and define the presentation of the data on any UI element. It is mostly used on data related Item controls such as ComboBox, ListBox, etc.

    <Window.Resources>
    <DataTemplate DataType="{x:Type local:Person}">
    <Grid>
    <Grid.RowDefinitions>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto"/>
    <ColumnDefinition Width="200"/>
    </Grid.ColumnDefinitions>

    <Label Name="nameLabel" Margin="10"/>
    <TextBox Name="nameText" Grid.Column="1" Margin="10" Text="{Binding Name}"/>
    <Label Name="ageLabel" Margin="10" Grid.Row="1"/>
    <TextBox Name="ageText" Grid.Column="1" Grid.Row="1" Margin="10" Text="{Binding Age}"/>
    </Grid>
    </DataTemplate>
    </Window.Resources>
    <Grid>
    <Grid.RowDefinitions>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <ListBox ItemsSource="{Binding}"/>
    <StackPanel Grid.Row="1">
    <Button Content="Show..." Click="Button_Click" Width="80" HorizontalAlignment="Left" Margin="10"/>
    </StackPanel>
    </Grid>
    </Window>

    public partial class MainWindow : Window
    {
    Person person = new Person { Name = "Ali", Age = 27 };
    List<Person> personList = new List<Person>();
    public MainWindow()
    {
    InitializeComponent();
    personList.Add(person);
    personList.Add(new Person { Name = "Mike", Age = 62 });
    personList.Add(new Person { Name = "Brian", Age = 12 });
    this.DataContext = personList;
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
    string message = person.Name + " is " + person.Age;
    MessageBox.Show(message);
    }
    }

    public class Person
    {
    private string nameValue;
    public string Name
    {
    get
    {
    return nameValue;
    }
    set
    {
    nameValue = value;
    }
    }

    private double ageValue;
    public double Age
    {
    get
    {
    return ageValue;
    }

    set
    {
    if(value!=ageValue)
    {
    ageValue = value;
    }
    }
    }
    }

  • 相关阅读:
    7个技巧,帮你完美搞定网页首图设计(必看)
    听说你想跳槽?ARM和PowerPC分析,你知道吗?(速进)
    C语言必学7大步骤!(必看)
    单片机电机必不可少的30条常识!你知道吗?(欢迎大家进行补充)
    单片机外围电路设计攻略(终结版)! 不看哭一年!
    3天”速成“嵌入式之后,我明白了六件事!!!
    前端就不需要掌握算法与数据结构?
    嵌入式软件必学知识总结!
    字节跳动2017客户端工程师实习生笔试题-第四题
    并查集
  • 原文地址:https://www.cnblogs.com/Fred1987/p/5939946.html
Copyright © 2011-2022 走看看