0

0

C# MAUI怎么使用C# Markup编写UI MAUI C# UI教程

星降

星降

发布时间:2026-01-24 08:11:20

|

857人浏览过

|

来源于php中文网

原创

MAUI中C# Markup是借助Microsoft.Maui.Controls.Markup扩展方法,用类型安全、可调试的链式C#代码替代XAML构建UI,支持绑定、样式复用和条件渲染,与XAML可共存。

c# maui怎么使用c# markup编写ui maui c# ui教程

MAUI 中使用 C# Markup 编写 UI,核心是借助 Microsoft.Maui.Controls.Markup(原 Xamarin.Forms.Markup 的演进版)提供的扩展方法,用纯 C# 代码替代 XAML,实现类型安全、可调试、易复用的 UI 构建方式。它不是“强制替代 XAML”,而是提供一种更贴近逻辑、更适合动态/条件化界面的编码风格。

启用 C# Markup 支持

MAUI 6+ 默认已内置基础支持,但需确保项目引用了必要命名空间,并启用扩展方法:

  • App.xaml.cs 或页面类顶部添加:
    using Microsoft.Maui.Controls.Markup;
  • 确认 MauiProgram.cs 中已调用 builder.UseMauiApp() —— 默认已包含,无需额外配置
  • 若提示找不到 .Background().Children() 等方法,请检查是否遗漏 using,或 NuGet 包是否为最新稳定版(.NET 8 SDK + MAUI 8)

从一个 Button 开始:基础语法

对比 XAML 写法:

对应 C# Markup 写法:

new Button()
    .Text("点击")
    .BackgroundColor(Colors.Blue)
    .OnClicked(OnClicked)

关键点:

Pixie.haus
Pixie.haus

AI像素图像生成平台

下载
  • 每个扩展方法返回 this,支持链式调用
  • 属性名与 XAML 属性基本一致(如 TextBackgroundColor),大小写敏感
  • 事件处理用 .OnClicked().OnTextChanged() 等,传入方法名或 lambda

构建完整页面:StackLayout + 多控件组合

以一个带标题、输入框和按钮的登录页为例:

public class LoginPage : ContentPage
{
    public LoginPage()
    {
        Content = new VerticalStackLayout()
            .Padding(20)
            .Children(
                new Label().Text("欢迎登录").FontSize(24).HorizontalTextAlignment(TextAlignment.Center),
                new Entry().Placeholder("用户名").Margin(0, 16, 0, 8),
                new Entry().Placeholder("密码").IsPassword(true).Margin(0, 0, 0, 16),
                new Button().Text("登录").BackgroundSource(new SolidColorBrush(Colors.Teal)).HeightRequest(44)
                    .OnClicked(async _ => await DisplayAlert("提示", "登录中...", "确定"))
            );
    }
}

说明:

  • .Children() 接收多个控件(支持 params),自动添加到布局容器
  • .Margin().Padding() 使用 Thickness 语义,支持单值、双值(水平/垂直)、四值(左/上/右/下)
  • .BackgroundSource() 用于设置渐变或图片背景;纯色用 new SolidColorBrush(Colors.XXX)

进阶技巧:绑定、资源与复用

C# Markup 同样支持 MVVM 绑定和样式复用:

  • 绑定.Bind(Button.TextProperty, nameof(ViewModel.Title)) 或使用快捷语法 .Bind(x => x.Text, vm => vm.Title)(需安装 Microsoft.Maui.Controls.Markup.Bindings 扩展)
  • 样式复用:定义静态扩展方法封装常用样式,例如:
    public static T PrimaryButton(this T button) where T : Button => button.BackgroundSource(new SolidColorBrush(Colors.Primary)).TextColor(Colors.White);
    然后调用:new Button().Text("提交").PrimaryButton()
  • 条件渲染:直接用 if/else 或三元表达式构造控件,比如:showHint ? new Label().Text("请输入邮箱") : null,再传入 .Children()

基本上就这些。C# Markup 不复杂但容易忽略细节——重点是理解它是“控件实例 + 链式配置”,而非声明式模板。适合逻辑驱动 UI、A/B 测试分支、运行时动态生成界面等场景。XAML 和 C# Markup 可在同一项目共存,按需选用即可。

相关专题

更多
c语言中null和NULL的区别
c语言中null和NULL的区别

c语言中null和NULL的区别是:null是C语言中的一个宏定义,通常用来表示一个空指针,可以用于初始化指针变量,或者在条件语句中判断指针是否为空;NULL是C语言中的一个预定义常量,通常用来表示一个空值,用于表示一个空的指针、空的指针数组或者空的结构体指针。

233

2023.09.22

java中null的用法
java中null的用法

在Java中,null表示一个引用类型的变量不指向任何对象。可以将null赋值给任何引用类型的变量,包括类、接口、数组、字符串等。想了解更多null的相关内容,可以阅读本专题下面的文章。

437

2024.03.01

if什么意思
if什么意思

if的意思是“如果”的条件。它是一个用于引导条件语句的关键词,用于根据特定条件的真假情况来执行不同的代码块。本专题提供if什么意思的相关文章,供大家免费阅读。

765

2023.08.22

lambda表达式
lambda表达式

Lambda表达式是一种匿名函数的简洁表示方式,它可以在需要函数作为参数的地方使用,并提供了一种更简洁、更灵活的编码方式,其语法为“lambda 参数列表: 表达式”,参数列表是函数的参数,可以包含一个或多个参数,用逗号分隔,表达式是函数的执行体,用于定义函数的具体操作。本专题为大家提供lambda表达式相关的文章、下载、课程内容,供大家免费下载体验。

206

2023.09.15

python lambda函数
python lambda函数

本专题整合了python lambda函数用法详解,阅读专题下面的文章了解更多详细内容。

190

2025.11.08

Python lambda详解
Python lambda详解

本专题整合了Python lambda函数相关教程,阅读下面的文章了解更多详细内容。

50

2026.01.05

margin在css中是啥意思
margin在css中是啥意思

在CSS中,margin是一个用于设置元素外边距的属性。想了解更多margin的相关内容,可以阅读本专题下面的文章。

434

2023.12.18

css中的padding属性作用
css中的padding属性作用

在CSS中,padding属性用于设置元素的内边距。想了解更多padding的相关内容,可以阅读本专题下面的文章。

133

2023.12.07

c++空格相关教程合集
c++空格相关教程合集

本专题整合了c++空格相关教程,阅读专题下面的文章了解更多详细内容。

0

2026.01.23

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
最新Python教程 从入门到精通
最新Python教程 从入门到精通

共4课时 | 16.6万人学习

Rust 教程
Rust 教程

共28课时 | 4.8万人学习

Git 教程
Git 教程

共21课时 | 2.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号