«طراحی مواد» مؤلفه‌ها و چیدمان‌هایی برای واقعیت گسترده ارائه می‌دهد. بااستفاده از کتابخانه Material 3، چیدمان‌های تطبیقی، و کتابخانه XR Compose Material 3، می‌توانید رفتارهای واسط کاربر فضایی را در برنامه Compose خود بسازید.
کتابخانه XR Compose Material 3 را به وابستگی‌های برنامه‌تان اضافه کنید تا از
Material 3 برای مؤلفه‌های XR استفاده کنید، یا مؤلفه‌های استاندارد Material 3 را
مستقیماً در Jetpack Compose برای محفظه‌های XR مثل Orbiter،
SpatialDialog، و SpatialPanel قرار دهید.
استفاده کردن از Material 3 برای مؤلفه‌های XR
کتابخانه androidx.xr.compose.material3 مؤلفه‌های Material 3 برای XR را برای الگوهای واسط کاربر فضایی رایج ارائه می‌دهد—ازجمله ریل‌ها و نوارهای پیمایش، نوارهای برنامه بالا، نوارهای ابزار شناور، کادرهای گفتگو، چیدمان‌های فهرست-جزئیات، و دکمه مبدل برای جابه‌جایی بین «فضای صفحه اصلی» و «فضای کامل». Spatial* فضایی‌شده
ترکیب‌پذیرها در این کتابخانه آزمایشی هستند و نیاز به موافقت با
@OptIn(ExperimentalMaterial3XrApi::class) دارند.
LocalSpatialCapabilities.current.isSpatialUiEnabled را بررسی کنید تا
«Material 3 برای XR» را وقتی میانای کاربر فضایی فعال است و مؤلفه‌های استاندارد Material 3 را وقتی میانای کاربر فضایی فعال نیست رندر کنید. برای اطلاعات بیشتر، به بررسی قابلیت‌های فضایی مراجعه کنید.
ریل پیمایش
از SpatialNavigationRail یا SpatialWideNavigationRail برای نمایش
ریل ناوبری Material 3 در Orbiter تراز شروع هنگام فعال بودن
واسط کاربر فضایی استفاده کنید. برای اطلاعات بیشتر، رهنمودهای Material Design را ببینید.
ریل پیمایش غیرفضایی
نرده‌ای پیمایش فضایی‌شده (سازگارشده با واقعیت گسترده)
نوار پیمایش
از SpatialNavigationBar یا SpatialShortNavigationBar برای نمایش
نوار پیمایش Material 3 در Orbiter تراز پایین هنگام فعال بودن
رابط کاربری فضایی استفاده کنید. برای اطلاعات بیشتر، رهنمودهای Material Design را ببینید.
نوار پیمایش غیرفضایی
نوار پیمایش فضایی (سازگار با واقعیت گسترده)
کادرهای گفتگو
از SpatialBasicAlertDialog برای نمایش کادر گفتگوی هشدار پایه در
SpatialDialog با ارتفاع فضایی استفاده کنید، یا محتوای کادر گفتگوی استاندارد Material 3 را مستقیماً در SpatialDialog قرار دهید.
برای اطلاعات بیشتر، کادرهای گفتگو و رهنمودهای طراحی تطبیقی را ببینید.
کادر گفتگوی غیرفضایی‌شده
کادر گفتگوی فضایی‌شده (سازگارشده با واقعیت گسترده)
نوار برنامه بالا
از SpatialTopAppBar یا SpatialTwoRowsTopAppBar برای نمایش
نوار برنامه بالایی Material 3 در داخل Orbiter ترازبالا هنگام فعال بودن
واسط کاربر فضایی استفاده کنید.
برای اطلاعات بیشتر، نوار برنامه بالا و رهنمودهای طراحی تطبیقی را ببینید.
نوار برنامه بالا غیرفضایی‌شده
نوار برنامه بالایی فضایی‌شده (سازگارشده با واقعیت گسترده)
چیدمان تفصیلی-فهرستی برای واقعیت گسترده
وقتی واسط کاربری فضایی فعال است، از SpatialListDetailPaneScaffold برای نمایش چیدمان فهرست-جزئیات تطبیقی Material 3 استفاده کنید که در آن هر قاب در SpatialPanel خودش قرار می‌گیرد. وقتی واسط کاربر فضایی فعال نیست، از
ListDetailPaneScaffold استفاده کنید. برای اطلاعات بیشتر، چیدمان
فهرست-جزئیات و رهنمودهای طراحی تطبیقی را ببینید.
ListDetailPaneScaffold غیرفضایی‌شده
ListDetailPaneScaffold فضایی‌شده (سازگارشده با واقعیت گسترده)
پشتیبانی از چیدمان قاب برای واقعیت گسترده
وقتی واسط کاربر فضایی فعال است، قاب اصلی و قاب پشتیبانی را در محفظه‌های SpatialPanel جداگانه در SpatialRow در Subspace قرار دهید. وقتی واسط کاربر فضایی فعال نیست، از
SupportingPaneScaffold استفاده کنید. برای اطلاعات بیشتر، پانل پشتیبانی
و رهنمودهای طراحی تطبیقی را ببینید.
SupportingPaneScaffold غیرفضایی‌شده
SupportingPaneScaffold فضایی‌شده (سازگار با واقعیت گسترده)
شروع طراحی با Material 3 Design Kit برای Figma
برای شروع، «کیت طراحی Material 3» را بارگیری کنید
همچنین مراجعه کنید به
- توسعه میانای کاربر با Jetpack Compose برای واقعیت گسترده
- انتقال از Home Space به Full Space
- دستورالعمل‌های طراحی میانای کاربر فضایی