WPF探究【一】

柔光的暖阳◎ 2024-04-01 13:08 82阅读 0赞

#### 文章目录 ####

*  WPF的概述：
 *  控件分类
 *  XAML
 *   *  对象元素语法
     *  XAML根元素
     *  WPF和XAML命名空间声明
 *  控件
 *   *  Lablel
     *   *  示例
     *  继承关系
     *  TextBlock
     *  button
     *  Border

## WPF的概述： ##

*  WindowsPresentationFoundation（简称WPF）
 *  WPF的核心是一个与分辩率无关且基于实量的呈现引擎，自在充分利用现代图形硬件。WPF通过一套完善的应用程序开发功能对该核心进行了扩展，这些功能包括可扩展应用程序标记语言（XAML）、控件、数据绑定、布局、二维和三维图形、动画、样式、模板、文档、媒体、文本和版式。WPF属于.NET，因此可以生成整合.NETAPI其他元素的应用程序。
 *  简介：
    
     *  Windows用户界面框架统一的编程模型、语言和框架，做到了界面设计与后端升发分离。
 *  特点：
    
    1.  呈现效果不受分解率的影响。
    2.  基于Directx3d技术，可以做出炫酷的界面。
    3.  提供UI框架，集成了失量图形、流动文字支持、3d视觉效果和控件模型框架。
    4.  UI与业务逻辑彻底分离。
    5.  UI-XAML描述（底层wpf引擎是把元素解释成对应的对象。
    6.  基于数据驱动、数据是核心。

## 控件分类 ##

*  System.Windows.Controls

<table> 
 <thead> 
  <tr> 
   <th>Label（表示控件的文本标签，并提供访问密钥支持。）</th> 
   <th>TextBox（显示或编辑无格式文本）</th> 
   <th>TextBlock（一个轻型控件用于显示少量流内容）</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>Border（边框控件，作用:在另一个元素四周绘制边框和/或背景）</td> 
   <td>Button（按钮控件）</td> 
   <td>Calendar（日历控件）</td> 
  </tr> 
  <tr> 
   <td>CheckBox（选择框）</td> 
   <td>ComboBox（下拉框）</td> 
   <td>Image（图片控件）</td> 
  </tr> 
  <tr> 
   <td>Menu（菜单）</td> 
   <td>ContextMenu（内容菜单）</td> 
   <td>RadioButton（表示可由用户选择但不能清除的按钮代码能清除）</td> 
  </tr> 
  <tr> 
   <td>DataGrid（数据网格-Table）</td> 
   <td>ListBox（包含可选项列表）</td> 
   <td>Listview（表示用于显示数据项列表的控件</td> 
  </tr> 
 </tbody> 
</table>

## XAML ##

*  XML是一种声明性标记语言应用于.NET Core编程模型时,XAML简化了为.NET Core应用创建UI的过程。
 *  XAML文件是通常具有.xaml扩展名的XML文件。
 *  可通过任何XML编码对文件进行编码，但通常以UTF-8编码。

### 对象元素语法 ###

*  对象元素语法是XAML标记语法，它通过声明XML元素来实例化CLR类或结构。此语法类似于其他标记语言（如HTML）的元素语法
 *  单标签格式。`<markName/>`
 *  双标签格式。`<markName>...</markName>`

### XAML根元素 ###

*  一个XAML文件只能有一个根元素，这样才能同时作为格式正确的XML文件和有效的XAML文件。对于典型WPF方案，可使用在WPF应用模型中具有突出意义的根元素（例如，页面的Window或Page）
 *  在根标签下面有且只能有一个二级标签。在二级标签里面我们可以写多个三级四级标签。

### WPF和XAML命名空间声明 ###

*  在许多XAML文件的根标记中的命名空间声明内，通常可看到**两个XML命名空间声明**。
 *  ***第一个声明默认映射整个WPF客户端/框架XAML命名空间***：`xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation`  
    ***第二个声明映射单独的XAML命名空间，（通常）将其映射到x：前缀***`xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml`
 *  这些声明之间的关系是x：前缀映射支持作为xaml语言定义一部分的内部函数，而WPF是一种将xaml用作语言的实现，并为xaml定义了其对象的词汇。

## 控件 ##

### Lablel ###

命名空间：`System.Windows.Controls`  
程序集：`PresentationFramework.dll`  
表示控件的文本标签，并提供访问密钥支持

[System.Windows.Localizability（System.Windows.LocalizationCategory.Label）]
    public classLabel：System.Windous.Controls.ContentControl

继承Object →DispatcherObject →DependencyObject →Visual→UIElement →FrameworkElement→Control→ContentControl→Label  
属性`LocalizabilityAttribute`

#### 示例 ####

以下示例演示如何创建一个Label使用绑定来设置目标

### 继承关系 ###

![在这里插入图片描述][27455f78ce0c422595d086ab97008a34.png]

*  对象：System.Windows.FrameworkElement
 *  属性

<table> 
 <thead> 
  <tr> 
   <th>属性名</th> 
   <th>对象类型</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>Width</td> 
   <td>double</td> 
   <td>获取或设置元素的宽度。</td> 
  </tr> 
  <tr> 
   <td>Height</td> 
   <td>double</td> 
   <td>获取或设置元素的高度。</td> 
  </tr> 
  <tr> 
   <td>Actualwidth</td> 
   <td>double</td> 
   <td>获取此元素的呈现的宽度</td> 
  </tr> 
  <tr> 
   <td>ActualHeight</td> 
   <td>double</td> 
   <td>获取此元素的呈现的高度</td> 
  </tr> 
  <tr> 
   <td>Name</td> 
   <td>string</td> 
   <td>获取或设置元素的标识名称。该名称提供引用，以便代码隐藏（如事件处理程序代码）可以引用标记元素（在XAML处理器的处理过程中构造该元素之后）。</td> 
  </tr> 
  <tr> 
   <td>Style</td> 
   <td>Style</td> 
   <td>获取或设置此元素呈现时所使用的样式</td> 
  </tr> 
  <tr> 
   <td>Margin</td> 
   <td>Thickness</td> 
   <td>获取或设置元素的外边距。</td> 
  </tr> 
  <tr> 
   <td>HorizontalAlianment</td> 
   <td>HorizontalAlignment</td> 
   <td>获取或设置在父元素（如Panel或项控件）中组合此元素时所应用的水平对齐特征。【水平对齐设置，它是一个枚举值。）</td> 
  </tr> 
  <tr> 
   <td>FocusVisualstyle</td> 
   <td>Style</td> 
   <td>获取或设置一个属性，该属性允许自定义此元素在捕获到键盘焦点时要应用于此元素的外观、效果或其他样式特征</td> 
  </tr> 
  <tr> 
   <td>FlowDirection</td> 
   <td>FlowDirection</td> 
   <td>获取或设置方向，文本和其他用户界面（U1元素在任何控制其布局的父元素中都按此方向流动。</td> 
  </tr> 
  <tr> 
   <td>object</td> 
   <td>DataContext</td> 
   <td>获取或设置元素参与数据绑定时的数据上下文。</td> 
  </tr> 
 </tbody> 
</table>

*  方法

<table> 
 <thead> 
  <tr> 
   <th>方法名</th> 
   <th>参数</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>BningintoView</td> 
   <td></td> 
   <td>尝试将此元素放入视图，它包含在任何可滚动区域内。</td> 
  </tr> 
  <tr> 
   <td>BringintoView(Rect targetRectangle）</td> 
   <td>指定也放入视图的元素的大小。</td> 
   <td>尝试将放入视图，它包含在任何可滚动区域内的此元素提供的区域大小</td> 
  </tr> 
  <tr> 
   <td>FindName(string name)</td> 
   <td>所请求元素的名称（name）</td> 
   <td>查找具有提供的标识符名的元素</td> 
  </tr> 
  <tr> 
   <td>FindResource(object resourceKey）</td> 
   <td>所请求的资源键标（resourcekey）</td> 
   <td>搜索具有指定键的资源并在引发异常，如果找不到所请求的资源。</td> 
  </tr> 
 </tbody> 
</table>

*  事件

<table> 
 <thead> 
  <tr> 
   <th>事件名称</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>Loaded</td> 
   <td>当对元素进行布局、呈现，且可将其用于交互时发生。</td> 
  </tr> 
  <tr> 
   <td>KeyDown</td> 
   <td>当焦点在该元素上时按下某个键后发生</td> 
  </tr> 
  <tr> 
   <td>GotFocus</td> 
   <td>在此元素获得逻辑焦点时发生</td> 
  </tr> 
  <tr> 
   <td>MouseDown</td> 
   <td></td> 
  </tr> 
  <tr> 
   <td>MouseMove</td> 
   <td>在鼠标指针位于此元素上并且移动鼠标指针时发生。</td> 
  </tr> 
  <tr> 
   <td>Click</td> 
   <td>控件的点击事件</td> 
  </tr> 
 </tbody> 
</table>

### TextBlock ###

<Window x:Class="wpf1.WindowTextBlock"
            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:wpf1"
            mc:Ignorable="d"
            Title="WindowTextBlock" Height="450" Width="800">
        <Grid>
            
            <TextBlock Text="我是Text Block" FontSize="20" FontWeight="Light" Foreground="Red">
                我是文本一<LineBreak/>
                我是文本二<Hyperlink/>
                我是文本三<LineBreak/>
            </TextBlock>
        </Grid>
    </Window>

![在这里插入图片描述][e24be885aca44c079038c1df6809eabb.png]

### button ###

<Window x:Class="wpf1.WindowButtton"
            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:wpf1"
            mc:Ignorable="d"
            Title="WindowButton" Height="450" Width="800">
        <Grid>
            
            <Button Width="100" Height="30" HorizontalAlignment="Left" VerticalAlignment="Top" 
                    Content="我是按钮1" Margin="20,20,0,0" Background="Teal"
                    BorderBrush="Transparent" Foreground="White" Click="Button_Click_1"
                    MouseMove="Button_MouseMove"></Button>
            <Button Width="100" Height="30" HorizontalAlignment="Left" VerticalAlignment="Top" 
                    Content="我是按钮1" Margin="160,20,0,0" Background="Teal"
                    BorderBrush="Transparent" Foreground="White" Click="Button_Click_2"
                    ></Button>
            <Button Background="Teal" Width="150" Height="30" Margin="300,20,0,0" 
                    HorizontalAlignment="Left" VerticalAlignment="Top"
                    Content="右击检查快捷菜单" Foreground="White">
                <Button.ContextMenu>
                    <ContextMenu>
                        <MenuItem Header="子菜单1">快捷菜单项1</MenuItem>
                        <MenuItem Header="子菜单2">快捷菜单项2</MenuItem>
                    </ContextMenu>
                </Button.ContextMenu>
            </Button>
        </Grid>
    </Window>

namespace wpf1
    {
        
        /// <summary>
        /// WindowButtton.xaml 的交互逻辑
        /// </summary>
        public partial class WindowButtton : Window
        {
        
            public WindowButtton()
            {
        
                InitializeComponent();
            }
    
            private void Button_Click_2(object sender, RoutedEventArgs e)
            {
        
                MessageBox.Show("按钮被点击了");
            }
    
            private void Button_MouseMove(object sender, MouseEventArgs e)
            {
        
                MessageBox.Show("鼠标移到了按钮上！");
            }
    
            private void Button_Click_1(object sender, RoutedEventArgs e)
            {
        
    
            }
        }
    }

![在这里插入图片描述][fc503b03d1354f318529068020ff9765.gif_pic_center]

### Border ###

*  System.Windows.Controls.Border继承自Decorator类
 *  在另一个元素四周绘制边框/背景。
 *  ***若要显示多个子元素只能有一个孩子。，需要在父Border元素中放置一个附加Panel元素。然后，Border可以将子元素放置在该Panel元素中。由grid是继承Panel，所以在Border中添加Grid即可***  
    ![在这里插入图片描述][76f0c2f6fea54ae194424abb2aff78f5.png]
 *  ***如果要在内容周围显示边框则必须将元素放置在父Border元素中。***
 *  CornerRadius获取或设置一个值，该值表示将border的角倒圆的程度。

<Window x:Class="wpf1.WindowBorder"
            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:wpf1"
            mc:Ignorable="d"
            Title="WindowBorder" Height="450" Width="800">
        <Grid>
            
            <Border Background="LightBlue" 
                    BorderBrush="red" BorderThickness="2" Margin="300,186,240,130">
                <Grid Margin="0,0,0,19">
                    <Label
                       Foreground="Blue" FontSize="20" FontFamily="楷体" Margin="86,27,0,0">
                        Labler内容1
                    </Label>
                    <Label 
                       Foreground="Blue" FontSize="20" FontFamily="楷体" Margin="0,1,38,-1">
                        Labler内容2
                    </Label>
                </Grid>
            </Border>
            <Border BorderBrush="Black" BorderThickness="2" Margin="0,186,595,169"
                    Background="LightBlue" CornerRadius="50">
                <Button Background="Transparent" FontSize="20" Content="测试按钮" Foreground="BlueViolet"
                        Click="Button_Click" BorderBrush="Transparent"></Button>
            </Border>
        </Grid>
    </Window>

namespace wpf1
    {
        
        /// <summary>
        /// WindowBorder.xaml 的交互逻辑
        /// </summary>
        public partial class WindowBorder : Window
        {
        
            public WindowBorder()
            {
        
                InitializeComponent();
            }
    
            private void Button_Click(object sender, RoutedEventArgs e)
            {
        
                MessageBox.Show("成功测试按钮");
            }
        }
    }

![在这里插入图片描述][a2d4293a7bd74f199e3622611045b743.gif_pic_center]

[27455f78ce0c422595d086ab97008a34.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/6c0a46e92a8347d3bfc0eac260d4fc02.png
[e24be885aca44c079038c1df6809eabb.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/37541b4009be4f128be55d90e13cf677.png
[fc503b03d1354f318529068020ff9765.gif_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/d654d30608084333867d440f2dbaf10b.gif
[76f0c2f6fea54ae194424abb2aff78f5.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/1025ace2b2a24de789184bde6f73a359.png
[a2d4293a7bd74f199e3622611045b743.gif_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/78c11ebdc9064d809e7e447702f855a9.gif