WPF入门指南(1)

微软官方控件参考文档连接地址

WPF的控件总结

根据用途对控件进行分类

1. 基础输入控件

控件名称 主要用途 示例场景
TextBox 单行文本输入 用户名、搜索框
PasswordBox 密码输入(自动掩码) 登录密码输入
RichTextBox 富文本编辑(带格式) 文档编辑器
CheckBox 布尔值选择(可多选) "记住我"选项
RadioButton 单选选择(需分组) 性别选择
Slider 数值范围选择 音量控制、年龄选择
UniformGrid 自动生成统一行和列
Border 装饰控件,背景/边框 圆角
NumericUpDown 数字输入(需自定义或第三方库) 商品数量选择

2. 选择器控件

控件名称 主要用途 示例场景
ComboBox 下拉单选列表 国家/城市选择
ListBox 平铺单选/多选列表 文件多选
ListView 高级列表(支持列视图) 文件管理器
TreeView 层级数据选择 文件夹导航
DatePicker 日期选择 生日输入
Calendar 可视化日历选择 会议日程安排

3. 数据显示控件

控件名称 主要用途 示例场景
DataGrid 表格数据显示(支持编辑/排序) 员工信息表
ItemsControl 自定义数据项集合展示 动态生成的卡片列表
DataGridTextColumn 在DataGrid中显示文本列 显示产品名称
ToolTip 悬停提示信息 按钮功能说明
StatusBar 底部状态信息展示 显示登录用户信息

4. 命令操作控件

控件名称 主要用途 示例场景
Button 触发命令操作 提交/取消按钮
RepeatButton 按住持续触发的按钮 音量增减按钮
ToggleButton 开关状态按钮 夜间模式切换
ContextMenu 右键上下文菜单 文件右键操作菜单
Menu 顶部菜单栏 主菜单(文件/编辑/帮助)

5. 布局容器控件

控件名称 主要用途 示例场景
Grid 网格布局(最灵活) 表单布局
StackPanel 线性排列(水平/垂直) 工具栏按钮排列
DockPanel 边缘停靠布局 类似IDE的布局
WrapPanel 自动换行布局 标签云
Canvas 绝对坐标定位 绘图画布
ScrollViewer 内容滚动容器 长文本/图片滚动查看
TabControl 多页签容器 设置对话框

6. 内容展示控件

控件名称 主要用途 示例场景
Label 简单文本展示 表单字段标题
TextBlock 格式化文本展示 产品描述(支持换行)
Image 图片展示 用户头像
ProgressBar 进度显示 文件上传进度
MediaElement 音视频播放 视频播放器
Frame 页面导航容器 实现向导式界面

7. 装饰性控件

控件名称 主要用途 示例场景
Border 为控件添加边框 分组框装饰
GroupBox 带标题的分组容器 表单区域分组
Expander 可展开/折叠的面板 高级选项折叠面板
Separator 分隔线 菜单项分组线
Viewbox 内容自动缩放容器 可缩放的LOGO

8. 特殊功能控件

控件名称 主要用途 示例场景
WebBrowser 嵌入网页内容 显示帮助文档HTML
InkCanvas 手写输入/绘图 电子签名板
DataGridTemplateColumn 自定义DataGrid列模板 在表格中嵌入按钮
Popup 浮动弹窗 自定义下拉菜单
Validation.ErrorTemplate 输入验证错误提示 表单验证错误红框提示

分类使用建议

  1. 表单场景Grid + TextBox/ComboBox + Button
  2. 数据展示DataGrid/ListView + Binding
  3. 仪表盘UniformGrid + ProgressBar/Chart(需第三方库)
  4. 导航系统TabControl + TreeView + Frame
  5. 绘图应用Canvas + InkCanvas + Slider(用于画笔粗细)

总结如下

控件名称 作用描述 常用属性 常见用途
Button 触发操作的按钮 Content, Command, Click, IsEnabled, Style 提交表单、触发命令
TextBox 单行文本输入框 Text, MaxLength, IsReadOnly, TextWrapping 用户名、搜索框等输入
TextBlock 显示只读文本 Text, FontSize, Foreground, TextWrapping 标签、说明文字
Label 带有助记符功能的文本标签 Content, Target 为其他控件提供可聚焦的标签
ComboBox 下拉选择框 ItemsSource, SelectedItem, DisplayMemberPath, IsEditable 国家/地区选择、分类选择
ListBox 列表选择框 ItemsSource, SelectedItem, SelectionMode 多选列表、导航菜单
ListView 高级列表控件,支持列视图 ItemsSource, View, SelectedItem, GridView 数据表格展示
DataGrid 功能强大的数据表格 ItemsSource, AutoGenerateColumns, SelectedItem, CanUserAddRows 数据管理、编辑
CheckBox 复选框 IsChecked, Content, ThreeState 选项选择、开关
RadioButton 单选按钮(需分组) IsChecked, Content, GroupName 单项选择(如性别选择)
Slider 滑块控件 Value, Minimum, Maximum, Orientation 音量控制、范围选择
ProgressBar 进度条 Value, Minimum, Maximum, IsIndeterminate 显示操作进度
Image 显示图像 Source, Stretch, Width/Height 显示图标、图片
DatePicker 日期选择器 SelectedDate, DisplayDate, FirstDayOfWeek 生日选择、日期范围
Calendar 日历控件 SelectedDate, DisplayDate, SelectionMode 日期选择、日程安排
TabControl 选项卡容器 Items, SelectedIndex, TabStripPlacement 多页面切换
TreeView 树形结构控件 ItemsSource, SelectedItem, HierarchicalDataTemplate 文件浏览器、分类导航
Menu 菜单栏 Items, MenuItem 应用程序菜单
ToolBar 工具栏 Items, Orientation 快捷操作工具栏
StatusBar 状态栏 Items 显示应用程序状态信息
ScrollViewer 滚动容器 HorizontalScrollBarVisibility, VerticalScrollBarVisibility, Content 内容超出可视区域时提供滚动
Border 边框装饰器 BorderBrush, BorderThickness, CornerRadius, Background 为控件添加边框
Expander 可展开/折叠的面板 Header, IsExpanded, Content 可折叠的内容区域
GroupBox 分组容器 Header, Content 表单分组
DockPanel 停靠布局面板 LastChildFill, Dock(附加属性) 类似WinForms的停靠布局
StackPanel 堆叠布局面板 Orientation, Children 水平或垂直排列控件
WrapPanel 自动换行面板 Orientation, ItemWidth, ItemHeight 标签云、自动换行的控件集合
Canvas 绝对定位面板 Left/Top/Right/Bottom(附加属性) 绘图、自由布局
Grid 网格布局面板(最常用) RowDefinitions, ColumnDefinitions, Row/Column(附加属性) 复杂布局的基础
Frame 页面导航容器 Source, NavigationUIVisibility, JournalOwnership 实现类似Web的页面导航
PasswordBox 密码输入框 Password, MaxLength, PasswordChar 密码输入
RichTextBox 富文本编辑器 Document, IsReadOnly 复杂文本编辑
WebBrowser 嵌入Web内容 Source, Navigate 显示HTML内容

常用通用属性(几乎所有控件都有):

  1. Visibility - 控件可见性(Visible/Collapsed/Hidden)
  2. Width/Height - 宽度/高度
  3. Margin/Padding - 外边距/内边距
  4. HorizontalAlignment/VerticalAlignment - 对齐方式
  5. Background/Foreground - 背景/前景色
  6. FontSize/FontFamily/FontWeight - 字体相关
  7. DataContext - 数据上下文
  8. Style - 样式
  9. ToolTip - 工具提示
  10. IsEnabled - 是否启用

特殊说明:

  1. 内容控件 (如Button、Label等)使用Content属性而非Text
  2. 集合控件 (如ListBox、ComboBox等)使用ItemsSource进行数据绑定
  3. 布局面板既是控件也是容器,可以嵌套使用
  4. 许多属性可以通过附加属性设置(如Grid.Row)

初始WPF

初步了解WPF

WPF全称

WPF全称:Windows Presentation Foundation

WPF的概述

plain 复制代码
1:WPF的核心是一个与分辨率无关且基于矢量的呈现引擎,旨在充分利用现代图形硬件。
2:WPF 通过一套完善的应用程序开发功能对该核心进行了扩展,这些功能包括可扩展
应用程序标记语言(XAML)、控件、数据绑定、布局、二维和三维图形、动画、样式、模
板、文档、媒体、文本和版式。WPF 属于.NET,因此可以生成整合.NET API其他元素的
应用程序。 -- 引用自微软官方文档

简介:Windows用户界面框架,统一的编程模型、语言和框架,做到了界面设计与后端开发分离。

特点

  1. 呈现效果不受分辨率的影响
  2. 基于DirectX 3d技术,可以做出炫酷的界面
  3. 提供UI框架,集成了矢量图形、流动文字支持、3d视觉效果和控件模型框架
  4. UI与业务逻辑彻底分离,UI-XAML描述(底层wpf引擎是把元索解释成对应的对象)
  5. xp server2003到window7及以后的操作系统版本都可以支持
  6. 基于数据驱动,数据是核心

数据驱动UI,数据是核心,处于主动的,UI从属于数据并表达数据,是被动的。WPF中 数据主动,UI被动; 数据第一,控件第二

学习前提

基础:首先我们需要先入门C#/VB

开发工具:Visual Studio 2019/2022

框架环境:.net core 3.1 或者 .net framework4.0+

基础知识点:

数据类型、类型转换、变量、常量、运算符、字符串、枚举、数组、类的相关知识(如继

承、重载等)、集合、异常处理、IO流

进阶知识点:

特性(Attribute)、反射(Reflection)、索引器(Indexer)、委托(Delegate)、事

件、泛型、C#多线程

了解学习内容

控件分类(按命名空间):

System.Windows.Controls (程序集:PresentationFramework.dll)
⽂档地址:https://docs.microsoft.com/zh-cn/dotnet/api/system.windows.controls?view=windowsdesktop-6.0
Label (表示控件的⽂本标签,并提供访问密钥⽀持。) TextBox(显示或编辑⽆格式⽂本) TextBlock(⼀个轻型控件,⽤于显示少量流内容)
Border (边框控件 ,作⽤在另⼀个元素四周绘制边框和/或背景) Button(按钮控件) Calendar (⽇历控件)
CheckBox(选择框) ComboBox (下拉框) Image (图⽚控件)
Menu(菜单) ContextMenu(内容菜单) RadioButton(表示可由⽤户选择但不能清除的按钮,代码能清除)
DataGrid(数据⽹格--Table) ListBox(包含可选项列表) ListView(表示⽤于显示数据项列表的控件)
DockPanel(定义⼀个区域 从中可以按相对位置⽔平或垂直排列各个⼦元素。)---码头;港区 Grid(定义由列和⾏组成的灵活的⽹格区域) GroupBox(组控件---表示⼀个控件 该控件⽤于创建具有⽤户界⾯(UI) 内容边框和标题的容器。)
PrintDialog(调⽤标准的 Microsoft Windows打印对话框) ProgressBar(指示操作进度) Canvas (画布控件)
RichTextBox(表示对FlowDocument 对象进⾏操作的丰富编辑控件) ToolBar(⼀组命令或控件提供容器) Expander(折叠控件)表示⼀种控件,该控件显示具有可折叠内容显示窗⼝的标题。
TabControl(表示包含多个项的控件,这些项共享屏幕上的同⼀空间) Frame(⼀种⽀持导航的内容控件) Rectangle(矩形区域)
StackPanel(将⼦元素排列成⽔平或垂直的⼀⾏。) WrapPanel (按从左到右的顺序位置定位⼦元素,在包含框的边缘处将内容切换到下⼀⾏。)

初步了解XAML

什么是 XAML

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

特点:

  • 定义应用程序的**界面元素**
  • 显示的声明WPF资源**(样式、模板、动画等)**
  • 可扩展性(自定义UI控件)
  • 集中关注于**界面的**设计和实现
xml 复制代码
<StackPanel>
  <Button Content="Click Me"/>
</StackPanel>

对象元素语法

对象元素语法 是 XAML 标记语法,它通过声明 XML 元素来实例化 CLR 类或结

构。 此语法类似于其他标记语⾔(如 HTML)的元素语法。

  • 单标签格式。。
  • 双标签格式。【可嵌⼊其他的标签】

XAL 根元素

plain 复制代码
⼀个 XAML ⽂件只能有⼀个根元素,这样才能同时作为格式正确的 XML ⽂件和有效的 XAML ⽂件。 对于典型 WPF ⽅案,可使⽤在 WPF 应⽤模型中具有突出意义
的根元素(例如,⻚⾯的 Window 窗体 或 Page 页面)

plain 复制代码
在根标签下⾯有且只能有⼀个二级标签。在二级标签⾥⾯我们可以写多个三级 四级标签。

创建应用



WPF 和 XAML 命名空间声明

XAML和.NET其他语言一样 ,也是通过命名空间 有效**组织起XAML内部的相关元素类,这里的命名空间与.NET中的命名空间 不是一一对应的,而是 一对多**,一眼望去,都是** "网址**",这里的网址,是** 遵循XAML解析器标准的命名规则,而不是真正的网址.**

在许多 XAML ⽂件的根标记中的命名空间声明内,通常可看到两个 XML 命名空间声明。

** 第⼀个声明 --默认命名空间(所有WPF类 ,包括构建用户界面使用的控件)**

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

第⼆个声明--****映射单独的 XAML 命名空间,对应一些与XAML语法和编译相关的CLR名称空间

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns和xmlns:x的**区别在于 x作为别名**,在应用时,以前缀形式出现,而xmlns作为** 默认命名空间,不****使用前缀标识的元素,来自该命名空间(默认命名空间)**

xaml命名空间的语法

  1. xmlns[:可选映射前缀]="命名空间描述"
  2. 注意:没有加可选映射前缀的xmlns是WPF默认的命名空间,一个xaml文件**只能有一个默认**的命名空间
  3. 一个**完整的xaml文件,必须具备** 以上**两个命名空间****,因为不可能不用到WPF和XAML类库**
  4. 自定义类或程序集**映射语法**

** xmlns[:必选映射前缀]="****clr-namespace:[****命名空间];assembly=[程序集名称]"**

自定义类案例如下:

wpf项目组成

  1. **app.config **配置文件 ----连接字符串、配置信息
  2. App.xaml ** 设置应用程序起始文件与系统级资源**
  3. App.xaml.cs ** app.xaml文件的 后台类文件** ,继承自Application,封装整个WPF应用程序处
  4. MainWindow.xaml ** Window ----WPF应用程序界面与Xaml设计文件**
  5. MainWindow.xaml.cs ** ---xaml窗口文件的后台代码文件**

了解wpf项目文件

1.App.config配置文件 ----连接字符串、配置信息

以为配置数据库连接为例子

2.App.xaml 入口文件

文件作用

  • 应用程序的入口点
  • 管理应用程序的生命周期(启动、退出等)
  • 定义全局资源(样式、模板、字符串等)
  • 指定应用程序启动时显示的第一个窗口
xml 复制代码
<Application x:Class="WPFCourse01.App"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:local="clr-namespace:WPFCourse01"
	Startup="Application_Startup"
	StartupUri="LoginWin.xaml"
	>
	<Application.Resources>
		<!--定义或合并资源字典-->
		<!--可定义样式、模板、字符串、颜色等,供整个应用程序使用-->
		<!-- 例如:所有按钮,字体白色,背景为蓝色 -->
		<Style x:Key="MyBtn" TargetType="Button">
			<Setter Property="Foreground" Value="White"/>
			<Setter Property="Background" Value="Blue"/>
		</Style>
	</Application.Resources>
</Application>
plain 复制代码
绑定样式:
<Button Style="{ StaticResources MyBtn }">
	
csharp 复制代码
using System.Windows;

namespace WPFCourse01
{
	public partial class App : Application
    {
		private void Application_Startup(object sender, StartupEventArgs e)
		{
			// 应用程序启动时执行的代码
			// 例如:检查用户是否已登录
			bool isUserLoggedIn = CheckLoginStatus();

			if (isUserLoggedIn)
			{
				// 已登录,显示主窗口
				MainWindow mainWindow = new MainWindow();
				mainWindow.Show();
			}
			else
			{
				// 未登录,显示登录窗口(由StartupUri指定)
				// 或者在这里手动创建和显示登录窗口
			}
		}

		private bool CheckLoginStatus()
		{
			// 检查登录状态的逻辑
			return false;
		}
	}
}
启动页面三种方式
csharp 复制代码
StartupUri="LoginWin.xaml"
csharp 复制代码
// 设置启动页  StartupUri 
Application.Current.StartupUri = new Uri("LoginWin.xaml", UriKind.Relative);
csharp 复制代码
LoginWin loginWin = new LoginWin();
loginWin.Show();
 //默认:关闭最后一个窗口,才退出应用程序 
 //改成:关闭启动页就退出
Application.Current.ShutdownMode = ShutdownMode.OnMainWindowClose;
执行流程
  1. 应用程序启动
  2. 触发Application_Startup事件
  3. 在事件处理方法中执行初始化逻辑
  4. 根据条件显示相应的窗口
  5. 如果没有处理 Startup 事件,直接显示 StartupUri 指定的窗口
注意事项
  • 如果同时设置了 Startup 事件和 StartupUri,需要注意两者之间的关系
  • 全局资源可被应用程序中的所有控件访问
  • 可在资源字典中合并多个资源文件,实现更好的组织和复用

3MainWindow.xaml 窗体文件

文件作用:

:::color1

MainWindow.xaml 窗体文件。编写界面布局,控件,语法为:xaml

后台对应 MainWindow.xaml.cs文件:这里编写CS 脚本,界面交互,事件处理,通信,连接数据库等

:::

xml 复制代码
    <!-- 主窗口根元素,定义了窗口的基本属性和命名空间引用 -->
    
    <!-- x:Class - 指定与此 XAML 文件关联的代码隐藏类 -->
    <!-- xmlns - WPF 核心命名空间,提供基础 UI 元素(如Button、TextBox、Label)等 -->
    <!-- xmlns:x - XAML 语言命名空间,提供 XAML 特定功能
          如类绑定(x:Class)、属性元素语法、附加属性、事件处 -->
    <!-- xmlns:d - Blend 设计时命名空间,用于设计时属性,例如:允许绑定数据 -->
    <!-- xmlns:mc - 标记兼容性命名空间,用于忽略不兼容的标记 -->
    <!-- xmlns:model - 自定义模型类的命名空间引用 -->
    <!-- xmlns:sys - System.Data 命名空间引用,用于数据处理 -->
    <!-- xmlns:local - 当前项目命名空间引用 -->
    <!-- mc:Ignorable="d" - 忽略设计时特定的标记 -->
    <!-- Title, Height, Width - 窗口标题和尺寸属性 -->
    
<Window x:Class="WPFCourse01.MainWindow"
        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:model="clr-namespace:WPFDemo.Models;assembly=WPFDemo.Models"
        xmlns:sys="clr-namespace:System.Data;assembly=System.Data"
        xmlns:local="clr-namespace:WPFCourse01"
        mc:Ignorable="d"
        Title="首页" Height="450" Width="800">
    <Grid>
        <!-- 网格面板,作为布局容器使用 -->
        <!-- 目前为空,可以添加各种 UI 元素如按钮、文本框等 -->
    </Grid>
</Window>

x:Class - 指定与此 XAML 文件关联的代码隐藏类

  • x:Class="WPFCourse01.MainWindow":关联的 C# 代码隐藏类(MainWindow.xaml.cs)。
  • 核心命名空间
    • xmlns:WPF 核心命名空间,提供基础 UI 元素(如 ButtonTextBoxGrid)。
    • xmlns:x:XAML 语言命名空间,提供 XAML 特定功能(如 x:Class、事件绑定)。
  • 设计时命名空间
    • xmlns:d:Blend 设计时命名空间,用于设计器预览(如 d:DataContext)。
  • 兼容性命名空间
    • xmlns:mcmc:Ignorable="d":忽略设计时特定的标记(如 d: 属性),确保运行时不报错。
  • 自定义命名空间
    • xmlns:model:引用外部程序集(WPFDemo.Models)中的模型类。
    • xmlns:sys:引用 System.Data 命名空间(用于数据处理)。
    • xmlns:local:引用当前项目(WPFCourse01)中的类。

:::color1

注意事项:一个窗体只有一个跟标签 window ,window下只有一个二级标签 ,二级标签下可以又多个标签

:::

window 窗口:WPF的窗口

:::color1
作用:托管使数据可视化并使**用户能够与数据交互的内容。**

复制代码
       WPF 应用程序使用Window类**<font style="color:#7E45E8;">提供自己的窗口</font>**

:::

:::color1

窗口分为两个区域:非工作区工作区。

非工作区:边框、标题栏、图标、"最小化"、"最大化"和"还原"按钮。"关闭"按钮、"系统"菜单

工作区:窗口非工作区内的区域,开发人员使用它来添加特定于应用程序的内容,例如菜单栏、工具栏和控件。

:::

在 WPF 中,窗口可用于:

  • 显示窗口
  • 配置窗口的大小、位置和外观。
  • 托管特定于应用程序的内容。
  • 管理窗口的生存期

在 WPF 中,可以**使用代码 XAML标记实现控制窗口的外观和行为**。

一般情况下,

外观-------------xaml标记实现

复制代码
   行为-------------代码实现

无边边框窗体案例

csharp 复制代码
<Window x:Class="WPFCourse01.LoginWin"
        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:WPFCourse01"
        mc:Ignorable="d"
        Title="登录页" Height="450" Width="800" 
        WindowStartupLocation="CenterScreen" 
        WindowStyle="None" 
        Background="Transparent" 
        Name="loginwin">
    <Border BorderBrush="Orange" BorderThickness="3" CornerRadius="5">
        <Grid Background="White">
            <Grid Height="30" Background="LightBlue" VerticalAlignment="Top" MouseLeftButtonDown="Grid_MouseLeftButtonDown" HorizontalAlignment="Stretch" Margin="0">
                <Label Content="{Binding ElementName=loginwin,Path=Title}" 
                  HorizontalAlignment="Left" VerticalAlignment="Center" Margin="40,0"/>
                <Button Content="0" FontFamily="Webdings" Width="20" Height="20" 
                  HorizontalAlignment="Right" VerticalAlignment="Center" Margin="80,0"/>
                <Button Name="btnMax" Content="2" FontFamily="Webdings" 
                  Width="20" Height="20" HorizontalAlignment="Right" 
                  VerticalAlignment="Center" Margin="50,0" Click="btnMax_Click"/>
                <Button Content="r" FontFamily="Webdings" Width="20" Height="20" 
                   HorizontalAlignment="Right" VerticalAlignment="Center" Margin="20,0"/>
            </Grid>
            <Button Content="登录" HorizontalAlignment="Left" Margin="135,118,0,0" VerticalAlignment="Top" Width="130" Height="55" Name="btnLogin" Foreground="Orange" FontSize="18" Click="btnLogin_Click"/>
 
        </Grid>
    </Border>
  
</Window>
window标记与代码协同工作

:::color1
需要满足以下要求:

1.在标记中 **, Window元素必须包含x:Class属性 。** 生成应用程序后x:Class ,标记文件中存在会导致 Microsoft 生成引擎(MSBuild)创建一个**partial派生自Window的类**,并具有由x:Class属性指定的名称。 这要求为XAML架构( xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" )添加 XML 命名空间声明。 生成partial的类实现**InitializeComponent方**法,该方法用于注册事件并设置标记中实现的属性。

2.在代码隐藏中 必须是由标记partial中 的**x:Class属性指定的 同名类**,并且** 必须派生自Window**。 这允许在生成应用程序时将** 代码隐藏文件partial为标记文件生成的类****相关联**

3.在代码隐藏中 , Window该类必须实 现**调用InitializeComponent方法的构造函数。 InitializeComponent由 标记文件的生成partial类实现,用于注册事件和设置在标记中定义的属性。**

:::

window生命周期
  • 窗口也有**生存期**,开始于** 首次实例化窗口,在这之后将打开、激活、停用**直至最终关闭窗口。
  • 在实例化窗口时,对它的引用会**自动添加到由该Application对象管理的窗口的 列表中**。 此外,默认情况下,第一个要实例化的窗口是由**Application设置为主应用程序窗口**
  • window.Show() 打开窗口无模式窗口--允许用户在同一应用程序中激活其他窗口)
  • ShowDialog 调用以模式打开 windows,如对话框
  • Close() 关闭窗口

控件分类

内容控件、⽂本控件、条⽬控件、布局控件、其它控件

内容控件 (System.Windows.Controls.ContentControl)
System.Windows.Controls.Label
System.Windows.Controls.TextBlock 继承⾃ FrameworkElement类
System.Windows.Controls.Button
System.Windows.Controls.Border 继承⾃Decorator类
System.Windows.Controls.RadioButton
System.Windows.Controls.CheckBox
System.Windows.Controls.ToolTip
System.Windows.Controls.GroupBox
System.Windows.Controls.Expander
System.Windows.Controls.Frame
⽂本控件 (System.Windows.Controls.TextBoxBase)
System.Windows.Controls.TextBox
System.Windows.Controls.RichTextBox
条⽬控件 (System.Windows.Controls.ItemsControl)
System.Windows.Controls.ComboBox
System.Windows.Controls.Menu
System.Windows.Controls.ContextMenu
System.Windows.Controls.TabControl
System.Windows.Controls.ToolBar
System.Windows.Controls.ToolBarTray
System.Windows.Controls.ListBox
System.Windows.Controls.DataGrid
System.Windows.Controls.TreeView
布局控件 (System.Windows.Controls.Panel)
System.Windows.Controls.Grid
System.Windows.Controls.StackPanel
System.Windows.Controls.DockPanel
System.Windows.Controls.WrapPanel
System.Windows.Controls.Canvas
其他控件
System.Windows.Controls.Calendar
System.Windows.Controls.Image
System.Windows.Controls.ProgressBar
System.Windows.Shapes.Rectangle

WPF入门指南

一、什么是WPF?

WPF(Windows Presentation Foundation):微软推出的Windows桌面应用UI框架,属于.NET Framework的一部分。简单说,就是用来做Windows程序界面的工具,能做出带图片、动画、3D效果的漂亮界面,还能让界面设计和代码逻辑分开做。

特点

  • 基于DirectX技术,支持硬件加速,界面更流畅
  • 用XAML语言写界面,用C#等写逻辑,分工明确
  • 支持矢量图形、动画、多媒体,视觉效果丰富
  • 数据驱动UI:数据变了,界面自动跟着变,不用手动刷新

二、XAML是什么?

XAML(可扩展应用程序标记语言):专门用来描述WPF界面的标记语言,长得像HTML,但功能更强。

作用

  • 定义界面元素(按钮、文本框等)
  • 声明资源(样式、模板、动画)
  • 让界面和逻辑分离,设计师和开发者能协作

例子:一个简单的按钮界面

xml 复制代码
<Button Content="点击我" Width="100" Height="30" />

三、WPF应用程序的组成

一个WPF程序主要由这些文件组成:

文件 作用
app.config 配置文件,存连接字符串、设置等
App.xaml 应用程序入口,设置启动窗口、全局资源
App.xaml.cs App.xaml的后台代码,处理程序启动、退出等事件
MainWindow.xaml 主窗口界面文件
MainWindow.xaml.cs 主窗口的后台代码,处理按钮点击等逻辑

四、XAML命名空间

XAML用"命名空间"来组织元素,就像文件夹分类文件。看起来像网址,其实不是真的网址,只是个标识。

1. 常用命名空间

  • xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"默认命名空间,包含所有WPF基础控件(按钮、文本框等)
  • xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml":XAML语法命名空间,提供XAML特有功能(如x:Classx:Key
  • xmlns:d="http://schemas.microsoft.com/expression/blend/2008":设计时命名空间,在Blend或VS设计界面时用(运行时无效)
  • xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006":兼容性命名空间,用来忽略不兼容的标记

2. 自定义命名空间

引用自己写的类或外部程序集时用,格式:

xml 复制代码
xmlns:前缀="clr-namespace:命名空间;assembly=程序集名称"

例子:引用当前项目的类

xml 复制代码
xmlns:local="clr-namespace:MyWpfApp"  <!-- 引用当前项目的MyWpfApp命名空间 -->

五、Window(窗口)

Window是WPF程序的主窗口容器,所有界面元素都放在里面。

1. 基本属性

属性 作用
Title 窗口标题栏文字
Width/Height 窗口宽/高
WindowStartupLocation 窗口首次显示的位置(如屏幕中央)
WindowState 窗口状态(正常、最大化、最小化)
Topmost 是否总在最上层显示

2. 生命周期

窗口从创建到关闭有一系列过程,关键事件:

  • Loaded:窗口加载完成时触发(可以在这里初始化数据)
  • Closing:窗口关闭前触发(可以询问"是否保存")
  • Closed:窗口关闭后触发

3. 打开和关闭窗口

  • 非模式窗口(可以同时操作其他窗口):window.Show()
  • 模式窗口(必须关闭才能操作其他窗口,如弹窗):window.ShowDialog()
  • 关闭窗口:window.Close()

六、布局面板

布局面板用来排列界面元素(按钮、文本框等),就像"架子",决定元素放哪里、怎么排。

1. Grid(网格面板)

最常用的布局,按行列划分区域,类似Excel表格。

例子:2行2列的网格

xml 复制代码
<Grid>
    <!-- 定义2行 -->
    <Grid.RowDefinitions>
        <RowDefinition Height="50"/>  <!-- 第一行高50 -->
        <RowDefinition Height="*"/>   <!-- 第二行占剩余空间 -->
    </Grid.RowDefinitions>
    <!-- 定义2列 -->
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="100"/>  <!-- 第一列宽100 -->
        <ColumnDefinition Width="*"/>    <!-- 第二列占剩余空间 -->
    </Grid.ColumnDefinitions>
    <!-- 放元素,指定位置 -->
    <Button Grid.Row="0" Grid.Column="0" Content="第一行第一列"/>
    <Button Grid.Row="1" Grid.Column="1" Content="第二行第二列"/>
</Grid>

2. StackPanel(堆叠面板)

元素按水平或垂直方向依次排列,像排队一样。

例子:垂直排列的3个按钮

xml 复制代码
<StackPanel Orientation="Vertical" Margin="10">  <!-- Orientation:排列方向(Vertical垂直,Horizontal水平) -->
    <Button Content="按钮1" Margin="5"/>
    <Button Content="按钮2" Margin="5"/>
    <Button Content="按钮3" Margin="5"/>
</StackPanel>

3. WrapPanel(自动换行面板)

元素排满一行/列后自动换行,适合显示多个小元素(如标签、小按钮)。

例子:水平排列,满了自动换行

xml 复制代码
<WrapPanel Orientation="Horizontal" Margin="10">
    <Button Content="按钮1" Width="80" Margin="5"/>
    <Button Content="按钮2" Width="80" Margin="5"/>
    <Button Content="按钮3" Width="80" Margin="5"/>
    <!-- 更多按钮...满一行后自动换行 -->
</WrapPanel>

4. Canvas(画布面板)

直接指定元素的坐标(x,y),适合自由定位(如绘图、游戏元素)。

例子:在(50,30)位置放一个按钮

xml 复制代码
<Canvas>
    <Button Content="自由定位" Canvas.Left="50" Canvas.Top="30"/>  <!-- 距离左边50,上边30 -->
</Canvas>

七、常用控件

控件是界面上能看到、能操作的元素(按钮、文本框等)。

1. 基础控件

控件 作用 关键属性
Button 点击触发操作 Content(按钮文字)、Click(点击事件)
TextBox 输入文本 Text(输入的内容)
PasswordBox 输入密码(显示*) Password(密码内容)
Label 显示文本(不能编辑) Content(显示的文字)
CheckBox 复选框(可多选) IsChecked(是否选中)
RadioButton 单选按钮(同组内只能选一个) GroupName(分组)、IsChecked
ComboBox 下拉框(从列表选一个) ItemsSource(选项集合)、SelectedItem(选中项)
ListBox 列表框(可单选或多选) ItemsSource、SelectionMode(选择模式)

2. 案例:登录界面

xml 复制代码
<Grid Margin="20">
    <!-- 用户名行 -->
    <Label Grid.Row="0" Grid.Column="0" Content="用户名:"/>
    <TextBox Grid.Row="0" Grid.Column="1" Width="200" Name="txtUser"/>
    
    <!-- 密码行 -->
    <Label Grid.Row="1" Grid.Column="0" Content="密码:"/>
    <PasswordBox Grid.Row="1" Grid.Column="1" Width="200" Name="txtPwd"/>
    
    <!-- 登录按钮 -->
    <Button Grid.Row="2" Grid.ColumnSpan="2" Content="登录" 
            Click="Login_Click" Width="100" Margin="0,10"/>
</Grid>

八、资源(Resources)

资源是可以重复使用的对象(如颜色、样式、模板),定义一次,多处使用,方便修改。

1. 定义资源

可以在窗口、页面或应用程序级别定义,例子:

xml 复制代码
<Window.Resources>
    <!-- 定义一个红色画刷 -->
    <SolidColorBrush x:Key="RedBrush" Color="Red"/>
    <!-- 定义一个按钮样式 -->
    <Style x:Key="BtnStyle" TargetType="Button">
        <Setter Property="Width" Value="100"/>
        <Setter Property="Height" Value="30"/>
    </Style>
</Window.Resources>
  • x:Key:资源的唯一标识,用的时候通过这个找

2. 使用资源

xml 复制代码
<!-- 使用红色画刷 -->
<Button Background="{StaticResource RedBrush}" Content="红色按钮"/>
<!-- 使用按钮样式 -->
<Button Style="{StaticResource BtnStyle}" Content="按我"/>

3. 静态资源 vs 动态资源

  • 静态资源:程序启动时加载,之后不变(性能好,适合不修改的资源)
  • 动态资源:程序运行中可以动态更新(适合需要动态变化的资源,如主题切换)

九、样式(Style)

样式用来统一设置控件的外观(颜色、大小等),避免重复写代码。

1. 基本用法

xml 复制代码
<Window.Resources>
    <!-- 定义按钮样式 -->
    <Style x:Key="MyBtnStyle" TargetType="Button">
        <Setter Property="Background" Value="Blue"/>  <!-- 背景蓝色 -->
        <Setter Property="Foreground" Value="White"/>  <!-- 文字白色 -->
        <Setter Property="Width" Value="120"/>         <!-- 宽120 -->
    </Style>
</Window.Resources>
<!-- 使用样式 -->
<Button Style="{StaticResource MyBtnStyle}" Content="样式按钮"/>

2. 样式继承

在已有样式基础上修改,避免重复定义:

xml 复制代码
<Style x:Key="BigBtnStyle" BasedOn="{StaticResource MyBtnStyle}">
    <Setter Property="Height" Value="50"/>  <!-- 在原有样式上,增加高度50 -->
</Style>

十、模板(Template)

模板用来修改控件的"外观结构",比如把按钮改成圆形,把列表项改成图文组合。

1. 控件模板(ControlTemplate)

修改控件本身的样子,比如把按钮做成圆形:

xml 复制代码
<Style TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <!-- 圆形按钮 -->
                <Ellipse Fill="{TemplateBinding Background}" Width="60" Height="60">
                    <!-- 显示按钮文字 -->
                    <TextBlock Text="{TemplateBinding Content}" 
                               HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Ellipse>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

2. 数据模板(DataTemplate)

修改数据的显示方式,比如列表中的每个项显示图片+文字:

xml 复制代码
<ListBox ItemsSource="{Binding Users}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <!-- 每个用户项显示头像和名字 -->
            <StackPanel Orientation="Horizontal">
                <Image Source="{Binding Avatar}" Width="50" Height="50"/>
                <TextBlock Text="{Binding Name}" Margin="10,0"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

十一、路由事件

路由事件是WPF的特殊事件,事件触发后会沿着界面元素树"传播",父元素或子元素都能响应。

1. 传播方式

  • 冒泡:从触发事件的元素向上传播到父元素(最常用)
  • 隧道 :从根元素向下传播到触发事件的元素(通常以Preview开头,如PreviewMouseDown
  • 直接:只在触发元素上响应

2. 例子:按钮点击事件冒泡

xml 复制代码
<Grid MouseDown="Grid_MouseDown">  <!-- 网格的点击事件 -->
    <Button MouseDown="Button_MouseDown" Content="点击我"/>  <!-- 按钮的点击事件 -->
</Grid>

点击按钮时,会先触发Button_MouseDown,再触发Grid_MouseDown(事件冒泡到父元素)。

十二、数据绑定

数据绑定让界面元素和数据自动关联,数据变了界面自动更新,不用手动改。

例子:文本框内容同步到标签

xml 复制代码
<TextBox Name="txtInput"/>
<Label Content="{Binding ElementName=txtInput, Path=Text}"/>  <!-- 绑定到文本框的Text属性 -->

当在文本框输入时,标签会实时显示相同内容。

十三、总结

WPF是一个强大的UI框架,核心是"界面用XAML,逻辑用C#,数据驱动UI"。掌握布局面板、控件、资源、样式这些基础,就能做出各种界面。实际开发中,多练案例(如登录页、列表页)会更容易理解。

相关推荐
一叶星殇2 小时前
WPF UI 框架大全(2026版)
ui·wpf
我要打打代码4 小时前
WPF入门指南(3)
wpf
ALex_zry4 小时前
Redis Cluster 故障转移与高可用实践
数据库·redis·wpf
kylezhao20194 小时前
深入浅出理解 C# WPF 的事件
开发语言·c#·wpf
FuckPatience1 天前
WPF xaml中的 xmlns:d=“http://schemas.microsoft.com/expression/blend/2008“ 的使用
ui·wpf
就是有点傻1 天前
WPF加载动画
ui·wpf
kylezhao20191 天前
WPF Binding 从入门到精通
wpf
Poetinthedusk2 天前
WPF应用跟随桌面切换
开发语言·wpf
小北方城市网2 天前
MongoDB 分布式存储与查询优化:从副本集到分片集群
java·spring boot·redis·分布式·wpf