تطوير تطبيقات الجوال

تطوير تطبيقات Flutter لأجهزة iOS وأندرويد

يتيح Flutter لفريق واحد بناء تطبيقي iOS وأندرويد من قاعدة شيفرة واحدة بلغة Dart، ويرسم محركه الخاص كل شاشة بنفسه. وهو مناسب للمنتجات التي تحتاج واجهة مخصصة ومتسقة على المنصتين. ويقلّ ملاءمة حين يعتمد التطبيق على ميزات خاصة بكل نظام، أو حين يجب أن يطابق شكل النظام الأصلي تمامًا. توضح هذه الصفحة كيف نقرر ذلك.

ابدأ مشروعك

متى يناسبك Flutter ومتى لا يناسبك

Flutter مجموعة أدوات لبناء الواجهات من Google. تكتب التطبيق مرة واحدة بلغة Dart وتبنيه لنظامي iOS وأندرويد. والتطبيق متعدد المنصات بهذه الطريقة يعني فريقًا واحدًا وقائمة مهام واحدة ومنطق عمل واحدًا.

يناسبك Flutter عندما:

  • يكون تصميمك مخصصًا ومرتبطًا بهويتك، وتريد أن يظهر بالشكل نفسه على المنصتين.
  • يجب على فريق صغير أن يطلق iOS وأندرويد معًا ويُبقي ميزاتهما متطابقة.
  • يتكون التطبيق في معظمه من شاشات ونماذج وقوائم وخرائط ومدفوعات تدعمها واجهة برمجية.

ويقلّ ملاءمة عندما:

  • يحتاج التطبيق إلى ميزات عميقة في الجهاز، مثل مسار تصوير مخصص أو واقع معزز أو بلوتوث في الخلفية أو تطبيقات الساعة وعناصر الشاشة الرئيسية. هذه تحتاج شيفرة أصلية، وكلما زادت حاجتك إليها قلّ ما يوفره Flutter. راجع تطوير تطبيقات iOS وأندرويد الأصلية.
  • تريد أحدث مظهر للنظام في يوم صدوره. يرسم Flutter عناصره بنفسه، فيصل المظهر الجديد متأخرًا.
  • حجم التحميل عامل حاسم. يحمل تطبيق Flutter محركه معه.
  • يعمل فريقك بـ TypeScript وReact، وهذا يشير إلى React Native. وتضع مقارنتنا Flutter أم React Native الخيارين جنبًا إلى جنب.

كيف يرسم Flutter تطبيقك

كثير من الأطر تغلّف أزرار المنصة وقوائمها الجاهزة. أما Flutter فيرسم كل نقطة على الشاشة بنفسه بمحرك رسم خاص به. وشاشتك شجرة من العناصر (widgets)، وهي قطع صغيرة قابلة للتركيب مثل النص والهوامش والأزرار، وعندما تتغير الحالة يعيد Flutter بناء العناصر المتأثرة فقط.

ولذلك يتصرف التخطيط والحركة بالطريقة نفسها على iOS وأندرويد. لكن الواجهة ليست مبنية من عناصر النظام الأصلية، فتحديد النص وإحساس التمرير وسلوك قارئ الشاشة كلها من تنفيذ Flutter، وتحتاج إلى فحص على أجهزة حقيقية. وتُترجم Dart في نسخ الإصدار مسبقًا إلى شيفرة أصلية، فاقِس الأداء دائمًا على نسخة إصدار أو نسخة قياس، لا على نسخة التطوير.

الأداء: ما الذي يجب مراقبته

يستطيع تطبيق Flutter أن يعمل بسلاسة بمعدل تحديث الشاشة، لكن عليك أن تحافظ على ذلك. والمشكلات التي نبحث عنها مبكرًا:

  • قوائم طويلة تُبنى كلها دفعة واحدة. استخدم البناء الكسول حتى تُنشأ الصفوف الظاهرة فقط.
  • أعمال ثقيلة على المسار الرئيسي. حلّل الاستجابات الكبيرة وعالج الصور في isolate منفصل، وهو أسلوب Dart في تشغيل الأعمال بالتوازي.
  • عناصر تُعاد بناؤها أكثر من اللازم. اجعل الحالة قريبة من مكان استخدامها.
  • صور أكبر من اللازم. فكّها بحجم العرض واحفظها في ذاكرة مؤقتة.

قس الأداء بأداة Flutter DevTools على هاتف حقيقي متوسط المواصفات، لا على محاكٍ. وضع ميزانية أداء صغيرة من البداية وراجعها في كل عرض أسبوعي.

الإضافات والشيفرة الأصلية

تصل معظم ميزات الجهاز إلى Flutter عبر إضافات (plugins) من سجل pub.dev: الكاميرا والموقع والإشعارات والتخزين الآمن. وإذا لم توجد إضافة، تكتب قطعة صغيرة بلغتي Swift وKotlin وتستدعيها من Dart عبر قناة المنصة، أو تضمّن عنصرًا أصليًا مثل الخريطة.

كل إضافة اعتماد على صيانة طرف آخر، وهي أكثر موضع تتعثر فيه مشاريع Flutter. قبل إضافة أي واحدة نفحص تاريخ آخر إصدار لها، وهل تدعم المنصتين معًا، ومن ينشرها، وما الأذونات التي تضيفها، ومدى صعوبة استبدالها.

إدارة الحالة وهيكلة التطبيق

لا يفرض Flutter طريقة واحدة لتنظيم التطبيق، فعلى الفريق أن يختار نمطًا ويطبقه في كل مكان. من أدوات إدارة الحالة الشائعة Provider وRiverpod وBloc، وأي منها يصلح ما دامت كل ميزة تتبعه.

والمبادئ أهم من المكتبة. افصل الواجهة عن الحالة والمنطق، وافصلهما عن طبقة البيانات (الواجهة البرمجية والتخزين وخدمات الجهاز). وضع الخدمات الخارجية خلف واجهات مجردة حتى تحاكيها الاختبارات، ونظّم الشيفرة حسب الميزة. هذا الهيكل هو ما يجعل التطبيق يكبر بعد نسخته الأولى دون أن يتحول إلى كتلة متشابكة.

اختبار تطبيق Flutter

يدعم Flutter عدة مستويات من الاختبار الآلي، وهي تعمل بأفضل صورة حين تُستخدم معًا:

  • اختبارات الوحدة لقواعد العمل ومنطق الحالة.
  • اختبارات العناصر التي تبني شاشة وتفحص ما تعرضه وكيف تستجيب.
  • اختبارات الصور المرجعية (golden) التي تقارن الشاشة بصورة محفوظة، ومنها ما يظهر بالعربية وبأحجام الخط الكبيرة.
  • اختبارات التكامل التي تشغّل التطبيق الحقيقي عبر تسجيل الدخول أو الدفع.

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

النشر على App Store وGoogle Play

يُسلَّم تطبيق Flutter في أرشيف iOS يُبنى بـ Xcode على جهاز Mac، وحزمة Android App Bundle لمتجر Google Play. وإعداد ذلك أسهل في بداية المشروع منه في أسبوع الإطلاق:

  • بيئتان منفصلتان للتجهيز والإنتاج، لكل منهما مفاتيحها.
  • التوقيع: شهادات Apple وملفات التهيئة، ومفتاح رفع لأندرويد.
  • مسار آلي يبني ويختبر ويوقّع مع كل تغيير.
  • توزيع تجريبي عبر TestFlight ومسارات الاختبار في Google Play.
  • صفحات المتجر وإقرارات الخصوصية بكل لغة تدعمها.

تختلف مدد المراجعة وقواعدها بين المتجرين وتتغير مع الوقت، فاترك هامشًا حول أي موعد إطلاق ثابت.

العربية والاتجاه من اليمين إلى اليسار في Flutter

يتبع Flutter اتجاه النص في لغة الجهاز ما دام التخطيط يستخدم البداية والنهاية بدل اليمين واليسار، كالهوامش والمحاذاة الاتجاهية. وعندها تعمل الشاشة نفسها بالإنجليزية والعربية. ويبقى التخطيط من اليمين إلى اليسار محتاجًا إلى عمل مقصود:

  • اعكس الأيقونات الاتجاهية مثل الأسهم، ولا تعكس الشعارات ولا أزرار الوسائط.
  • ضع النصوص في ملفات الترجمة، وتوقّع نصًا أطول أو أقصر.
  • نسّق التواريخ والأرقام والعملات بحسب اللغة والبلد.
  • اختبر النص المختلط بين العربية واللاتينية، وافحص ارتفاع السطر في الخط العربي.

نصمم كل شاشة ونراجعها بالاتجاهين منذ البداية. وللاطلاع على جانب التصميم راجع التصميم للعربية ومن اليمين إلى اليسار.

أمان تطبيقات Flutter

افترض أن كل ما داخل التطبيق يمكن قراءته. يبدأ كل مشروع لدينا بـمراجعة للتهديدات، وتنتج المراجعة الأمنية قبل الإطلاق قائمة إصلاحات مرتبة بالأولوية. وفي Flutter تكون الإجراءات المعتادة:

  • التخزين الآمن. احفظ الرموز والمفاتيح في Keychain على iOS وKeystore على أندرويد عبر إضافة للتخزين الآمن، ولا تحفظها في تفضيلات عادية.
  • تثبيت الشهادات. ثبّت المفتاح العام لواجهتك البرمجية، وأضف مفتاحًا احتياطيًا وخطط للتدوير، وإلا قد يمنع تغيير روتيني للشهادة المستخدمين من الدخول.
  • تشويش الشيفرة. يستطيع Flutter تشويش رموز Dart في نسخ الإصدار. احتفظ بملفات الرموز حتى تبقى تقارير الأعطال مقروءة. التشويش يبطّئ الهندسة العكسية ولا يمنعها.
  • الأجهزة المعدّلة (root وjailbreak). يمكن تجاوز الكشف عنها، فاعتبره إشارة واحدة: نبّه المستخدم، وقيّد الميزات الحساسة، وتحقق على الخادم.
  • لا أسرار داخل الحزمة. أبقِ المفاتيح الحقيقية على الخادم.

ويصلح معيار OWASP للتحقق من أمان تطبيقات الجوال (MASVS) قائمةً مرجعية. وتشمل خدمة الأمن السيبراني لدينا اختبار تطبيق الجوال قبل الإصدار، ويتعمق دليل تطوير التطبيقات الآمنة في الموضوع أكثر.

قاعدة عملية: اختر Flutter من أجل المنتج، لا من أجل قائمة الإضافات. إذا كانت أهم ثلاث ميزات عندك تحتاج كل منها إلى شيفرة أصلية مخصصة، فقارن التكلفة بالتطوير الأصلي قبل أن تلتزم.

أسئلة تصلنا كثيرًا

  • نعم، إذا كان المنتج يناسبه. يُترجم Flutter إلى شيفرة أصلية في الإصدار، وله أدوات ناضجة ومنظومة إضافات واسعة. والهيكلة واختيار الإضافات والاختبار على أجهزة حقيقية تحسم النتيجة أكثر من الإطار نفسه. ونحكم على الملاءمة خلال مرحلة الاستكشاف.

  • نعم. تصل معظم الميزات عبر الإضافات. وأي شيء لا تغطيه إضافة نكتبه بـ Swift أو Kotlin ونستدعيه من Dart عبر قناة المنصة. وإذا احتاجت حصة كبيرة من التطبيق إلى ذلك، فقد يكون التطوير الأصلي هو الطريق الأفضل.

  • نعم. يتبع Flutter اتجاه النص في لغة الجهاز ويدعم التوطين، بشرط أن يستخدم التخطيط البداية والنهاية بدل اليمين واليسار. وتبقى عليك أمور مثل عكس الأيقونات الاتجاهية واختبار النص المختلط بين العربية واللاتينية. نبني اللغتين ونراجعهما من أول شاشة.

  • يمكن أن يكون كذلك بالتصميم السليم. احفظ الأسرار في Keychain وKeystore، وثبّت الشهادات، وأبقِ الأسرار الحقيقية على الخادم، وراجع التطبيق قبل الإصدار. لا يجعل أي إطار التطبيق آمنًا بذاته. وتحدد مراجعة التهديدات في البداية الإجراءات التي يحتاجها كل تطبيق.

تابع الاستكشاف

هل أنت مستعد لبناء منتج آمن؟

حدّثنا عن منتجك، وسنرد بخطة واضحة.

ابدأ مشروعك

نود استخدام Microsoft Clarity لفهم كيف يستخدم الزوار الموقع حتى نحسّنه. يضع ملفات ارتباط ويبقى متوقفًا ما لم توافق. سياسة ملفات الارتباط