syncfusion-maui-docklayout

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Implementing .NET MAUI DockLayout

实现.NET MAUI DockLayout

Guide users to implement Syncfusion .NET MAUI DockLayout (SfDockLayout), a versatile layout control that enables developers to arrange and dock child elements to specific edges (top, bottom, left, right) or center, providing a robust framework for designing complex user interfaces in mobile and desktop applications.

本指南指导用户实现Syncfusion .NET MAUI DockLayout（SfDockLayout），这是一款多功能布局控件，允许开发人员将子元素停靠到特定边缘（上、下、左、右）或中心，为设计移动和桌面应用中的复杂用户界面提供强大框架。

When to Use This Skill

何时使用该技能

Use this skill when users need to:

Create docking layouts with elements positioned at specific edges
Build dashboard interfaces with multiple regions (header, footer, sidebar, content)
Implement adaptive layouts that respond to screen sizes and orientations
Position UI elements at top, bottom, left, right, or center of a container
Configure spacing between docked elements (horizontal and vertical)
Control last child expansion to fill remaining space
Support Right-to-Left (RTL) layouts for internationalization
Work with .NET MAUI applications using Syncfusion components

当用户需要以下功能时，可使用本技能：

创建停靠布局：将元素定位在特定边缘
构建仪表板界面：包含多个区域（页眉、页脚、侧边栏、内容区）
实现自适应布局：响应屏幕尺寸和方向变化
定位UI元素：将元素放在容器的顶部、底部、左侧、右侧或中心
配置间距：设置停靠元素之间的水平和垂直间距
控制最后一个子元素的扩展：填充剩余空间
支持从右到左（RTL）布局：满足国际化需求
开发.NET MAUI应用：使用Syncfusion组件

Component Overview

组件概述

The SfDockLayout control provides:

Flexible Docking: Dock children to Top, Bottom, Left, Right, or None (center)
Adaptive Layouts: Automatically adapts to various screen sizes and orientations
Customizable Spacing: Configure horizontal and vertical spacing between elements
Last Child Expansion: Option to expand the last child to fill remaining space
RTL Support: Full Right-to-Left layout support for internationalization
Programmatic Control: GetDock() and SetDock() methods for runtime manipulation

SfDockLayout控件提供以下功能：

灵活停靠：将子元素停靠在顶部、底部、左侧、右侧或无（中心）位置
自适应布局：自动适配各种屏幕尺寸和方向
可自定义间距：配置元素之间的水平和垂直间距
最后一个子元素扩展：可选择扩展最后一个子元素以填充剩余空间
RTL支持：全面支持从右到左布局，满足国际化需求
程序化控制：使用GetDock()和SetDock()方法进行运行时操作

Documentation and Navigation Guide

文档与导航指南

Getting Started

入门指南

📄 Read: references/getting-started.md

Installing Syncfusion.Maui.Core NuGet package
Registering Syncfusion Core handler
Creating and initializing SfDockLayout
Setting basic dock positions for child elements
Complete working example with all dock positions

📄 阅读： references/getting-started.md

安装Syncfusion.Maui.Core NuGet包
注册Syncfusion Core处理程序
创建并初始化SfDockLayout
为子元素设置基本停靠位置
包含所有停靠位置的完整工作示例

Docking Features

停靠功能

📄 Read: references/docking-features.md

Dock position options (Top, Bottom, Left, Right, None)
Using Dock attached property in XAML
Using Add() method with Dock parameter in C#
GetDock() method to retrieve current position
SetDock() method to change position programmatically
Docking order and element layering

📄 阅读： references/docking-features.md

停靠位置选项（顶部、底部、左侧、右侧、无）
在XAML中使用Dock附加属性
在C#中使用带Dock参数的Add()方法
使用GetDock()方法检索当前位置
使用SetDock()方法程序化更改位置
停靠顺序和元素分层

Spacing and Layout

间距与布局

📄 Read: references/spacing-layout.md

HorizontalSpacing property for gaps between elements
VerticalSpacing property for vertical gaps
ShouldExpandLastChild property behavior
Controlling last child expansion (true/false)
Layout scenarios and best practices

📄 阅读： references/spacing-layout.md

HorizontalSpacing属性：设置元素之间的水平间隙
VerticalSpacing属性：设置垂直间隙
ShouldExpandLastChild属性的行为
控制最后一个子元素的扩展（true/false）
布局场景与最佳实践

Advanced Features

高级功能

📄 Read: references/advanced-features.md

Right-to-Left (RTL) layout support
FlowDirection property configuration
Adaptive layouts for different screen sizes
Handling orientation changes
Sample projects and resources

📄 阅读： references/advanced-features.md

从右到左（RTL）布局支持
FlowDirection属性配置
适配不同屏幕尺寸的自适应布局
处理方向变化
示例项目与资源