MAUI怎么布局界面 .NET MAUI常用布局控件使用方法

.NET MAUI核心布局控件有StackLayout、Grid、FlexLayout和AbsoluteLayout：StackLayout用于线性堆叠，Grid实现行列精确定位，FlexLayout支持响应式弹性布局，AbsoluteLayout提供绝对坐标定位但慎用。

.NET MAUI 的界面布局靠的是“容器控件”——它们不直接显示内容，而是负责安排子控件的位置、大小和排列方式。掌握几个核心布局控件，比死记属性更管用。

StackLayout：最常用的线性堆叠

适合列表、表单、按钮组这类按顺序排成一列或一行的场景。默认垂直堆叠（Vertical），也可设为水平（Horizontal）。

• 关键属性：Orientation（Vertical/Horizontal）、Spacing（子项间距）
• 子控件默认占满可用宽度（Vertical时）或高度（Horizontal时），但不会自动拉伸；想让某个子项占剩余空间，给它加 VerticalOptions="FillAndExpand" 或 HorizontalOptions="FillAndExpand"
• 不支持复杂对齐（比如右对齐按钮+左对齐文字），这时该换 Grid 或 FlexLayout

Grid：灵活的行列网格

类似 CSS Grid 或 HTML Table，适合需要精确定位、跨行跨列、响应式调整的界面，比如登录页、仪表盘卡片布局。

• 先定义 RowDefinitions 和 ColumnDefinitions（例如 <rowdefinition height="Auto"></rowdefinition><rowdefinition height="*"></rowdefinition>）
• 子控件用 Grid.Row、Grid.Column、Grid.RowSpan、Grid.ColumnSpan 定位
• 高度/宽度支持 Auto（内容自适应）、*（均分剩余空间）、2*（占两份）等写法

FlexLayout：响应式弹性布局

对标 CSS Flexbox，特别适合动态内容、多端适配（如手机横竖屏切换）、流式标签栏等场景。

标签： css html 弹性布局 排列 .net 绝对定位