《深入浅出WPF》3.0 XAML语法

目录

• 属性
• WindowsResources资源
• Converter 强制类型转换
• 属性元素
• LinearGradientBrush线性渐变画刷
• RadialGradientBrush 径向渐变画刷
• 对齐属性
• 标记扩展
• 事件处理器与代码后置
• x:Code标签
• 导入程序集和引用其中的命名空间
• 注释
• Margin
• 绑定
  • 绑定的模式

属性

Grid.ColumnSpan 代表所占用的列数

   <Grid Background="LightSlateGray">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="7*"/>
            <ColumnDefinition Width="3*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="33"/>
            <RowDefinition Height="33"/>
            <RowDefinition Height="33"/>
            <RowDefinition Height="40"/>
        </Grid.RowDefinitions>
        <TextBox x:Name="textbox1" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Margin="5"/>
        <TextBox x:Name="textbox2" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" Margin="5"/>
        <TextBox x:Name="textbox3" Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="1" Margin="5"/>
        <TextBox x:Name="textbox4" Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="1" Margin="5"/>
        <Button x:Name="button1" Grid.Column="0" Grid.Row="3" Grid.ColumnSpan="2" Margin="5">
            <Image Source="/Images/P0009.PNG" Width="23" Height="23"/>
        </Button>
    </Grid>

布局方式2

    <StackPanel Background="LightBlue">
        <TextBox x:Name="textbox1" Margin="5"/>
        <TextBox x:Name="textbox2" Margin="5"/>
        <StackPanel Orientation="Horizontal">
            <TextBox x:Name="textbox3" Width="140" Margin="5"/>
            <TextBox x:Name="textbox4" Width="120" Margin="5"/>
        </StackPanel>
        <Button x:Name="button1" Content="button1" Margin="5" Width="100" Height="40"/>
    </StackPanel>

WindowsResources资源

申明：

  <Window.Resources>
        <local:Human x:Key="human" Child="ABC" ></local:Human>
        <!--强制类型转换                                   -->
  </Window.Resources>

C#代码中查找资源

 Human h = (Human)this.FindResource("human");

Converter 强制类型转换

注意TypeConverter的使用

1、声明类使用的类型转换器名称

要放在MainWindow同一级别下

下面的示例声明 Human使用名为 StringToHumanTypeConverter的类型转换器。 实现转换器（StringToHumanTypeConverter）的类必须继承自 TypeConverter 类。

    [TypeConverter(typeof(StringToHumanTypeConverter))]
    public class Human
    {
        public string Name { get; set; }
        public Human Child { get; set; }
    }

2、编写类型转换器

用于转换的类必须继承自 TypeConverter。 使用 ConverterTypeName 属性可获取为此特性所绑定到的对象提供数据转换的类的名称。

使用的时候，XAML设计器可能会在VS2017中报错，清理解决方案，重新生成即可，以下代码使用时在VS2017中界面设计器会报错，可忽略

    public class StringToHumanTypeConverter : TypeConverter
    {
        public override bool CanConvertFrom(ITypeDescriptorContext context, Type sourceType)//增加这个函数的描述，UI就不会报错了
        {
            if (sourceType == typeof(string))
            {
                return true;
            }
            else
            {
                return base.CanConvertFrom(context, sourceType);
            }
        }
        public override object ConvertFrom(ITypeDescriptorContext context, CultureInfo culture, object value)
        {
            if (value is string)
            {
                Human h = new Human();
                h.Name = value as string;
                return h;
            }
            return base.ConvertFrom(context, culture, value);
        }
    }

<Window x:Class="WpfApp1.WindowRectangle"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="WindowRectangle" Height="450" Width="800">
    <Grid VerticalAlignment="Center" HorizontalAlignment="Center">
        <!--<Rectangle x:Name="rectangle" Width="200" Height="120" Fill="Blue"></Rectangle>-->
        <Button Click="Button1_Click" Content="OK" Width="200" Height="120"></Button>
    </Grid>
    <Window.Resources>
        <local:Human x:Key="human" Child="ABC" ></local:Human>
        <!--强制类型转换                                   -->
    </Window.Resources>
</Window>

3、使用

privoid Function()
{
	#region UI获取
    Human h = (Human)this.FindResource("human");
	#endregion

    #region 方式1
    //Human h = new Human();
    //object vy = "rrt";
    //h.Child = (Human)TypeDescriptor.GetConverter(typeof(Human)).ConvertFrom(vy);
    #endregion

    #region 方式2
    //Human h = new Human();
    //object vy = "rrt";
    //StringToHuman stringToHuman1 = new StringToHuman();
    //h.Child = (Human)stringToHuman1.ConvertFrom(vy);
    #endregion

    MessageBox.Show(h.Child.name);
}

属性元素

内容：非空标签都有自己的内容 （Content）

标签内容：夹起始标签和结束标签中的内容

元素：子级标签是父级标签的一个元素

属性元素：以标签（元素）的形式描述属性

<起始标签>标签内容</结束标签>
<父级标签>
    <子级标签1>     </子级标签1>
    <子级标签2>     </子级标签2>
</父级标签>

<className>
    <className.PropertyName>
        <!--以对象形式为属性赋值   -->
    </className.PropertyName>
</className>

LinearGradientBrush线性渐变画刷

点位是按照百分比计算的，1代表100%，0代表原点

使用沿直线（渐变轴）定义的渐变绘制区域，使用对象指定渐变的颜色及其在渐变轴上的位置 GradientStop 。 还可以修改渐变轴，从而能够创建水平和垂直渐变以及反转渐变方向

1、设置相对起始点和终点，

2、设置偏移点的颜色，偏移点是相对于起始点和终点的连线来说的

<Rectangle x:Name="Rectangle1" Width="300" Height="300">
    <Rectangle.Fill>
        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
            <LinearGradientBrush.GradientStops>
                <GradientStop Offset="0.2" Color="LightBlue"/>
                <GradientStop Offset="0.7" Color="Blue"/>
                <GradientStop Offset="0.8" Color="Red"/>
                <GradientStop Offset="1.0" Color="DarkBlue"/>
            </LinearGradientBrush.GradientStops>
        </LinearGradientBrush>
    </Rectangle.Fill>
</Rectangle>

RadialGradientBrush 径向渐变画刷

使用比例坐标系

RadialGradientBrush主要有三个属性:

Center:默认为(0.5,0.5)圆的中央,渐变的开始点

RadiusY:画笔的Y轴半径的比例

RadiusX:画笔的X轴半径的比例

GradientOrigin:单词直译为渐变原点,它主要负责渐变的偏移,一般情况下保持Center不变,然后改变此值

<RadialGradientBrush GradientOrigin="0.25,0.25" RadiusX="0.5" RadiusY="0.5">
    <RadialGradientBrush.GradientStops>
        <GradientStop Color="Yellow" Offset="0"/>
        <GradientStop Color="Red" Offset="0.65"/>
        <GradientStop Color="White" Offset="0.8"/>
    </RadialGradientBrush.GradientStops>
</RadialGradientBrush>

对齐属性

HorizontalAlignment 水平对齐

VertialAlignment 垂直对齐

<Grid VerticalAlignment="Center" HorizontalAlignment="Center"/>

标记扩展

标记扩展：将一个对象的属性赋值给另一个对象。简单来说就是特殊的赋值语句 例：Attribute =Value 语法，特殊处就在于Value是用花括号{}描述的内容。

ElementName 对象名称， 对象的数据类型名是紧邻左花括号的字符串

Path 对象属性，对象的属性由一串以逗号连接的子字符串负责初始化

Mode 代表数据的流向，OneWay（常规数据流）：数据来源是一个数据集合，目标是一个控件元素。

    <StackPanel Background="LightSlateGray" >
        <TextBox Text="{Binding ElementName=slider1 ,Path=Value,Mode=OneWay}" Margin="5"/>
        <Slider x:Name="slider1" Margin="5"/>
    </StackPanel>

Text="{Binding ElementName=slider1 ,Path=Value,Mode=OneWay}

适用范围：MrkupExtension 类的派生类

注意事项：嵌套、简写、省略Extension

注意事项1：标记扩展是可以嵌套使用

Text="{Binding Source={StaticResource myDataSource},Path=PersonName}"

注意事项2：标记扩展有简写，{Binding Value，....}和{Binding Path=Value,....}等效

注意事项3：标记扩展类的类名以Extension结束的，可以省略不写。Text="{x:Static....}"和Text="{x:StaticExtension....}"等效

事件处理器与代码后置

代码后置：逻辑代码与UI代码分离、隐藏在UI代码后面。

代码后置原因：.net支持Partial类，并能够将解析XAML中的x:Calss所指定的类进行合并。

注意事项1：实现逻辑功能的代码都要放在后置的C#文件中，包含事件处理器

注意事项2：后置代码的命名默认为[XAML文件名.cs]，可以进行修改，只要XAML解析器能找到x:Class所指定的类

        <Button x:Name="Button1" Content="button1" Click="Button1_Click" Background="Red"/>

x:Code标签

作用：将后置代码放置到XAML文件中

    <Grid>
        <Button x:Name="button1" Content="OK" Click="Button1_Click" Margin="5"/>  
    </Grid>
    <x:Code>
        <![CDATA[
            private void Button1_Click(object sender,RoutedEventArgs e)
            {
                MessageBox.Show("OK");
            }   
            ]]>
    </x:Code>

导入程序集和引用其中的命名空间

语法：xmlns:映射名=“clr-namespace:命名空间；assembly=类库文件名”

引用

xmlns:Class1="clr-namespace:ClassLibrary1;assembly=ClassLibrary1"

使用

    <Grid>
        <Class1:UserControl1></Class1:UserControl1>
    </Grid>

C#也可以使用映射名

using com=common;

注释

注意事项1：注释不能嵌套

注意事项2：注释只能出现在标签的内容区域，只能出现在起始标签和结束标签之间。

<!--需要注释的内容-->

Margin

Margin属性，其中一个参数代表和左上右下四个方向的距离是这个值，4个参数则分别代表到左上右下的距离。

<TextBox Text="3333" Grid.Row="2" Margin="5,6,7,8"/>

绑定

WPF中的绑定完成了绑定源和绑定目标的联动。一个绑定常常由四部分组成：绑定源、路径、绑定目标及目标属性，同时转换器也是一个非常重要的组成

绑定的模式

绑定的模式：Binding 的数据流方向
默认情况下，数据既能通过Binding送达目标，也能够从目标返回源。控制Binding数据流向的属性是Mode,它的类型是BindingMode,枚举为 TowWay ,OneWay,OnTime、OneWayToSource和Default。
OneWay（常规数据流）：数据来源是一个数据集合，目标是一个控件元素。
TowWay：数据来源和目标任意发生改变时都更新数据来源和目标。