在 MAUI 中动态创建 UI 元素需用 C# 实例化控件、设置属性并添加到已初始化容器中;支持 Grid 行列定位、事件绑定、数据绑定、批量生成及条件渲染,并建议设置 AutomationId 便于测试。

在 MAUI 中动态创建 UI 元素,核心是通过 C# 实例化控件类、设置属性、再将其添加到容器(如 StackLayout、Grid 或页面的 Content)中。不需要 XAML,纯代码即可完成布局构建。
创建基础控件并添加到布局
最常见的方式是 new 一个控件,配置关键属性(如文本、颜色、事件),然后用 Children.Add() 加入父容器:
-
按钮示例:
var btn = new Button { Text = "点我", BackgroundColor = Colors.Blue }; layout.Children.Add(btn); -
标签示例:
var label = new Label { Text = "动态生成的文本", FontSize = 16 }; layout.Children.Add(label); - 注意:必须确保目标容器(如
layout)已初始化,且当前页面的Content已设为该容器或其子项。
使用 Grid 动态添加控件并指定行列位置
若需精确排版,可操作 Grid 的行/列定义,并用附加属性设定控件位置:
- 先定义行列:
grid.RowDefinitions.Add(new RowDefinition { Height = GridLength.Auto }); - 添加控件时指定位置:
var entry = new Entry(); Grid.SetRow(entry, 0); Grid.SetColumn(entry, 1); grid.Children.Add(entry); - 支持跨行跨列:
Grid.SetRowSpan(entry, 2); Grid.SetColumnSpan(entry, 1);
绑定事件与数据(动态控件也支持)
动态创建的控件和 XAML 中的一样,可以正常绑定命令、事件或绑定上下文:
-
点击事件:
btn.Clicked += (s, e) => { DisplayAlert("提示", "按钮被点击", "确定"); }; - 绑定命令(需设置 BindingContext):
btn.SetBinding(Button.CommandProperty, nameof(ViewModel.SubmitCommand)); - 绑定文本:
label.SetBinding(Label.TextProperty, nameof(ViewModel.Message));
批量生成与条件渲染
可根据数据集合循环创建控件,适合列表、表单等场景:
- 例如生成 5 个开关:
foreach (var i in Enumerable.Range(1, 5)) { var toggle = new Switch { IsToggled = i % 2 == 0 }; stackLayout.Children.Add(toggle); } - 配合条件逻辑:
if (user.IsAdmin) { layout.Children.Add(new Label { Text = "管理员面板" }); } - 建议为动态控件设置
AutomationId,方便自动化测试识别:btn.AutomationId = "dynamic_save_btn";










