0Pricing
Android Academy · درس

نظام Modifier

حدّد الحجم وأضف الحشو ونسّق باستخدام modifiers

نظام Modifier درس مجاني في Android Academy على CoddyKit. هذا هو الدرس 2 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Android Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Android Academy 4 دروس في المجموع.

ما هو Modifier؟

يعمل Modifier على تزيين composable أو تهيئته: حجمه، وحشوه الداخلي، وخلفيته، وسلوكه عند النقر، وغير ذلك. تقبل جميع composables تقريبًا معاملًا باسم modifier.

السَّلسلة

تُرتَّب المعدِّلات في سلسلة: إذ تُرجع كل دالة معدِّلًا جديدًا، ولذلك تستدعيها واحدة تلو الأخرى.

Modifier
    .padding(16.dp)
    .size(100.dp)
    .background(Color.LightGray)

تمرير Modifier

تمرّر السلسلة إلى معامل modifier الخاص بـ composable.

Text(
    text = "Hello",
    modifier = Modifier
        .padding(8.dp)
        .background(Color.Yellow)
)

الترتيب مهم!

يغيّر ترتيب المعدِّلات النتيجة. تُطبَّق المعدِّلات من اليسار إلى اليمين، بحيث يحيط كل منها بالآخر مثل الطبقات.

padding ثم background

يُطبَّق الحشو هنا أولًا، ولذلك تغطي الخلفية المنطقة الداخلية فقط، وتبقى المساحة التي أضافها الحشو شفافة.

Modifier
    .padding(16.dp)
    .background(Color.Red)

background ثم padding

عند تبديل الترتيب، تغطي الخلفية الآن المنطقة بأكملها، ويدفع الحشو المحتوى إلى الداخل. المعدِّلات نفسها، لكن المظهر مختلف — لأن الترتيب مهم.

Modifier
    .background(Color.Red)
    .padding(16.dp)

معدِّلات الحجم الشائعة

معدِّلات الحجم شائعة الاستخدام:

  • size(100.dp) — عرض وارتفاع ثابتان.
  • fillMaxWidth() — يشغل المساحة الأفقية كلها.
  • fillMaxSize() — يشغل كل المساحة المتاحة.
  • width() / height() — يضبط بُعدًا واحدًا.

قابل للنقر

يجعل Modifier.clickable أي composable يستجيب للنقرات — حتى Text أو Box عاديًا.

Text(
    text = "Tap me",
    modifier = Modifier.clickable { /* handle */ }
)

إعادة استخدام معامل Modifier

وفقًا للعرف المتّبع، تقبل composables المخصصة معاملًا باسم modifier: Modifier = Modifier وتمرّره إلى العنصر الجذري فيها. يتيح ذلك للجهات المستدعية تخصيص التخطيط من الخارج.

@Composable
fun Card(modifier: Modifier = Modifier) {
    Column(modifier = modifier) { /* ... */ }
}

Modifier هو المعامل الأول

العرف المتّبع: يأتي معامل modifier أولًا بين المعاملات الاختيارية، وتكون قيمته الافتراضية هي Modifier الفارغ. يحافظ ذلك على اتساق واجهة API الخاصة بك مع المكتبة القياسية.

تجميع العناصر معًا

مربع منسّق يستخدم سلسلة يكون ترتيبها مقصودًا.

Box(
    modifier = Modifier
        .size(120.dp)
        .background(Color(0xFFE86F00))
        .padding(12.dp)
) {
    Text(text = "Compose", color = Color.White)
}

تحقق سريع

لماذا يبدو Modifier.padding(16.dp).background(Color.Red) مختلفًا عن Modifier.background(Color.Red).padding(16.dp)؟

مراجعة

المعدِّلات:

  • تضبط الحجم والحشو والخلفية والنقرات وغير ذلك.
  • تُرتَّب في سلاسل وتُطبَّق بالترتيب — فالترتيب مهم.
  • ينبغي أن تعرض composables المخصصة معامل modifier: Modifier = Modifier بوصفه المعامل الأول.

الأسئلة الشائعة

هل درس «نظام Modifier» مجاني؟

نعم — نص درس «نظام Modifier» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Android Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Android Academy 4 دروس في المجموع.

ماذا ستتعلم في «نظام Modifier»؟

حدّد الحجم وأضف الحشو ونسّق باستخدام modifiers تتمرن على Android Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Android Academy؟

لا تُشترط خبرة سابقة. Android Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 4.

كم من الوقت يستغرق درس «نظام Modifier»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Android Academy هذا؟

نعم. كل درس في Android Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. Column وRow وBox
  2. نظام Modifier
  3. المحاذاة والترتيب
  4. القوائم باستخدام LazyColumn
← العودة إلى Android Academy