SnapKit لـ Swift: دليل شامل مع أمثلة

ما هو SnapKit ولماذا نحتاجه؟

\n\n

SnapKit هي مكتبة DSL (لغة خاصة بالمجال) قوية وأنيقة للعمل مع Auto Layout في تطبيقات iOS و macOS و tvOS و watchOS المكتوبة بلغة Swift. إذا سبق لك كتابة القيود (constraints) يدويًا باستخدام واجهة برمجة التطبيقات القياسية من Apple، فأنت تعلم مدى الإسهاب وصعوبة القراءة التي قد تصل إليها. يحل SnapKit هذه المشكلة من خلال توفير بناء جملة نظيف وبديهي يجعل كود التخطيط يبدو وكأنه لغة إنجليزية عادية.

\n\n

لماذا نحتاج SnapKit؟

\n

\n
• قابلية قراءة الكود: بدلاً من سلاسل الاستدعاءات الطويلة NSLayoutConstraint(item:attribute:relatedBy:toItem:attribute:multiplier:constant:)، تكتب view.snp.makeConstraints { $0.center.equalToSuperview() }.
\n
• سرعة التطوير: يصبح التخطيط أسرع لأن الكود أقصر وأسهل للفهم.
\n
• أمان الأنواع: يستخدم SnapKit الكتابة الصارمة في Swift، مما يقلل من احتمالية حدوث أخطاء وقت التشغيل.
\n
• المرونة: يدعم جميع إمكانيات Auto Layout: الأولويات، نسب الأبعاد، تحديث وإعادة تعريف القيود.
\n
• مجتمع نشط: المكتبة مستخدمة على نطاق واسع في الصناعة، ولها توثيق ممتاز وعدد كبير من الأمثلة.
\n

\n\n

تثبيت SnapKit

\n\n

يمكن تثبيت SnapKit باستخدام أحد مديري التبعيات الشائعين لـ Swift. فيما يلي التعليمات لكل من Swift Package Manager (SPM) و CocoaPods.

\n\n

1. Swift Package Manager (الطريقة الموصى بها)

\n

SPM هو مدير الحزم المدمج في Xcode. إنها الطريقة الأسهل والأكثر حداثة.

\n

\n
1. في Xcode، افتح مشروعك.
\n
2. انتقل إلى File → Add Packages...
\n
3. في حقل البحث، أدخل عنوان مستودع SnapKit: https://github.com/SnapKit/SnapKit.git
\n
4. اختر الإصدار المطلوب (يوصى بأحدث إصدار مستقر) وانقر على Add Package.
\n
5. تأكد من إضافة الحزمة إلى هدفك (target).
\n

\n\n

2. CocoaPods

\n

إذا كنت تستخدم CocoaPods، أضف السطر التالي إلى ملف Podfile الخاص بك:

\n

platform :ios, '12.0'\nuse_frameworks!\n\ntarget 'YourAppTarget' do\n  pod 'SnapKit', '~> 5.6.0'\nend

\n

ثم نفذ الأمر pod install في الطرفية داخل مجلد مشروعك.

\n\n

3. Carthage (الأقل شيوعًا)

\n

أضف إلى Cartfile:

\n

github "SnapKit/SnapKit" ~> 5.6.0

\n

نفذ carthage update وأضف الإطار (framework) إلى المشروع.

\n\n

بداية سريعة مع مثال كود

\n\n

لنقم بإنشاء شاشة بسيطة تحتوي على مربع أحمر اللون متمركز في منتصف الشاشة. هذا هو "Hello, World!" الكلاسيكي للتخطيط.

\n\n

import UIKit\nimport SnapKit\n\nclass ViewController: UIViewController {\n\n    override func viewDidLoad() {\n        super.viewDidLoad()\n        setupUI()\n    }\n\n    private func setupUI() {\n        // 1. إنشاء view\n        let redView = UIView()\n        redView.backgroundColor = .red\n        view.addSubview(redView)\n\n        // 2. تطبيق SnapKit للتخطيط\n        redView.snp.makeConstraints { make in\n            make.center.equalToSuperview() // تمركز بالنسبة للعنصر الأب\n            make.width.height.equalTo(100) // العرض والارتفاع = 100\n        }\n    }\n}

\n\n

ماذا يحدث هنا؟

\n

\n
• redView.snp.makeConstraints هي نقطة الدخول إلى DSL الخاص بـ SnapKit. snp هي خاصية خاصة يضيفها SnapKit إلى جميع UIView.
\n
• داخل الإغلاق (closure)، نحصل على الكائن make (ConstraintMaker) الذي نستخدمه لوصف القيود.
\n
• make.center.equalToSuperview() يضبط مركز الـ view ليكون مساويًا لمركز العرض الأب.
\n