SwiftUI Academy · درس

إعادة الترتيب باستخدام onMove

اسحب الصفوف لإعادة ترتيبها

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

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

Let Users Reorder Rows

Sometimes order matters, like a to-do priority list. SwiftUI lets people drag rows into a new order with almost no extra code. ✨

Meet onMove

The onMove modifier sits on your ForEach and enables drag handles so rows can be picked up and dropped elsewhere.

The Move Signature

onMove gives you two things: an IndexSet of the rows being moved and an Int destination index where they should land.

func move(from source: IndexSet,
          to destination: Int) {
}

One Array Method Does It

Swift arrays have a built-in move(fromOffsets:toOffset:) that performs the reorder for you in a single, safe call.

items.move(fromOffsets: source,
           toOffset: destination)

Wiring onMove Up

Attach onMove(perform:) to the ForEach and point it at your move function. The list now supports drag-to-reorder.

ForEach(items) { item in
    Text(item.name)
}
.onMove(perform: move)

Edit Mode Reveals Handles

Drag handles often appear only in edit mode. An EditButton in the toolbar flips the list into editing so users can reorder.

.toolbar {
    EditButton()
}

Reorder Without Edit Mode

Inside a plain List, rows are frequently draggable straight away. Edit mode mainly matters when you also expose delete and move controls.

State Keeps Order Persistent

Because move() mutates your @State array, the new order survives view refreshes and reflects everywhere that array is read.

Combine Move and Delete

You can attach both onMove and onDelete to the same ForEach, giving users full control to reorder and remove rows.

ForEach(items) { Text($0.name) }
    .onDelete(perform: delete)
    .onMove(perform: move)

Inline Move Closure

Like delete, you can write the reorder inline. Just call move(fromOffsets:toOffset:) directly inside the onMove closure.

.onMove { source, dest in
    items.move(fromOffsets: source,
               toOffset: dest)
}

Smooth Drag Animations

SwiftUI animates the lift, slide, and settle of dragged rows automatically. You get polished motion with zero animation code.

Quick Check

What does onMove provide to your handler?

Recap: Reordering

You added drag-to-reorder by attaching onMove to a ForEach and calling move(fromOffsets:toOffset:) on your state array. 🎉

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

هل درس «إعادة الترتيب باستخدام onMove» مجاني؟

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

ماذا ستتعلم في «إعادة الترتيب باستخدام onMove»؟

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

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

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

كم من الوقت يستغرق درس «إعادة الترتيب باستخدام onMove»؟

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

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

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

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

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