Grid هي واجهة برمجة تطبيقات في Jetpack Compose تتيح لك تنفيذ تنسيق ثنائي الأبعاد بمرونة.
باستخدام واجهة برمجة التطبيقات هذه، يمكنك عرض العناصر في تنسيقات متعددة الأعمدة أو متعددة الصفوف تتكيّف مع حجم الحاوية المتاحة.
Grid
كيف تختلف Grid عن الدوال المركّبة المشابهة؟
يوفّر Compose مكوّنات مشابهة، مثل LazyVerticalGrid.
هذه المكوّنات مخصّصة بشكل أساسي لعرض مجموعات البيانات الكبيرة والمتجانسة،
مثل عرض كتالوج المحتوى في تطبيق بثّ فيديو.
هذه المكوّنات غير مصمّمة
للتخطيط الهيكلي للشاشة أو المكوّنات المعقّدة.
يمكنك أيضًا تنفيذ تنسيق ثنائي الأبعاد
من خلال دمج عدة دوال مركّبة من النوع Row وColumn.
ومع ذلك، فإن هذا النهج له بعض الجوانب السلبية،
مثل التسلسلات الهرمية العميقة والصعوبات في القدرة على التكيف.
يقدم الجدول التالي نظرة عامة على التخطيطات المناسبة لكل واجهة برمجة تطبيقات:
| المكوّن | الغرض |
|---|---|
LazyVerticalGrid وLazyStaggeredGrid وLazyHorizontalGrid |
عرض مجموعات بيانات كبيرة ومتجانسة تتطلّب التحميل الكسول |
Row وColumn وFlexBox |
التخطيط أحادي البُعد |
Grid |
التخطيط ثنائي الأبعاد |
المصطلحات
يُرجى التعرّف على المصطلحات التالية لفهم آلية عمل Grid.
خط الشبكة
تتكون الشبكة من خطوط، والتي تعمل أفقيًا وعموديًا. إذا كانت شبكتك تحتوي على ثلاثة صفوف، فإنها تحتوي على أربعة خطوط أفقية، بما في ذلك الخط الذي يلي الصف الأخير. في الصورة التالية، يمثّل كل خط منقّط خط شبكة:
مسار الشبكة
مسار الشبكة هو المسافة بين خطَّي شبكة. يكون مسار الصف بين خطين أفقيين، ويكون مسار العمود بين خطين عموديين. لتحديد حجم هذه المسارات، يمكنك تعيين حجم لها عند إنشاء الشبكة.
خلية شبكة
خلية الشبكة هي تقاطع مسار صف وعمود.
مساحة الشبكة
تتكوّن منطقة الشبكة من عدة خلايا شبكة. يمكنك تحديد منطقة شبكة من خلال جعل عنصر يمتد على مسارات متعددة.
الفجوة بين المربّعات
فجوة الشبكة هي الهامش بين مسارات الشبكة. لا يمكنك وضع عنصر في واجهة المستخدم في فجوة، ولكن يمكنك توسيع عنصر في واجهة المستخدم عبرها.