XAML语法与静态资源应用

1. 引言

WPF(Windows Presentation Foundation)是一种用于构建 Windows 桌面应用程序的 UI 框架。它使用 XAML(eXtensible Application Markup Language)来定义用户界面,并支持数据绑定、样式、模板等强大功能。本笔记将重点介绍 Prism 框架、XAML 语法、静态资源的使用,以及如何为 MVVM 模式开发做准备。


2. XAML 语法基础

2.1 对象元素语法 vs 属性语法

在 XAML 中,我们可以使用两种方式来设置控件的属性:

对象元素语法(Object Element Syntax)
xml 复制代码
<Button>
    <Button.Background>
        <SolidColorBrush Color="Blue"/>
    </Button.Background>
    Click Me
</Button>
属性语法(Property Syntax)
ini 复制代码
<Button Background="Blue" Content="Click Me"/>

对比说明:

  • 属性语法更简洁,适用于简单属性设置。
  • 对象元素语法适用于复杂属性(如画刷、模板等),可以在内部嵌套其他元素。

3. 应用程序启动配置

3.1 配置 ​​App.xaml​​ 启动视图

在 ​​App.xaml​​ 中,我们可以指定应用程序启动时显示的窗口或页面:

ini 复制代码
<Application x:Class="WpfApp.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             StartupUri="MainWindow.xaml">
</Application>

说明:

  • ​StartupUri​ 指定启动的 XAML 文件。
  • 命名空间需正确引入,否则无法找到视图。

4. 属性元素语法与复杂画刷

4.1 使用属性元素语法设置复杂画刷

ini 复制代码
<Button Content="彩色按钮">
    <Button.Background>
        <LinearGradientBrush>
            <GradientStop Color="Yellow" Offset="0.0"/>
            <GradientStop Color="Red" Offset="1.0"/>
        </LinearGradientBrush>
    </Button.Background>
</Button>

优势:

  • 支持更复杂的视觉设计。
  • 可实现渐变、图像画刷等效果。

5. 静态资源与样式复用

5.1 定义静态资源

在 ​​App.xaml​​ 或某个 Window/UserControl 的资源字典中定义:

ini 复制代码
<Window.Resources>
    <SolidColorBrush x:Key="MyBackground" Color="LightBlue"/>
    <Style x:Key="MyButtonStyle" TargetType="Button">
        <Setter Property="Background" Value="{StaticResource MyBackground}"/>
        <Setter Property="FontSize" Value="16"/>
    </Style>
</Window.Resources>

5.2 使用静态资源

ini 复制代码
<Button Style="{StaticResource MyButtonStyle}" Content="样式按钮"/>

优点:

  • 实现样式复用,统一界面风格。
  • 便于维护和主题切换。

6. ​​Name​​​ 与 ​​x:Name​​ 的区别与选择

6.1 两者对比

属性 使用场景 备注
​Name​ 用于 WPF 内置控件(如 Button) 部分控件不支持
​x:Name​ 通用,适用于所有元素 推荐使用,确保一致性和兼容性

6.2 示例

ini 复制代码
<Button x:Name="btnSubmit" Content="提交"/>
<TextBlock Name="txtMessage" Text="Hello"/>

推荐使用​x:Name​

  • 保证在代码后台中能正确引用控件。
  • 兼容视觉树查找与模板中的控件。

7. 数据模板简介

7.1 定义数据模板

ini 复制代码
<Window.Resources>
    <DataTemplate DataType="{x:Type local:Student}">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}"/>
            <TextBlock Text=" - "/>
            <TextBlock Text="{Binding Age}"/>
        </StackPanel>
    </DataTemplate>
</Window.Resources>

说明:

  • 数据模板用于定义如何显示数据对象。
  • 可与 ​ItemsControl​​ListBox​ 等控件结合使用。

相关推荐
IT_陈寒15 分钟前
React性能优化:这5个Hooks技巧让我减少了40%的重新渲染
前端·人工智能·后端
L***d67025 分钟前
十七:Spring Boot依赖 (2)-- spring-boot-starter-web 依赖详解
前端·spring boot·后端
本妖精不是妖精27 分钟前
基于 Rokid Max 与 JSAR 构建空间锚定型 AR 信息面板
后端·ar·restful
芳草萋萋鹦鹉洲哦29 分钟前
【tauri+rust】App会加载白屏,有时显示在左上角显示一小块,如何优化
开发语言·后端·rust
aiopencode32 分钟前
网络调试工具推荐,Fiddler抓包教程、HTTPS配置与接口调试完整指南
后端
q***38511 小时前
SpringBoot + vue 管理系统
vue.js·spring boot·后端
用户638982245891 小时前
使用Hutool的ExcelWriter导出复杂模板,支持下拉选项级联筛选
后端
程序员鱼皮1 小时前
10个免费的网站分析工具,竟然比付费的更香?
后端·程序员·数据分析
码一行1 小时前
Eino AI 实战: Eino 的文档加载与解析
后端·go
码一行1 小时前
Eino AI 实战:DuckDuckGo 搜索工具 V1 与 V2
后端·go