برنامه Android شما برای تلفن همراه یا صفحه‌نمایش بزرگ به‌طور پیش‌فرض در Android XR کار می‌کند، و به‌عنوان پانل دوبعدی در فضای سه‌بعدی نمایش داده می‌شود. می‌توانید ویژگی‌های فراگیر واقعیت گسترده را برای بهبود برنامه Android دوبعدی موجودتان اضافه کنید و آن را از تجربه صفحه‌نمایش تخت به محیط سه‌بعدی پویا تبدیل کنید.
هنگام آوردن برنامه Android خود به XR، این اصول مهم را درنظر بگیرید.
- قابلیت‌های فضایی: Android XR طیف متنوعی از ویژگی‌های فضایی را ارائه می‌دهد که برای برنامه شما دردسترس است، اما لازم نیست همه قابلیت‌ها را پیاده‌سازی کنید. آن‌هایی را که مکمل سلسله‌مراتب دیداری، چیدمان‌ها، و مسیرهای کاربر برنامه‌تان هستند به‌صورت راهبردی پیاده‌سازی کنید. برای ایجاد تجربه‌ای واقعاً فراگیر، محیط‌های سفارشی و پانل‌های متعدد را درنظر بگیرید. برای تعیین ادغام بهینه عناصر فضایی، به راهنمای طراحی میانای کاربر فضایی مراجعه کنید.
- واسط کاربر تطبیقی: واقعیت گسترده به شما انعطاف‌پذیری لازم را می‌دهد تا واسط کاربر جاداری طراحی کنید که به‌طور یکپارچه با بوم بی‌نهایت و پنجره‌هایی با قابلیت تغییر اندازه آزادانه سازگار شود. یکی از مهم‌ترین ملاحظات این است که از راهنمای طراحی صفحه‌نمایش بزرگ ما برای بهینه‌سازی چیدمان برنامه‌تان برای این محیط گسترده استفاده کنید. حتی اگر برنامه‌تان درحال‌حاضر فقط برای تلفن همراه باشد، همچنان می‌توانید از محیط‌های جذاب برای بهبود تجربه کاربری استفاده کنید، اما میانای کاربری‌ای که برای صفحه‌نمایش‌های بزرگ بهینه‌سازی شده باشد یکی از بهترین روش‌ها برای بهینه‌سازی برنامه‌تان برای Android XR است.
- چارچوب میانای کاربر: توصیه می‌کنیم میانای کاربر خود را با Jetpack Compose برای واقعیت گسترده بسازید. اگر برنامه‌تان به Views متکی است، کار با Views در XR را مرور کنید تا درباره بهره‌برداری از قابلیت همکاری Compose هنگام کار با Views بیشتر بدانید، یا کار مستقیم با کتابخانه Jetpack SceneCore را ارزیابی کنید.
- انتشار در «فروشگاه Play»: برای تأیید اینکه برنامه بهبودیافته با واقعیت گسترده شما در «فروشگاه Play» قابل‌کشف است:
- با برداشتن الزامات ویژگی‌های غیرضروری، برنامه‌تان را ساده‌تر کنید.
- برای جلوگیری از حذف برنامه‌تان از نتایج جستجوی «فروشگاه Play»، مطمئن شوید که برنامه‌تان از انتشار واقعیت گسترده در کنسول Google Play انصراف نداده باشد.
تبدیل کردن عناصر واسط کاربر دوبعدی به سه‌بعدی
دنبال کردن این نکات می‌تواند تفاوت بزرگی در ایجاد این حس که برنامه‌تان برای واقعیت گسترده بهینه‌سازی شده است ایجاد کند.
- سازگاری با صفحه‌نمایش بزرگ را در اولویت قرار دهید: مطمئن شوید میانای کاربر برنامه‌تان از اصول طراحی صفحه‌نمایش بزرگ پیروی می‌کند تا به تضمین خوانایی بهینه نوشتار و محتوا در محیط‌های گسترده واقعیت گسترده کمک کند.
- از ویژگی‌های فضایی به‌صورت استراتژیک استفاده کنید: لحظات کلیدی را در مسیر کاربر برنامه‌تان شناسایی کنید که در آن گنجاندن ویژگی‌های فضایی تجربه را بهبود می‌بخشد و از قابلیت‌های منحصربه‌فرد پلاتفرم بهره می‌برد.
- پانل‌های فضایی را با درنظر گرفتن راحتی کاربر قرار دهید: هنگام طراحی چیدمان با پانل‌های فضایی، آن‌ها را در فاصله‌ای مناسب از کاربر قرار دهید تا از احساس غرق شدن یا بیش‌ازحد نزدیک بودن جلوگیری شود.
- استفاده از میانای کاربر تطبیقی برای چیدمان‌های فضایی: از مفاهیم میانای کاربر تطبیقی مانند قاب‌ها و آشکارسازی تدریجی استفاده کنید تا چیدمان خود را به‌طور مؤثر به چندین پانل فضایی تجزیه کنید و ارائه اطلاعات را بهینه‌سازی کنید.
- از مدارگردها برای عناصر و الگوهای پایدار استفاده کنید: مدارگردها را برای عناصر پایدار و بافتاری تجربه کاربری مانند پیمایش و کنترل‌ها رزرو کنید. برای حفظ وضوح و جلوگیری از به‌هم‌ریختگی، استفاده از مدارگردها را محدود کنید.
- از ارتفاع به‌طور عاقلانه استفاده کنید: ارتفاع فضایی را برای مؤلفه‌های موقتی اعمال کنید که ثابت می‌مانند و با محتوا پیمایش نمی‌شوند. از برجسته کردن نواحی بزرگ اجتناب کنید تا از ناراحتی بصری جلوگیری شود و سلسله‌مراتب بصری متعادلی حفظ شود.
Jetpack Compose برای XR مؤلفه‌های جدیدی را معرفی می‌کند که بهبودهای XR را مدیریت می‌کنند تا
شما مجبور به انجام این کار نباشید. برای مثال، می‌توانید از SpatialPopup و
SpatialDialog برای جایگزین کردن همتایان دوبعدی آن‌ها استفاده کنید. این مؤلفه‌ها وقتی میانای کاربر فضایی دردسترس نباشد، به‌صورت میانای کاربر دوبعدی معمولی نشان داده می‌شوند و وقتی میانای کاربر فضایی دردسترس باشد، میانای کاربر فضایی برنامه‌تان را نشان می‌دهند. استفاده از آن‌ها به سادگی ایجاد یک تغییر تک‌خطی برای جایگزین کردن عنصر میانای کاربر دوبعدی مربوطه است.
تبدیل کردن کادر گفت‌وگو به SpatialDialog
// Previous approach Dialog( onDismissRequest = onDismissRequest ) { MyDialogContent() } // New XR differentiated approach SpatialDialog( onDismissRequest = onDismissRequest ) { MyDialogContent() }
تبدیل بالاپر به SpatialPopup
// Previous approach Popup(onDismissRequest = onDismissRequest) { MyPopupContent() } // New XR differentiated approach SpatialPopup(onDismissRequest = onDismissRequest) { MyPopupContent() }
ارتقا دادن عناصر میانای کاربر دوبعدی
وقتی می‌خواهید واسط کاربری را با کنترل دقیق‌تر ارتقا دهید،
SpatialElevation را ارائه می‌دهیم تا به شما امکان دهد هر ترکیب‌پذیری را در برنامه‌تان به سطحی
بالاتر از پانل فضایی در محور Z که با SpatialElevationLevel تنظیم کرده‌اید ارتقا دهید.
این کار به جلب توجه کاربر کمک می‌کند، سلسله‌مراتب بهتری ایجاد می‌کند، و
خوانایی را بهبود می‌بخشد، همان‌طور که در مثال زیر نشان داده شده است.
// Elevate an otherwise 2D Composable (signified here by ComposableThatShouldElevateInXr). SpatialElevation(elevation = SpatialElevationLevel.Level4) { ComposableThatShouldElevateInXr() }
نکات کلیدی درباره کد
- مناطق و سطوح بزرگ مانند برگه‌های پایین و برگه‌های کناری را فضایی یا مرتفع نکنید.
- عناصر میانای کاربر را که با محتوا پیمایش‌پذیر هستند بالا نبرید.
انتقال دادن مؤلفه‌های دوبعدی به مدارگردها
مدارگردها عناصر شناوری هستند که معمولاً حاوی کنترل‌هایی هستند که کاربر می‌تواند با آن‌ها تعامل داشته باشد. مدارگردها را می‌توان به پانل‌های فضایی یا موجودیت‌های دیگر مانند چیدمان‌های فضایی متصل کرد. این برگه‌ها به محتوا اجازه می‌دهند فضای بیشتری داشته باشد و به کاربران امکان می‌دهند بدون مسدود کردن محتوای اصلی، دسترسی سریع به ویژگی‌ها داشته باشند.
ریل پیمایش غیرفضایی
نرده‌ای پیمایش فضایی‌شده (سازگارشده با واقعیت گسترده)
کد نمونه زیر نشان می‌دهد که چگونه می‌توانید یک مؤلفه میانای کاربری دوبعدی را به یک مدارگرد منتقل کنید.
// Previous approach NavigationRail() // New XR differentiated approach Orbiter( position = OrbiterPosition.TopStart( horizontalEdgeAlignment = OrbiterPosition.EdgeAlignment.Outside, offset = DpVolumeOffset(x = dimensionResource(R.dimen.start_orbiter_padding)) ) ) { NavigationRail() }
نکات کلیدی درباره مدارگردها
- مدارگردها مؤلفه‌هایی هستند که برای متصل کردن عناصر واسط کاربر موجود به پانل فضایی طراحی شده‌اند
- راهنمای طراحی برنامه Android XR ما را ببینید تا بررسی کنید کدام عناصر را باید برای مدارگردها منتقل کنید و از کدام الگوها باید اجتناب کنید.
- توصیه می‌کنیم فقط چند مؤلفه پیمایش را تطبیق دهید، مانند ریل پیمایش، نوار برنامه بالا، یا نوار برنامه پایین.
- وقتی واسط کاربری فضایی فعال نباشد، Orbiters نشان داده نمی‌شود. برای مثال، این برنامه‌ها در «فضای خانه» یا در دستگاه‌هایی مثل تلفن، رایانه لوحی، و دستگاه تاشو نشان داده نمی‌شوند.
انتقال دادن مؤلفه‌های دوبعدی به پانل‌های فضایی
پانل‌های فضایی واحدهای سازنده اصلی میانای کاربری برنامه‌های Android XR هستند.
پانل‌ها به‌عنوان محتوی برای عناصر میانای کاربر، مؤلفه‌های تعاملی، و محتوای فراگیر عمل می‌کنند. هنگام طراحی، می‌توانید مؤلفه‌هایی مانند مدارگردها را برای کنترل‌های کاربر اضافه کنید و عناصر میانای کاربر را به‌صورت فضایی ارتقا دهید تا توجه را به تعاملات خاص جلب کنید.
نکات کلیدی درباره کد
- برای تأیید اینکه کدام عناصر را به پانل‌ها منتقل کنید و برای الگوهایی که باید از آن‌ها اجتناب کنید، به راهنمای طراحی برنامه Android XR مراجعه کنید.
- روال‌های مطلوب برای قرار دادن پانل فضایی را دنبال کنید:
- پانل‌ها باید در مرکز و در فاصله ۱٫۵ متری از چشم کاربر ظاهر شوند.
- محتوا باید در ۴۱ درجه مرکزی میدان دید کاربر نشان داده شود.
- پانل‌ها با حرکت کاربر در جای خود باقی می‌مانند. لنگراندازی فقط برای گذر مستقیم دردسترس است.
- برای پانل‌ها، از گوشه‌های گرد ۳۲ dp توصیه‌شده سیستم استفاده کنید.
- هدف‌های لمسی باید ۵۶ پیکسل مستقل از تراکم و حداقل ۴۸ پیکسل مستقل از تراکم باشند.
- نسبت‌های کنتراست را برای خوانایی حفظ کنید، به‌ویژه اگر از پس‌زمینه‌های شفاف استفاده می‌کنید.
- اصول رنگ طراحی Android را دنبال کنید و از سیستم رنگ طراحی مواد برای پیاده‌سازی زمینه‌های تیره و روشن برای برنامه‌تان استفاده کنید.
- از Spatial Panels API با عناصر میانای کاربر موجود استفاده کنید.
انتقال واسط کاربر دوبعدی به یک پانل فضایی
به‌طور پیش‌فرض، برنامه‌تان با یک پانل در Home Space نشان داده می‌شود. با نحوه
انتقال بین «فضای خانه» و «فضای کامل» آشنا شوید. برای آوردن آن محتوا به «فضای کامل»، می‌توانید از SpatialPanel استفاده کنید.
در اینجا مثالی از نحوه انجام این کار آورده شده است.
if (LocalSpatialCapabilities.current.isSpatialUiEnabled) { Subspace { SpatialPanel( modifier = SubspaceModifier.movable().resizable(), ) { AppContent() } } } else { AppContent() }
انتقال واسط کاربر دوبعدی به چند پانل فضایی
می‌توانید از یک پانل فضایی واحد برای واسط کاربر برنامه‌تان استفاده کنید، یا می‌توانید
واسط کاربر دوبعدی‌تان را به چند پانل فضایی منتقل کنید. اگر تصمیم بگیرید از چند پانل برای واسط کاربر برنامه‌تان استفاده کنید، می‌توانید پانل‌ها را بچرخانید و موقعیت آن‌ها را تغییر دهید (مشابه چیدمان واسط کاربر در حالت دوبعدی). ابتدا با یک چشم‌انداز طراحی واضح از آنچه می‌خواهید به‌دست آورید شروع می‌کنید، و سپس می‌توانید از Spatial UI Layout APIs (SpatialBox،
SpatialRow، SpatialColumn، SpatialSpacer،
SpatialAlignment) و اصلاح‌کننده‌های زیرفضا برای موقعیت‌یابی و چرخاندن پانل‌ها استفاده کنید.
چند الگوی کلیدی وجود دارد که هنگام پیاده‌سازی چند پانل باید از آن‌ها اجتناب کنید.
- از هم‌پوشانی پانل‌ها که مانع دیدن اطلاعات مهم توسط کاربر می‌شود اجتناب کنید.
- از سردرگم کردن کاربر با پانل‌ها خودداری کنید.
- از قرار دادن پانل‌ها در مکان‌های نامناسب یا غیرقابل‌توجه خودداری کنید. مثال: پانل‌هایی که پشت کاربر قرار می‌گیرند به‌سختی قابل‌مشاهده هستند.
- برای کسب اطلاعات بیشتر درباره توسعه واسط کاربر فضایی، راهنمای کامل ما را بررسی کنید.
محتوای غیرفضایی‌شده
کنترل‌های رسانه فضایی‌شده (سازگار با «واقعیت گسترده») در چرخان و محتوای تقسیم‌شده به چند پانل فضایی
SpatialRow { SpatialPanel( SubspaceModifier .width(384.dp) .height(592.dp) ) { StartSupportingPanelContent() } SpatialPanel( SubspaceModifier .height(824.dp) .width(1400.dp) ) { App() } SpatialPanel( SubspaceModifier .width(288.dp) .height(480.dp) ) { EndSupportingPanelContent() } }
افزودن قابلیت‌های فضایی
پس‌از مفهوم‌سازی و شروع تبدیل مؤلفه‌های میانای کاربری دوبعدی به سه‌بعدی، می‌توانید به قابلیت‌های فضایی دیگری که می‌توانید به برنامه‌تان اضافه کنید نیز نگاهی بیندازید تا به ایجاد تجربه‌ای متمایزتر برای Android XR کمک کنید.
بررسی قابلیت‌های فضایی
وقتی تصمیم می‌گیرید که عنصر میانای کاربر خاصی را نمایش دهید یا نه، از بررسی
دستگاه‌ها یا حالت‌های XR خاص اجتناب کنید. بررسی دستگاه‌ها یا حالت‌ها به‌جای قابلیت‌ها می‌تواند هنگام تغییر قابلیت‌های دستگاهی خاص درطول زمان مشکلاتی ایجاد کند. به‌جای آن، از
LocalSpatialCapabilities.current.isSpatialUiEnabled برای بررسی مستقیم
قابلیت‌های فضایی‌سازی لازم استفاده کنید، همان‌طور که در مثال زیر نشان داده شده است.
این رویکرد تضمین می‌کند که برنامه‌تان به‌درستی با طیف گسترده‌ای از تجربه‌های «واقعیت گسترده» سازگار می‌شود، بدون اینکه هربار که دستگاه‌های جدیدی عرضه می‌شوند یا قابلیت‌ها تغییر می‌کنند، نیاز به به‌روزرسانی داشته باشد.
if (LocalSpatialCapabilities.current.isSpatialUiEnabled) { SupportingInfoPanel() } else { ButtonToPresentInfoModal() } // Similar check for audio val spatialAudioEnabled = LocalSpatialCapabilities.current.isSpatialAudioEnabled
از محیط‌ها برای تغییر دادن اطراف کاربر استفاده کنید
وقتی می‌خواهید با تغییر دادن محیط اطراف کاربر، احساس غوطه‌وری در برنامه‌تان ایجاد کنید، می‌توانید این کار را با محیط‌ها انجام دهید. افزودن محیط در کد تغییری ساده است که می‌توانید بدون تأثیر قابل‌توجهی بر رابط کاربری موجود برنامه‌تان انجام دهید. برای اطلاعات بیشتر درباره تنظیم محیط‌ها، حتماً راهنمای کامل ما را بررسی کنید.
افزودن محتوای سه‌بعدی
محتوای سه‌بعدی مانند مدل‌های سه‌بعدی و ویدیو فضایی می‌تواند به ایجاد تجربه فراگیرتر و افزودن درک فضایی کمک کند. برنامه‌تان فقط زمانی می‌تواند محتوای سه‌بعدی نشان دهد که قابلیت‌های فضایی دردسترس باشد، بنابراین بهتر است ابتدا بررسی کنید که آیا قابلیت‌های فضایی دردسترس هستند یا نه.
برای افزودن مدل‌های سه‌بعدی، ویدیو فضایی، یا صدای فضایی، به راهنمای مربوطه مراجعه کنید.