تسريع عملية تطوير التطبيقات

بإستخدام
InjectionIII or HotReloading

من الامور التي نفتقدها اثناء تطوير التطبيقات الـ iOS هو مشاهدة التغيرات فوراً دون الحاجة الى إعادة تشغيل المشروع، لكن هذا الامر انتهى ، اليوم اقدملك حل جذري لهذه المشكلة.

كيف يعمل ؟

الأداة تقوم باستبدال التغيرات في الـ View فقط دون إعادة بناء التطبيق بالكامل، وبالتالي كل الذي تحتاجه إتباع الخطوات التي سوف اذكرها ، مع حفظ ملف الكود Command + S لتشاهد التغيير مباشرة في الـSimulator 

شرح الخطوات

تحميل البرنامج او الأداة الاساسية

توجد طريقتين لتحميل الاداة الاساسية وكل طريقة لها مميزاتها وعيوبها، لذا اختار الطريقة المناسبة لك.

ملاحظة مهمة : يجب أن يكون إسم الـ Xcode بإسم Xcode ويكون في داخل مجلد Application ، بما يعني في حال كأن بإسم مختلف مثل Xcode_13.4.1 لن تعمل الأدة !

لجعل الأداة تعمل في حال كان اسم الـ Xcode بإسم مختلف يتوجب عليك فتح برنامج الـ Terminal مع ملاحظة بأن اسم الـ Xcode في حاتلي هو Xcode_13.4.1 ، لذا السطر الذي سوف تكتبه في الـ Terminal سوف يكون

ln -s Xcode_13.4.1.app /Applications/Xcode.app

طريقة ١ : برنامج InjectionIII 

يمكنك تحميل من متجر التطبيقات من هنا او تحميل احدث نسخة من صفحة المشروع في Github من هنا

المميزات

لا حاجة الى ازالته من المشروع عند رفع المشروع الى الـ App Store 

العيوب

يتوجب عليك تشغيل البرنامج واختيار المشروع الذي تعمل عليه، في حال عدم تشغيل البرنامج لن تعمل هذه الطريقة

شرح الإستخدام

بعد تحميل البرنامج كل الي عليك تشغله وتضغط على زر Open Project وتختار مجلد المشروع الذي تريد إستخدام الاداة معاها

طريقة ٢ : مكتبة HotReloading  

يمكنك تحميلها من هنا ، الاسهل تثبيتها بإستخدام SPM وفقط تحتاج اول Package كما في الصورة التالية

المميزات

لا حاجة الى تثبيت البرنامج السابق، او اجبار المطورين في الفريق بتثبيته في اجهزتهم

العيوب

يتوجب عليك إزالة المكتبة من المشروع عند رفع المشروع الى الـ App Store  

شرح إستخدام الأداة في مشروعك

في الخطوات السابقة قمت بتحميل الاداة او المكتبة الاساسية، الان تحتاج تحمل المكتبة الذي تحتاجها لتفعيل الـ Hot Reload في مشروعك ، يمكنك تحميل مكتبة Inject من هنا، قم بتثبيتها بإستخدام SPM

خطوة أساسية لتجنب الأخطاء

بعد تثبيت المكتبتين السابقة او تحميل المكتبة السابقة والبرنامج. تحتاج الى اضافة سطر في Build Settings


- افتح المشروع في الـ Xcode
- أضغط على اسم المشروع
- اختار المشروع من قائمة Targets
- اضغط على Build Settings
- ابحث عن Other Linker Flag

قم بإضافة هذا السطر

-Xlinker -interposable -Xlinker -undefined -Xlinker dynamic_lookup

التطبيق لن يعمل على جهاز حقيقي بوجود هذا السطر ، لذا يفضل أن تعمل Scheme تحتوي على هذا السطر بحيث تكون مخصصه للاستخدام مع الـSimulator ، تستطيع مشاهدة هذا الفيديو لمعرفة الطريقة.

SwiftUI

بعد تحميل المكتبات في الخطوات السابقة واضافة السطر في  Other Linker Flag، كل الي عليك الان أن تفعل ٣ خطوات فقط في اي View تريد الأداة أن تعمل فيه

الخطوة الاولى : استيراد مكتبة Inject

import Inject

الخطوة الثانية : اضافة Observer

@ObservedObject private var io = Inject.observer

الخطوة الثالثه : اضافة Modifier

يجب اضافته في اخر View داخل الـ Body

.enableInjection()

صورة توضح الخطوات الثلاثه السابقة

لا حاجة لإزالة الاسطر السابقة من الـ View سيتم تجاهلها تماما عند رفع التطبيق للمتجر ، بما يعني كما هو الحال مع Previews Apple تزيله عند رفع التطبيق للمتجر

شاهد فيدية للنتيجة هنا ، تذكر يتوجب عليك حفظ الملف لمشاهدة التغيرات مباشرة اثناء عمل التطبيق في الـ Simulator 


قد تتسأل لماذا نعتمد عليها في حال وجود الـ Preview في SwiftUI ؟ 

السبب لأنه الـ Preview يعرض نصوص ثابته وليس بيانات فعليه للمشروع، في اوقات كثيره قد تريد أن تصلح Bug او تحسن الـ UI مع مشاهدة التغيرات في تطبيق فعلي

وايضا اوقات كثيره سوف تواجهة مشكلة في تشغيله لأي سبب كأن ، ولكن عند الاعتماد على هذه الاداة لن تواجه اي مشكلة !


UIKit

الخطوة الاولى : استيراد مكتبة Inject

import Inject

الخطوة الثانية : في UIKit يوجد نوعين

واحد للـ UIViewController

Inject.ViewControllerHost(// Your ViewController here)

لا حاجة لإزالة الاسطر السابقة من الـ ViewController سيتم تجاهلها من قبل النظام عند رفع التطبيق للـ App Store

مثال

يتوجب عليك حذف الـ Storyboard ، ومن ثم اضافة الـ Inject في اي ViewController

مثال لإضافته في RootViewController

بعد الخطوه السابقة تستطيع تصميم الـ ViewController بشكل الذي تريده ومن ثم حفظ الملف وسوف تلاحظ النتيجة مباشرة في الـ Simulator

لا تنسى في كل مره تظهر ViewController تحتاج تسخدمه، مثال عند عمل Push لـ ViewController

let viewController = Inject.ViewControllerHost(YourViewController()) rootViewController.pushViewController(viewController, animated: true)

والأخر مع UIView

Inject.ViewHost(// Your View Here)

ملاحظة : لا ادري في اي حالة سوف تحتاج الى استخدام الـ ViewHost ، لانه بمجرد استخدام الـ Inject.ViewControllerHost اي UIView بداخله سيتم تحديثه بشكل تلقائي عند حفظ الملف !


وصلنا لنهاية موضعنا، اتمنى يكون الشرح واضح وتستفيدوا
من هذه الاداة المذهله !