syncfusion-maui-backdrop

实现 Backdrop 页面（.NET MAUI）

Syncfusion SfBackdropPage 是一个具有两个表面的分层页面：

• 后层 — 用于放置可操作的上下文内容（导航菜单、筛选器）
• 前层 — 始终可见，用于放置主要内容；向下滑动即可显示后层

可以通过工具栏图标、触摸/滑动或以编程方式显示/隐藏后层。

何时使用此技能

在用户需要以下功能时使用此技能：

• 实现菜单驱动的导航，并使用滑动式前层
• 构建筛选器或搜索面板，使其从主要内容后方滑入
• 为分层页面添加显示和隐藏动画
• 自定义 backdrop 标题图标、圆角形状或显示高度
• 处理 BackLayerStateChanged 事件以跟踪状态
• 将 Liquid Glass Effect 应用于 backdrop 图层

组件概览

SfBackdropPage 控件提供：

• 双层架构：后层用于上下文操作，前层用于主要内容，形成空间层次
• 多种显示方式：编程 API、轻触工具栏图标，以及滑动/甩动手势
• 自适应显示高度：Auto 模式（适应内容）或 Fill 模式（展开至全屏）
• 可自定义的前层：弧形或平直边缘，并可独立控制圆角半径
• 标题集成：无缝支持 NavigationPage 和 FlyoutPage，并可自定义图标和文本
• 流畅动画：内置 Material Design 动效，用于显示/隐藏过渡
• 状态跟踪：通过 BackLayerStateChanged 事件按百分比跟踪显示状态
• 现代效果：支持半透明设计的 Liquid Glass Effect（iOS/macOS 26+、.NET 10）

文档和导航指南

入门

📄 阅读： references/getting-started.md

• 安装 NuGet 包（Syncfusion.Maui.Backdrop）
• 在 MauiProgram.cs 中注册处理程序
• 初始化 SfBackdropPage（XAML 和 C#）
• 添加 BackdropBackLayer 和 BackdropFrontLayer 内容
• 以编程方式、通过触摸和滑动显示/隐藏

标题配置

📄 阅读： references/header-configuration.md

• 在 NavigationPage 中包装（标题必需）
• NavigationPage 与 FlyoutPage 中的默认图标
• 自定义图标图像（OpenIconImageSource、CloseIconImageSource）
• 自定义图标文本（OpenText、CloseText）

显示高度和圆角形状自定义

📄 阅读： references/reveal-and-corner-customization.md

• BackLayerRevealOption：Fill 与 Auto
• 前层的 RevealedHeight
• EdgeShape：Curved 与 Flat
• LeftCornerRadius / RightCornerRadius

事件

📄 阅读： references/events.md

• BackLayerStateChanged 事件
• BackLayerStateChangedEventArgs.Percentage
• XAML 和 C# 绑定模式

Liquid Glass Effect

📄 阅读： references/liquid-glass-effect.md

• 在前层或后层上启用 EnableLiquidGlassEffect
• 为玻璃效果设置透明背景
• 平台要求（iOS 26+、macOS 26+、.NET 10）