ViewModifier: ما هو، معدّلات View في SwiftUI

ما هو ViewModifier في SwiftUI؟

ViewModifier هو بروتوكول SwiftUI يحدد عقداً لإنشاء معدّلات يمكن تطبيقها على أي نوع View. يتم تعريفه كـ protocol ViewModifier { associatedtype Body: View; func body(content: Content) -> Body }، حيث Content هو نوع الـ View الأصلية التي تم تمريرها إلى المعدّل.

ظهر بروتوكول ViewModifier في iOS 13 مع أول إصدار من SwiftUI ولا يزال مستقراً حتى iOS 18+ شاملاً. الهدف الرئيسي هو توفير آلية للمطورين لتغليف سلاسل المعدّلات المتكررة في نوع واحد قابل لإعادة الاستخدام. بدون ViewModifier، في كل مرة كنت تحتاج فيها إلى تطبيق نفس مجموعة الأنماط، كان عليك تكرار جميع المعدّلات يدوياً.

وفقاً لـ Swift by Sundell (2023)، ViewModifier هو الطريقة المفضلة لتنظيم الأنماط في مشاريع SwiftUI عندما يتم استخدام نفس مجموعة المعدّلات في ثلاثة أماكن أو أكثر. للتركيبات لمرة واحدة، يكفي سلسلة من المعدّلات المدمجة مباشرة على الـ View.

صيغة البروتوكول

يتطلب بروتوكول ViewModifier تطبيق method واحد body(content:) ويمكنه اختيارياً توفير خصائص لتخصيص السلوك عبر معاملات المُهيئ للمعدّل المخصص.

كيف يعمل بروتوكول ViewModifier

بروتوكول ViewModifier يحدد method body(content:)، الذي يستقبل الـ View الأصلية (نوع Content) ويعيد View معدّلة (نوع Body). SwiftUI يطبق المعدّل على الـ View بتمريرها كـ content ويستخدم النتيجة للعرض.

struct CardStyle: ViewModifier {
    func body(content: Content) -> some View {
        content
            .padding(16)
            .background(Color.white)
            .cornerRadius(12)
            .shadow(radius: 4, x: 0, y: 2)
    }
}

// الاستخدام:
Text("مرحباً، SwiftUI!")
    .modifier(CardStyle())

عندما تستدعي .modifier(CardStyle())، يقوم SwiftUI بإنشاء نسخة من ModifiedContent<Text, CardStyle> التي تخزن الـ View الأصلية والمعدّل. أثناء العرض، يستدعي SwiftUI CardStyle.body(content: text)، للحصول على View معدّلة مع padding وbackground وcornerRadius وshadow.

تمييز مهم: يتم استدعاء ViewModifier.body في كل مرة يتم فيها تحديث الـ View، لذلك لا ينبغي أن يكون داخل body حسابات ثقيلة أو آثار جانبية. إذا كان المعدّل يعتمد على بيانات خارجية (حالة، بيئة)، قم بتمريرها عبر معاملات المُهيئ.

المعدّلات المدمجة مقابل المخصصة: الفروقات

المعدّلات المدمجة في SwiftUI (font, foregroundColor, frame, padding) هي طرق تمديد لبروتوكول View تعيد نوع ModifiedContent. لا تطبق ViewModifier مباشرة — يستخدم SwiftUI تطبيقات داخلية محسّنة لكل معدّل مدمج.

ViewModifier المخصص يكون مبرراً عندما يتم استخدام نفس المجموعة من المعدّلات في مكانين أو أكثر. للتطبيقات لمرة واحدة، يفضل سلسلة معدّلات مباشرة — يبقى الكود قابلاً للقراءة ويحسّن المترجم بشكل أفضل.

وفقاً لـ WWDC 2023، توصي Apple بإنشاء ViewModifier مخصص للأنماط المرتبطة بنظام تصميم التطبيق: البطاقات، الأزرار، حقول الإدخال. هذا يضمن الاتساق ويبسّط الصيانة عندما يتغير التصميم.

أنماط استخدام ViewModifier

النمط 1: تغليف نظام التصميم. حالة الاستخدام الأكثر شيوعاً لـ ViewModifier هي إنشاء مصدر وحيد للحقيقة للأنماط البصرية في التطبيق. كل عنصر من عناصر نظام التصميم (بطاقة، زر، عنوان) يحصل على معدّله الخاص.

struct PrimaryButton: ViewModifier {
    var isEnabled: Bool

    func body(content: Content) -> some View {
        content
            .font(.headline.weight(.semibold))
            .foregroundColor(.white)
            .padding(EdgeInsets(top: 12, leading: 24, bottom: 12, trailing: 24))
            .background(isEnabled ? Color.blue : Color.gray)
            .cornerRadius(8)
            .opacity(isEnabled ? 1.0 : 0.6)
    }
}

النمط 2: التطبيق الشرطي للمعدّل. أحياناً تحتاج إلى تطبيق معدّل فقط تحت شرط معين. ViewModifier مع معامل منطقي يسمح بتغليف هذا المنطق داخل body.

النمط 3: تركيب المعدّلات. يمكن لـ ViewModifier تطبيق ViewModifier آخر داخل body الخاص به. هذا يسمح ببناء هرمية من المعدّلات، حيث يكون كل منها مسؤولاً عن جانبه الخاص من العرض البصري. على سبيل المثال، يمكن لـ CardStyle تطبيق ShadowStyle وBorderStyle داخلياً.

وفقاً لـ Point-Free (2024)، تركيب المعدّلات عبر ViewModifier مفضل على الوراثة: كل معدّل مسؤول عن مهمة واحدة، ويمكن دمجها بشكل مستقل. هذا يتبع مبدأ المسؤولية الواحدة في SwiftUI.

الأداء وتركيب المعدّلات

أداء ViewModifier يعتمد على عدد أغلفة ModifiedContent التي يتم إنشاؤها مع كل تطبيق. SwiftUI يحسّن سلاسل المعدّلات من خلال المقارنة (diffing) في مرحلة العرض، لكن العدد المفرط من المعدّلات يمكن أن يبطئ التحديثات.

تحسين: ادمج عدة معدّلات متسلسلة من نفس النوع (مثل padding متعدد) في واحد. استخدم PreferenceKey فقط عندما يكون ضرورياً حقاً — المعدّلات التي تقرأ التفضيلات تتسبب في تمريرة عرض إضافية.

قاعدة عامة: إذا كان الـ View يحتوي على أكثر من 10 معدّلات — استخرج بعضاً منها إلى ViewModifier مخصص. هذا سيحسّن قابلية القراءة ويسمح لـ SwiftUI بتحسين التحديثات. وفقاً لـ SwiftUI Lab (2024)، تجميع المعدّلات في ViewModifier يقلل وقت العرض بنسبة 15–30% للـ Views المعقدة.