الرسوم المتحركة الضمنية مقابل الصريحة

أسلوبا الرسوم المتحركة

struct Demo: View {
  @State private var scale = 1.0
  var body: some View {
    Circle().scaleEffect(scale)
  }
}

الرسوم المتحركة الضمنية باستخدام .animation

Circle()
  .scaleEffect(scale)
  .animation(.easeInOut(duration: 0.3), value: scale)

تشغيل الرسوم المتحركة الضمنية

Button("Grow") {
  scale = 2.0  // .animation fires automatically
}

الرسوم المتحركة الصريحة باستخدام withAnimation

Button("Animate") {
  withAnimation(.spring()) {
    scale = 2.0
    offset = 50
  }
}

تحريك خصائص متعددة

withAnimation(.easeOut(duration: 0.5)) {
  isExpanded = true
  rotation = 90
  opacity = 0.5
}

أنواع الرسوم المتحركة

.spring(response: 0.4, dampingFraction: 0.6)
.easeInOut(duration: 0.3)
.linear(duration: 0.5)
.timingCurve(0.2, 0.8, 0.2, 1.0, duration: 0.4)

تعطيل الرسوم المتحركة

Circle()
  .scaleEffect(scale)
  .animation(.none, value: scale)  // no animation

أولوية الرسوم المتحركة

withAnimation(.linear) {
  value = true  // linear wins over any .animation on subviews
}

الرسوم المتحركة المتكررة

.animation(
  .easeInOut(duration: 0.8).repeatForever(autoreverses: true),
  value: pulsing
)

التأخير والسرعة

.animation(.spring().delay(0.2).speed(1.5), value: flag)

اختيار الرسوم المتحركة الضمنية أو الصريحة

// Implicit: simple, single view
.animation(.easeIn, value: isVisible)
// Explicit: multi-property or cross-view
withAnimation { a = 1; b = 2 }

اختبار سريع

مراجعة الدرس