WPF学习笔记——认识XAML
Extensible Application Markup Language,XAML是一种声明性标记语言。
一、XAML语法概述
1,与XML类似,用尖括号标记元素
<StackPanel> <Button Content="Click Me"/> </StackPanel>
2,特性语法(属性)
<Button Background="Blue" Foreground="Red" Content="This is a button"/>
3,属性元素
<Button> <Button.Background> <SolidColorBrush Color="Blue"/> </Button.Background> <Button.Foreground> <SolidColorBrush Color="Red"/> </Button.Foreground> <Button.Content> This is a button </Button.Content> </Button>
属性元素丰富了元素的属性,属性元素开始标记的语法为 <类型名称.属性名称>
4,集合语法
属性元素的值支持集合元素
<LinearGradientBrush> <LinearGradientBrush.GradientStops> <!-- no explicit new GradientStopCollection, parser knows how to find or create --> <GradientStop Offset="0.0" Color="Red" /> <GradientStop Offset="1.0" Color="Blue" /> </LinearGradientBrush.GradientStops> </LinearGradientBrush>
5,内容属性(?)
<Border> <TextBox Width="300"/> </Border> <!--explicit equivalent--> <Border> <Border.Child> <TextBox Width="300"/> </Border.Child> </Border>
6,文本内容
有少量 XAML 元素可直接将文本作为其内容来处理。 若要实现此功能,必须满足以下条件之一: 类必须声明一个内容属性,并且该内容属性必须是可赋值给字符串的类型(该类型可以是 Object)。 例如,任何 ContentControl 都将 Content 用作其内容属性,并且其类型为 Object,这样就支持实际的 ContentControl(例如,Button)上的如下用法:<Button>Hello</Button>。 类型必须声明一个类型转换器,该类型转换器将文本内容用作其初始化文本。 例如,<Brush>Blue</Brush>。 这种情况实际上并不常见。 类型必须为已知的 XAML 语言基元。
7,内容属性和集合语法的组合(就是我们常见的UI组织形式)
<StackPanel> <Button>First Button</Button> <Button>Second Button</Button> </StackPanel>
-
省略的 StackPanel.Children 属性元素: StackPanel 从 Panel 派生。 Panel 将 Panel.Children 定义为其 XAML 内容属性。
- 省略的 UIElementCollection 对象元素: Panel.Children 属性采用类型 UIElementCollection,该类型实现 IList。 根据处理集合(例如 IList)的 XAML 规则,集合的元素标记可以省略。 (在这种情况下,UIElementCollection 实际无法实例化,因为它没有公开默认构造函数,这就是 UIElementCollection 对象元素以注释形式出现的原因。
<StackPanel> <StackPanel.Children> <!--<UIElementCollection>--> <Button>First Button</Button> <Button>Second Button</Button> <!--</UIElementCollection>--> </StackPanel.Children> </StackPanel>
8,特性语法(事件)
特性语法还可用于事件成员,而不仅限于属性成员。 在这种情况下,特性的名称为事件的名称。 在 XAML 事件的 WPF 实现中,特性的值是实现该事件的委托的处理程序的名称。
<Button Click="Button_Click" >Click Me!</Button>
二、标记扩展
标记扩展是一个 XAML 语言概念。 当用于提供特性语法的值时,大括号({ 和 })表示标记扩展用法。 此用法指示 XAML 处理系统不要像通常那样将特性值视为一个文本字符串或者可转换为字符串的值。
常用标记扩展: Binding(用于数据绑定表达式)以及资源引用 StaticResource 和 DynamicResource
以下面的代码为例,Style的值是一个Style类型的实例,实例名称是Page.Resources里Sytle的Key。引用了特定的标记扩展 StaticResource。 当处理该标记扩展时,它返回对以前在资源字典中作为键控资源进行实例化的某个样式的引用。
<Page.Resources> <SolidColorBrush x:Key="MyBrush" Color="Gold"/> <Style TargetType="Border" x:Key="PageBackground"> <Setter Property="Background" Value="Blue"/> </Style> ... </Page.Resources> <StackPanel> <Border Style="{StaticResource PageBackground}"> ... </Border> </StackPanel>
三、类型转换器
下面额Margin之所以可以这么写,是因为有类型转换器。
<Button Margin="10,20,10,30" Content="Click me"/>
下面是更详细的语法
<Button Content="Click me"> <Button.Margin> <Thickness Left="10" Top="20" Right="10" Bottom="30"/> </Button.Margin> </Button>
怎么实现的呢?Thickness 结构是一个类型示例,该类型拥有可使用 XAML 的类型转换。 通过对 Thickness 设置类型转换器,所有使用 Thickness 的属性都可以更容易地在 XAML 中指定。
四、命名空间——前缀
前缀 x: 用于映射 XAML 命名空间 http://schemas.microsoft.com/winfx/2006/xaml,该命名空间是支持 XAML 语言构造的专用 XAML 命名空间。 在这整个 SDK 的项目模板、示例以及文档中,此 x: 前缀用于映射该 XAML 命名空间。 XAML 语言的 XAML 命名空间包含多个将在 XAML 中频繁用到的编程构造。 下面列出了将用到的最常见的 x: 前缀编程构造:
-
x:Key:为 ResourceDictionary(或其他框架中的类似字典概念)中的每个资源设置唯一的键。 在典型的 WPF 应用程序标记中的所有 x: 用法中,x:Key 将可能占到 90%。
-
x:Class:向为 XAML 页提供代码隐藏的类指定 CLR 命名空间和类名。 必须具有这样一个类才能支持每个 WPF 编程模型的代码隐藏,而正是因此,即使没有资源,也几乎总是能看到映射的 x:。
-
x:Name:处理对象元素后,为运行时代码中存在的实例指定运行时对象名称。 通常,您将为 x:Name 经常使用 WPF 定义的等效属性。 此类属性特定映射到 CLR 后备属性,因此更便于进行应用程序编程,在应用程序编程中,您经常使用运行时代码从初始化的 XAML 中查找命名元素。 最常见的此类属性是 FrameworkElement.Name。 在特定类型中不支持等效的 WPF 框架级 Name 属性时,仍然可以使用 x:Name。 某些动画方案中会发生这种情况。
-
x:Static:启用一个返回静态值的引用,该静态值只能是一个 XAML 兼容属性。
-
x:Type:根据类型名称构造一个 Type 引用。 它用于指定采用 Type(例如 Style.TargetType)的特性,但属性经常具有本机的字符串到 Type 的转换功能,因此使用 x:Type 标记扩展用法是可选的。
- 自定义前缀,对于自定义程序集可以使用自定义前缀(原理还不明白?)
- <Page
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:custom="clr-namespace:NumericUpDownCustomControl;assembly=CustomLibrary" > <StackPanel Name="LayoutRoot"> <custom:NumericUpDown Name="numericCtrl1" Width="100" Height="60"/> ... </StackPanel> </Page>