SwiftUI Academy · درس

انتقالات الإدراج والإزالة

حرّك ظهور الواجهات واختفاءها

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

بعض أجزاء هذا الدرس لم تُترجم بعد وتظهر باللغة الإنجليزية.

Views Coming and Going

When a view is added or removed, a transition describes how it animates in and out instead of just popping.

Transitions Need Animation

A transition only plays when the insertion or removal happens inside an animation, like a withAnimation toggle of a boolean.

The .transition Modifier

You attach .transition to the view that appears or disappears, choosing the style of its entrance and exit.

if show {
    Banner().transition(.opacity)
}

Fade with .opacity

The simplest transition is .opacity, which fades a view in when added and out when removed.

Slide In and Out

The .slide transition moves a view in from one edge and out the other, great for banners and rows.

.transition(.slide)

Scale to Grow

The .scale transition grows a view from small to full size on insert and shrinks it on removal.

.transition(.scale)

Move from an Edge

Use .move(edge:) to push a view in from a specific side, such as the bottom for a toast message.

.transition(.move(edge: .bottom))

Combine Transitions

Chain effects with .combined(with:) so a view can fade while it slides, giving richer motion.

.transition(.opacity.combined(with: .slide))

Asymmetric Transitions

With .asymmetric you set different insertion and removal effects, like scale in but fade out.

.transition(.asymmetric(
    insertion: .scale,
    removal: .opacity))

Trigger the Change

Wrap the boolean toggle in withAnimation so the conditional view runs its transition rather than appearing instantly.

withAnimation {
    show.toggle()
}

Transitions and Identity

SwiftUI plays a transition based on view identity: a view truly entering or leaving the hierarchy, not just changing values.

Quick Check

What is required for a transition to actually play?

Recap: Transitions

You learned that .transition styles how views enter and leave, from fades to slides to asymmetric combos, all triggered by animated changes. 🎬

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

هل درس «انتقالات الإدراج والإزالة» مجاني؟

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

ماذا ستتعلم في «انتقالات الإدراج والإزالة»؟

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

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

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

كم من الوقت يستغرق درس «انتقالات الإدراج والإزالة»؟

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

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

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

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

الرسوم المتحركة الضمنية
الرسوم المتحركة الصريحة باستخدام withAnimation
انتقالات الإدراج والإزالة
منحنيات التوقيت الزنبركية والمخصصة

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