在 XR 中实现 Material Design

Material Design 提供了适用于 XR 的自适应组件和布局。使用现有的 Material 3 库，组件和 自适应布局 通过空间界面行为得到增强。

您可以通过添加 EnableXrComponentOverrides 封装容器来调整当前的 M3 实现。将 XR Compose Material3 库 添加到您的应用依赖项中。

使用 EnableXrComponentOverrides 调整现有应用

在 EnableXrComponentOverrides 封装容器内的所有 M3 Compose 界面都将在 XR 设备上进行自适应。此封装容器可让您选择要从此行为中排除的任何组件。

添加 EnableXrComponentOverrides 封装容器，使您的应用适应适用于 XR 的 Material Design。

导航轨道

任何 Compose 布局（包括 NavigationSuiteScaffold）中的导航轨道都将自动适应 XR Orbiter。如需了解详情，请阅读 Material Design 准则。

导航栏

任何 Compose 布局（包括 NavigationSuiteScaffold）中的导航栏都将自动适应 XR Orbiter。如需了解详情，请阅读 Material Design 准则。

对话框

一个 BasicAlertDialog 将适应 XR，为组件添加抬升效果。

详细了解对话框和自适应设计准则。

顶部应用栏

一个 TopAppBar 将自动适应 XR Orbiter。

详细了解顶部应用栏和自适应设计准则。

适用于 XR 的列表-详情布局

XR 中的Compose Material 3 自适应布局具有 1:1 映射，其中每个窗格都放置在其自己的 XR 空间面板中。详细了解ListDetailPaneScaffold和自适应设计准则。

适用于 XR 的支持窗格布局

XR 中的Compose Material 3 自适应布局具有 1:1 映射，其中每个窗格都放置在其自己的 XR 空间面板中。详细了解SupportingPaneScaffold和自适应设计准则。

开始使用适用于 Figma 的 Material 3 设计套件进行设计

下载 Material 3 设计套件以开始使用

另请参阅

• 使用适用于 XR 的 Jetpack Compose 开发界面
• 空间界面设计准则