معرّف الإصدار العالمي (GRid)

‫Grid هي واجهة برمجة تطبيقات في Jetpack Compose تتيح لك تنفيذ تنسيق ثنائي الأبعاد بمرونة. باستخدام واجهة برمجة التطبيقات هذه، يمكنك عرض العناصر في تنسيقات متعددة الأعمدة أو متعددة الصفوف تتكيّف مع حجم الحاوية المتاحة.

تنسيق شبكة ثنائي الأبعاد مرن وقابل للتكيّف
الشكل 1: تنسيق ثنائي الأبعاد مرن وقابل للتكيّف مع Grid

كيف تختلف Grid عن الدوال المركّبة المشابهة؟

يوفّر Compose مكوّنات مشابهة، مثل LazyVerticalGrid. هذه المكوّنات مخصّصة بشكل أساسي لعرض مجموعات البيانات الكبيرة والمتجانسة، مثل عرض كتالوج المحتوى في تطبيق بثّ فيديو. هذه المكوّنات غير مصمّمة للتخطيط الهيكلي للشاشة أو المكوّنات المعقّدة.

يمكنك أيضًا تنفيذ تنسيق ثنائي الأبعاد من خلال دمج عدة دوال مركّبة من النوع Row وColumn. ومع ذلك، فإن هذا النهج له بعض الجوانب السلبية، مثل التسلسلات الهرمية العميقة والصعوبات في القدرة على التكيف.

يقدم الجدول التالي نظرة عامة على التخطيطات المناسبة لكل واجهة برمجة تطبيقات:

المكوّن الغرض
LazyVerticalGrid وLazyStaggeredGrid وLazyHorizontalGrid عرض مجموعات بيانات كبيرة ومتجانسة تتطلّب التحميل الكسول
Row وColumn وFlexBox التخطيط أحادي البُعد
Grid التخطيط ثنائي الأبعاد

المصطلحات

يُرجى التعرّف على المصطلحات التالية لفهم آلية عمل Grid.

خط الشبكة

تتكون الشبكة من خطوط، والتي تعمل أفقيًا وعموديًا. إذا كانت شبكتك تحتوي على ثلاثة صفوف، فإنها تحتوي على أربعة خطوط أفقية، بما في ذلك الخط الذي يلي الصف الأخير. في الصورة التالية، يمثّل كل خط منقّط خط شبكة:

تتكوّن الشبكة من أربعة خطوط أفقية وثلاثة خطوط عمودية.
الشكل 2 تتكوّن الشبكة من أربعة خطوط أفقية وثلاثة خطوط عمودية.

مسار الشبكة

مسار الشبكة هو المسافة بين خطَّي شبكة. يكون مسار الصف بين خطين أفقيين، ويكون مسار العمود بين خطين عموديين. لتحديد حجم هذه المسارات، يمكنك تعيين حجم لها عند إنشاء الشبكة.

مسار شبكة للصف الأول.
الشكل 3 مسار شبكة للصف الأول.

خلية شبكة

خلية الشبكة هي تقاطع مسار صف وعمود.

خلية شبكة تمثّل تقاطع الصف الثاني والعمود الثاني
الشكل 4. خلية شبكة تمثّل تقاطع الصف الثاني والعمود الثاني

مساحة الشبكة

تتكوّن منطقة الشبكة من عدة خلايا شبكة. يمكنك تحديد منطقة شبكة من خلال جعل عنصر يمتد على مسارات متعددة.

منطقة شبكة تتكوّن من أربع خلايا شبكة
الشكل 5 منطقة شبكة تتكوّن من أربع خلايا شبكة

الفجوة بين المربّعات

فجوة الشبكة هي الهامش بين مسارات الشبكة. لا يمكنك وضع عنصر في واجهة المستخدم في فجوة، ولكن يمكنك توسيع عنصر في واجهة المستخدم عبرها.

فجوة شبكة بين العمود الأول والعمود الثاني.
الشكل 6. فجوة شبكة بين العمود الأول والعمود الثاني.