Android Academy · درس

المحاذاة والترتيب

حدّد مواضع العناصر الفرعية بدقة

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

تحديد مواضع العناصر الفرعية

داخل Column أو Row، يتحكم إعدادان في مواضع العناصر الفرعية: alignment (عبر التخطيط) وarrangement (على امتداد التخطيط).

محاذاة Column

في Column، تتكدس العناصر الفرعية عموديًا. يتحكم horizontalAlignment في موضعها الأفقي — إلى اليسار أو الوسط أو اليمين.

Column(horizontalAlignment = Alignment.CenterHorizontally) {
    Text("Centered")
    Text("Also centered")
}

ترتيب Column

يتحكم verticalArrangement في كيفية توزيع العناصر الفرعية عموديًا — في الأعلى أو الوسط أو الأسفل أو بمسافات متساوية.

Column(verticalArrangement = Arrangement.Center) {
    Text("A")
    Text("B")
}

محاذاة Row

في Row ينعكس محورا التخطيط. يتحكم verticalAlignment في الموضع الرأسي للعناصر الفرعية، بينما يوزّعها horizontalArrangement أفقيًا.

Row(verticalAlignment = Alignment.CenterVertically) {
    Text("Left")
    Text("Right")
}

تذكّر الزوج

تلميح: يشير alignment إلى المحور المتقاطع، ويشير arrangement إلى المحور الرئيسي. في Column يكون المحور الرئيسي عموديًا، ولذلك نستخدم verticalArrangement وhorizontalAlignment.

خيارات الترتيب

القيم الشائعة لـ Arrangement:

Top / Bottom / Center
SpaceBetween — مسافات بين العناصر.
SpaceAround / SpaceEvenly

SpaceBetween

يدفع SpaceBetween العنصرين الأول والأخير إلى الحافتين، ويوزّع العناصر المتبقية بالتساوي — وهو مثالي لشريط علوي يضم عنوانًا على اليسار وأيقونة على اليمين.

Row(horizontalArrangement = Arrangement.SpaceBetween) {
    Text("Title")
    Text("Action")
}

Arrangement.spacedBy

يضيف Arrangement.spacedBy(8.dp) مسافة ثابتة بين كل عنصر فرعي — وهي الطريقة الأنظف لتوزيع عناصر القائمة بمسافات متساوية.

Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
    Text("One")
    Text("Two")
    Text("Three")
}

دمج spacedBy مع Alignment

يمكنك دمج الترتيب والمحاذاة معًا للتحكم الكامل في التخطيط.

Column(
    verticalArrangement = Arrangement.spacedBy(12.dp),
    horizontalAlignment = Alignment.CenterHorizontally
) {
    Text("Title")
    Button(onClick = {}) { Text("Go") }
}

محاذاة Box

بالنسبة إلى Box، استخدم contentAlignment لتحديد مواضع العناصر الفرعية، أو استخدم Modifier.align() على العناصر الفرعية الفردية لتحديد موضع كل عنصر على حدة.

Box(modifier = Modifier.fillMaxSize()) {
    Text(
        text = "Bottom",
        modifier = Modifier.align(Alignment.BottomCenter)
    )
}

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

صف رأسي مع قائمة موزعة بمسافات متساوية.

Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
    Row(horizontalArrangement = Arrangement.SpaceBetween) {
        Text("Inbox")
        Text("Edit")
    }
    Text("Message 1")
    Text("Message 2")
}

تحقق سريع

في Column، أي معامل يتحكم في الموضع الأفقي للعناصر الفرعية؟

مراجعة

تحديد المواضع:

Alignment = المحور المتقاطع؛ arrangement = المحور الرئيسي.
Column: horizontalAlignment + verticalArrangement.
Row: verticalAlignment + horizontalArrangement.
يضيف Arrangement.spacedBy() مسافات متساوية.

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

هل درس «المحاذاة والترتيب» مجاني؟

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

ماذا ستتعلم في «المحاذاة والترتيب»؟

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

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

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

كم من الوقت يستغرق درس «المحاذاة والترتيب»؟

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

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

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

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

← العودة إلى Android Academy