استخدام عناصر مضمّنة بتصميم Material 3

لتسهيل الاستخدام، تتعامل العديد من الدوال المركّبة المضمّنة في Material 3 (androidx.compose.material3) مع المساحات المتروكة بنفسها، استنادًا إلى كيفية وضع الدوال المركّبة في تطبيقك وفقًا لمواصفات Material.

الدوال المركّبة لمعالجة المساحات الداخلية

في ما يلي قائمة بمكوّنات Material التي تتعامل تلقائيًا مع الأجزاء الداخلية.

أشرطة التطبيقات

• TopAppBar / CenterAlignedTopAppBar / MediumTopAppBar / LargeTopAppBar: يطبّق الجانبَين العلوي والأفقي من أشرطة النظام كحشو لأنّه يُستخدَم في أعلى النافذة.
• ‫BottomAppBar: لتطبيق الجانبَين السفلي والأفقي من أشرطة النظام كمساحة متروكة

حاويات المحتوى

• ‫ModalDrawerSheet / DismissibleDrawerSheet / PermanentDrawerSheet (المحتوى داخل لائحة تنقّل مشروطة): يتم تطبيق الهوامش العمودية والبادئة على المحتوى.
• ‫ModalBottomSheet: تطبّق المساحات الداخلية السفلية.
• ‫NavigationBar: لتطبيق المساحات الداخلية السفلية والأفقية
• ‫NavigationRail: لتطبيق الهوامش العمودية والبادئة.

Scaffold

توفّر دالة Scaffold تلقائيًا الهوامش كمعلمة PaddingValues لتتمكّن من استخدامها. لا يطبّق Scaffold الأجزاء المقتطعة على المحتوى، بل تقع هذه المسؤولية على عاتقك. على سبيل المثال، لاستخدام هذه الأجزاء مع LazyColumn داخل Scaffold:

Scaffold { innerPadding ->
    // innerPadding contains inset information for you to use and apply
    LazyColumn(
        // consume insets as scaffold doesn't do it by default
        modifier = Modifier.consumeWindowInsets(innerPadding),
        contentPadding = innerPadding
    ) {
        // ..
    }
}
InsetsSnippets.kt

يعرض الفيديو التالي LazyColumn ضمن Scaffold مع إيقاف ميزة "العرض على كامل الشاشة" وتفعيلها:

يكفي بشكل عام استخدام مَعلمة PaddingValues في Scaffold لإدراج واجهة المستخدم بعيدًا عن واجهة مستخدم النظام والصور المقطوعة للشاشة. تجنَّب استخدام طرق إضافية للتعامل مع الحواف، مثل المساطر أو معدِّلات المساحة المتروكة أو معدِّلات حجم الحواف، في حال استخدام Scaffold لتجنُّب تطبيق مساحة متروكة كبيرة جدًا على واجهة المستخدم.

تجاوز الإعدادات التلقائية للهوامش

يمكنك تغيير مَعلمة windowInsets التي تم تمريرها إلى الدالة المركّبة لضبط سلوك الدالة المركّبة. يمكن أن تكون هذه المَعلمة نوعًا مختلفًا من مجموعة النوافذ التي يتم تطبيقها بدلاً من ذلك، أو يمكن إيقافها من خلال تمرير مثيل فارغ: WindowInsets(0, 0, 0, 0).

على سبيل المثال، لإيقاف معالجة المساحة المتروكة في LargeTopAppBar، اضبط المَعلمة windowInsets على مثيل فارغ:

LargeTopAppBar(
    windowInsets = WindowInsets(0, 0, 0, 0),
    title = {
        Text("Hi")
    }
)
InsetsSnippets.kt