SwiftUI Academy · درس

إنشاء شريط علامات تبويب

اجمع الشاشات ضمن TabView مع تسميات

الدرس 1 من 413 خطوة

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

ما الذي يفعله شريط علامات التبويب؟

يوجد tab bar أسفل التطبيق، ويتيح للمستخدمين الانتقال بين عدد قليل من الشاشات الرئيسية بنقرة واحدة. 📱

تعرّف إلى TabView

في SwiftUI، تنشئ ذلك الشريط باستخدام TabView. فهو يحتوي على عدة شاشات ولا يعرض إلا واحدة في كل مرة.

TabView {
    HomeScreen()
    SettingsScreen()
}

كل عنصر فرعي هو علامة تبويب

يصبح كل view موضوع مباشرةً داخل TabView علامة tab واحدة. ويعني وجود viewين فرعيين وجود علامتي تبويب في الشريط.

تسمية علامة تبويب

من دون تسمية، لا تعرض علامة التبويب شيئًا مفيدًا. يمنح المعدّل tabItem كل علامة تبويب أيقونتها ونصها.

HomeScreen()
    .tabItem {
        Label("Home", systemImage: "house")
    }

استخدام Label داخل tabItem

تضع عادةً داخل tabItem عنصر Label، الذي يجمع عنوانًا مع رمز SF لإضفاء مظهر أصلي ومرتب.

مثال بعلامتي تبويب

يعرض TabView كامل هنا علامتي تبويب: Home وSettings، لكل منهما icon وشاشته الخاصة.

TabView {
    HomeScreen()
        .tabItem { Label("Home", systemImage: "house") }
    SettingsScreen()
        .tabItem { Label("Settings", systemImage: "gear") }
}

شاشة واحدة في كل مرة

يبقي TabView كل علامات التبويب حية، لكنه يعرض العلامة selected فقط. ويؤدي النقر على علامة أخرى إلى تبديل الشاشة المرئية فورًا.

موضع TabView

اجعل TabView هو view root لتطبيقك، لكي يظل الشريط ظاهرًا مهما كانت علامة التبويب النشطة.

أبقِ عدد علامات التبويب قليلًا

يعرض iOS ما يصل إلى خمس علامات تبويب بشكل مريح. استهدف ثلاثة إلى خمسة أقسام واضحة حتى لا يشعر المستخدمون بالضياع. ✨

علامات التبويب مستقلة

تدير كل علامة تبويب محتواها الخاص. ولا يؤدي التمرير أو التحرير في علامة إلى reset العلامات الأخرى عند التبديل بينها.

مظهر أصلي تلقائيًا

لأن TabView مدمج في النظام، تحصل تلقائيًا على المظهر القياسي والتمويه وanimations التي يتوقعها مستخدمو iOS.

اختبار سريع

لنتحقق من كيفية منح علامة التبويب أيقونتها وعنوانها.

مراجعة: إنشاء شريط علامات التبويب

يحوّل TabView كل view فرعية إلى علامة تبويب، ويمنح tabItem كل علامة تسميتها لكي ينتقل المستخدمون بين الشاشات بنقرة واحدة. 🎉

البدء مجانًا

تعلم Swift مع معلم ذكاء اصطناعي — مجانًا

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

الدورات
30
الدروس
120

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

هل درس «إنشاء شريط علامات تبويب» مجاني؟

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

ماذا ستتعلم في «إنشاء شريط علامات تبويب»؟

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

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

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

كم من الوقت يستغرق درس «إنشاء شريط علامات تبويب»؟

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

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

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

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

  1. إنشاء شريط علامات تبويب
  2. عناصر علامات التبويب والشارات
  3. ربط علامة التبويب المحددة
  4. دمج علامات التبويب مع حاويات التكديس
← العودة إلى SwiftUI Academy