Orbiter هو مكوّن مكاني يمكنك إرفاقه
بلوحة مكانية مقابلة أو مكوّن تنسيق مكاني مثل
SpatialColumn أو SpatialRow أو SpatialBox. يحتوي الشريط العائم
عادةً على عناصر التنقّل وبنود العمل المستندة إلى السياق والمتعلّقة بالكيان
الذي تم تثبيته عليه. على سبيل المثال، إذا أنشأت لوحة مكانية لعرض محتوى الفيديو، يمكنك إضافة عناصر التحكّم في تشغيل الفيديو داخل لوحة عائمة.
إنشاء مركبة مدارية
كما هو موضّح في المثال التالي، يمكنك استدعاء عنصر التحكّم العائم داخل التنسيق الثنائي الأبعاد في
SpatialPanel لتضمين عناصر تحكّم المستخدم، مثل التنقّل. يؤدي ذلك إلى استخراجها
من التنسيق الثنائي الأبعاد وإرفاقها باللوحة المكانية وفقًا
لإعداداتك.
Subspace { SpatialPanel( SubspaceModifier .height(824.dp) .width(1400.dp) .resizable() .movable(), ) { SpatialPanelContent() OrbiterExample() } }
@Composable fun OrbiterExample() { Orbiter( position = OrbiterPosition.BottomCenter( verticalEdgeAlignment = OrbiterPosition.EdgeAlignment.Outside, offset = DpVolumeOffset(y = 96.dp) ), ) { Surface(Modifier.clip(CircleShape)) { Row( Modifier .background(color = Color.Black) .height(100.dp) .width(600.dp), horizontalArrangement = Arrangement.Center, verticalAlignment = Alignment.CenterVertically ) { Text( text = "Orbiter", color = Color.White, fontSize = 50.sp ) } } } }
نقاط رئيسية حول الرمز
- بما أنّ المدارات هي مكوّنات مكانية لواجهة المستخدم، يمكن إعادة استخدام الرمز في التنسيقات الثنائية أو الثلاثية الأبعاد. في التنسيق الثنائي الأبعاد، يعرض تطبيقك المحتوى داخل Orbiter فقط ويتجاهل Orbiter نفسه.
- اطّلِع على إرشادات التصميم لمزيد من المعلومات حول كيفية استخدام وتصميم المدارات.
تثبيت الأشرطة العائمة على اللوحات والتنسيقات المكانية
يمكنك تثبيت لوحة عائمة في SpatialPanel ومكوّنات التنسيق المكاني
المُعلَن عنها في Compose. يتضمن ذلك تعريف لوحة التحكّم في التنسيق المكاني
لعناصر واجهة المستخدم، مثل SpatialRow أو SpatialColumn أو
SpatialBox. يتم تثبيت المدار في العنصر الرئيسي الأقرب إلى مكان
تعريفه.
يتم تحديد سلوك المدار من خلال مكان تعريفه:
- في تنسيق ثنائي الأبعاد مضمَّن في
SpatialPanel(كما هو موضّح في مقتطف الرمز السابق)، يتم تثبيت المدار فيSpatialPanel. - في
Subspace، يتم تثبيت Orbiter بأقرب كيان أصلي، وهو التنسيق المكاني الذي تم تعريف Orbiter فيه.
يوضّح المثال التالي كيفية تثبيت لوحة عائمة في صف مكاني:
Subspace { SpatialRow { Orbiter( position = OrbiterPosition.TopCenter( verticalEdgeAlignment = OrbiterPosition.EdgeAlignment.Outside, offset = DpVolumeOffset(y = 8.dp) ), shape = SpatialRoundedCornerShape(size = CornerSize(50)) ) { Text( "Hello World!", style = MaterialTheme.typography.titleMedium, modifier = Modifier .background(Color.White) .padding(16.dp) ) } SpatialPanel( SubspaceModifier .height(824.dp) .width(1400.dp) ) { Box( modifier = Modifier .background(Color.Red) ) } SpatialPanel( SubspaceModifier .height(824.dp) .width(1400.dp) ) { Box( modifier = Modifier .background(Color.Blue) ) } } }
نقاط رئيسية حول الرمز
- عند تعريف orbiter خارج تخطيط ثنائي الأبعاد، يتم ربط orbiter بأقرب كيان أصلي له. في هذه الحالة، يتم تثبيت الإعلان المداري في أعلى
SpatialRowالذي تم تعريفه فيه. - تتضمّن التنسيقات المكانية، مثل
SpatialRowوSpatialColumnوSpatialBox، كيانات بدون محتوى مرتبطة بها. لذلك، يتم تثبيت المدار المُعلن عنه في تنسيق مكاني على ذلك التنسيق.