اختبار القيادة

اختبار القيادة:

 

تشرح هذه الصفحة كيفية إنشاء تطبيق Flutter جديد من أحد القوالب (templates)، وتشغيله ، وتجربة “إعادة التحميل السريع” (hot reload) بعد إجراء تغييرات على التطبيق.

حدد بيئة التطوير التي تختارها لكتابة تطبيقات Flutter وإنشائها وتشغيلها (Android Studio أوVS Code أو Terminal & Editor).

Android Studio and IntelliJ:

قم بإنشاء التطبيق من خلال الخطوات التالية:

  1. افتح ال IDE واختر Create New Flutter Project.
  2. من خانة project type اختر Flutter Application واضفط التالي.
  3. تحقق من أن مسار Flutter SDK يحدد موقع الـSDK (اختر Install SDK… إذا كان الحقل فارغًا).
  4. أدخل اسم المشروع، (myapp) مثلا. واضغط التالي.
  5. اضغط Finish.
  6. انتظر ريثما يقوم Android Studio بتثبيت الـ SDK وإنشاء المشروع.

ملاحظة: عند إنشاء تطبيق Flutter جديد ، تطلب بعض مكونات Flutter IDE الإضافية رابط موقع الشركة (company domain name) التي تعمل لصالحها مرتباً بترتيب عكسي ، مثل com.example. يتم استخدام ال domain name واسم المشروع معًا كاسم حزمة (package name) لنظام Android (معرّف حزمة (Bundle ID) لنظام iOS) عند إصدار التطبيق على متجري Google play و App store. إذا كنت تعتقد أن التطبيق قد يتم رفعه على المتاجر، فمن الأفضل تحديد اسم الحزمة الآن. إذ لا يمكن تغيير اسم الحزمة بمجرد إصدار التطبيق، لذا اجعل الاسم فريدًا (unique).

تقوم الأوامر المذكورة أعلاه بإنشاء مجلد مشروع Flutter يسمى myapp يحتوي على تطبيق تجريبي بسيط يستخدم الـ Material Components.

تلميح: كود التطبيق موجود في الملف lib/main.dart. للحصول على وصف بسيط لما تقوم به كل كتلة تعليمات برمجية ، راجع التعليقات في الجزء العلوي من هذا الملف.

قم بتشغيل التطبيق:

  1. لاحظ شريط أدوات Android Studio الرئيسي:

  1. في الـ target selector، حدد جهاز Android لتشغيل التطبيق. إذا لم يتم إدراج أي منها على أنه متاح، فاضغط على Tools> Android> AVD Manager وأنشئ محاكيا هناك. للحصول على تفاصيل حول إنشاء محاكي، راجع Managing AVDs.
  2. انقر فوق أيقونة التشغيل (Run) في شريط الأدوات، أو قم بالضغط على عنصر القائمة Run > Run.

بعد اكتمال إنشاء التطبيق ، سترى التطبيق على جهازك.

قم بتجريب Hot Reload:

تسرع Flutter عملية تطوير التطبيقات من خلال ميزة Stateful Hot Reload، وهي القدرة على إعادة تحميل كود تطبيق قيد التشغيل مباشرةً دون إعادة تشغيل أو فقدان حالة التطبيق.

قم بإجراء تغيير على كود التطبيق ، واضغط زر Hot Reload ، وشاهد التغيير مباشرة على الجهاز المتصل أو المحاكي.

  1. افتح الملف lib/main.dart.
  2. قم بتغيير السلسلة المحرفية string التالية:

‘You have pushed the button this many times’

إلى

‘You have clicked the button this many times’

ملاحظة مهمة: لا توقف تطبيقك. دع تطبيقك على حاله.

  1. احفظ تغييراتك: من خلال الضغط على Save All من القائمة، أو انقر على Hot Reload.

سترى الstring الجديدة في التطبيق الذي ما زال قيد التشغيل على الفور تقريبًا.

تشغيل التطبيق في وضع Profile ووضع Release:

ملاحظة مهمة: لا تختبر أداء تطبيقك أثناء تمكين وضع التصحيح (debug) ووضع إعادة التحميل السريع (hot reload).

أنت الآن تشغل تطبيقك في وضع التصحيح (debug mode). يقدم الـdebug mode ميزات مفيدة للمطور مثل hot reload أو step debugging ولكنه يقدم هذه الميزات على حساب أداء التطبيق (app performance). فمن المتوقع أثناء تشغيل التطبيق في ال Debug mode أن ترى أداءً بطيئًا ورسومًا متحركة (animations) سيئة.

لمزيد من التفاصيل حول هذا الموضوع، راجع صفحة “أوضاع بناء تطبيق Flutter” (Flutter’s build modes).

ملاحظة مهمة: إذا كنت قلقًا بشأن حجم تطبيقك، فراجع صفحة “قياس حجم التطبيق الخاص بك“.

Visual Studio Code:

قم بإنشاء التطبيق من خلال الخطوات التالية:

  1. اضغط على View > Command Palette.
  2. اكتب Flutter ثم اختر Flutter: New Application Project.
  3. أدخل اسم المشروع، (myapp) مثلا. واضغط enter.
  4. اختر المجلد الذي ترغب بإنشاء المشروع ضمنه.
  5. انتظر حتى يكتمل إنشاء المشروع ويظهر ملف main.dart.

تقوم الأوامر المذكورة أعلاه بإنشاء مجلد مشروع Flutter يسمى myapp يحتوي على تطبيق تجريبي بسيط يستخدم الـ Material Components

ملاحظة: عند إنشاء تطبيق Flutter جديد ، تطلب بعض مكونات Flutter IDE الإضافية رابط موقع الشركة (company domain name) التي تعمل لصالحها مرتباً بترتيب عكسي ، مثل com.example. يتم استخدام ال domain name واسم المشروع معًا كاسم حزمة (package name) لنظام Android (معرّف حزمة (Bundle ID) لنظام iOS) عند إصدار التطبيق على متجري Google play و App store. إذا كنت تعتقد أن التطبيق قد يتم رفعه على المتاجر، فمن الأفضل تحديد اسم الحزمة الآن. إذ لا يمكن تغيير اسم الحزمة بمجرد إصدار التطبيق، لذا اجعل الاسم فريدًا (unique).

تحذير: إذا كان VS Code قيد التشغيل أثناء عملية تثبيت منصة Flutter ، فقد تحتاج إلى إعادة تشغيله حتى يتمكن Flutter plugin الخاص بـ VS Code من اكتشاف Flutter SDK.

تلميح: كود التطبيق موجود في الملف lib/main.dart. للحصول على وصف بسيط لما تقوم به كل كتلة تعليمات برمجية ، راجع التعليقات في الجزء العلوي من هذا الملف.

قم بتشغيل التطبيق:

  1. لاحظ VS Code status bar (الشريط الأزرق أسفل النافذة):

  1. من الـ Device Selector ، حدد جهاز Android لتشغيل التطبيق. للحصول على مزيد من التفاصيل حول هذا الموضوع ، راجع صفحة التبديل بين أجهزة Flutter بشكل سريع.
  2. قم بالضغط على عنصر القائمة Run > Start Debugging ، أو اضغط F5.
  3. انتظر حتى يتم تشغيل التطبيق – يمكنك متابعة التقدم في عملية تشغيل التطبيق ضمن جزء الـ Debug Console.

بعد اكتمال إنشاء التطبيق ، سترى التطبيق على جهازك.

قم بتجريب Hot Reload:

تسرع Flutter عملية تطوير التطبيقات من خلال ميزة Stateful Hot Reload، وهي القدرة على إعادة تحميل كود تطبيق قيد التشغيل مباشرةً دون إعادة تشغيل أو فقدان حالة التطبيق.

قم بإجراء تغيير على كود التطبيق ، واضغط زر Hot Reload ، وشاهد التغيير مباشرة على الجهاز المتصل أو المحاكي.

  1. افتح الملف lib/main.dart.
  2. قم بتغيير السلسلة المحرفية string التالية:

‘You have pushed the button this many times’

إلى

‘You have clicked the button this many times’

ملاحظة مهمة: لا توقف تطبيقك. دع تطبيقك على حاله.

  1. احفظ تغييراتك: من خلال الضغط على Save All من القائمة، أو انقر على Hot Reload.

سترى الstring الجديدة في التطبيق الذي ما زال قيد التشغيل على الفور تقريبًا.

تشغيل التطبيق في وضع Profile ووضع Release:

ملاحظة مهمة: لا تختبر أداء تطبيقك أثناء تمكين وضع التصحيح (debug) ووضع إعادة التحميل السريع (hot reload).

أنت الآن تشغل تطبيقك في وضع التصحيح (debug mode). يقدم الـdebug mode ميزات مفيدة للمطور مثل hot reload أو step debugging ولكنه يقدم هذه الميزات على حساب أداء التطبيق (app performance). فمن المتوقع أثناء تشغيل التطبيق في ال Debug mode أن ترى أداءً بطيئًا ورسومًا متحركة (animations) سيئة.

لمزيد من التفاصيل حول هذا الموضوع، راجع صفحة “أوضاع بناء تطبيق Flutter” (Flutter’s build modes).

ملاحظة مهمة: إذا كنت قلقًا بشأن حجم تطبيقك، فراجع صفحة “قياس حجم التطبيق الخاص بك“.

Terminal and editor:

قم بإنشاء التطبيق:

وذلك من خلال تنفيذ الامر flutter create ضمن محرر الأوامر:

يقوم الأمر السابق بإنشاء مجلد مشروع Flutter يسمى myapp يحتوي على تطبيق تجريبي بسيط يستخدم الـ Material Components.

تلميح: كود التطبيق موجود في الملف lib/main.dart. للحصول على وصف بسيط لما تقوم به كل كتلة تعليمات برمجية ، راجع التعليقات في الجزء العلوي من هذا الملف.

قم بتشغيل التطبيق:

  1. تأكد من وجود جهاز Android متصل وذلك من خلال تنفيذ الامر التالي flutter devices:

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

  1. قم بتشغيل التطبيق من خلال تنفيذ الامر التالي flutter run:

بعد اكتمال إنشاء التطبيق ، سترى التطبيق على جهازك.

قم بتجريب Hot Reload:

تسرع Flutter عملية تطوير التطبيقات من خلال ميزة Stateful Hot Reload، وهي القدرة على إعادة تحميل كود تطبيق قيد التشغيل مباشرةً دون إعادة تشغيل أو فقدان حالة التطبيق.

قم بإجراء تغيير على كود التطبيق ، واضغط زر Hot Reload ، وشاهد التغيير مباشرة على الجهاز المتصل أو المحاكي.

  1. افتح الملف lib/main.dart.
  2. قم بتغيير السلسلة المحرفية string التالية:

‘You have pushed the button this many times’

إلى

‘You have clicked the button this many times’

ملاحظة مهمة: لا توقف تطبيقك. دع تطبيقك على حاله.

  1. احفظ التغييرات.
  2. اكتب الحرف r ضمن نافذة محرر الأوامر.

سترى الstring الجديدة في التطبيق الذي ما زال قيد التشغيل على الفور تقريبًا.

تشغيل التطبيق في وضع Profile ووضع Release:

ملاحظة مهمة: لا تختبر أداء تطبيقك أثناء تمكين وضع التصحيح (debug) ووضع إعادة التحميل السريع (hot reload).

أنت الآن تشغل تطبيقك في وضع التصحيح (debug mode). يقدم الـdebug mode ميزات مفيدة للمطور مثل hot reload أو step debugging ولكنه يقدم هذه الميزات على حساب أداء التطبيق (app performance). فمن المتوقع أثناء تشغيل التطبيق في ال Debug mode أن ترى أداءً بطيئًا ورسومًا متحركة (animations) سيئة.

لمزيد من التفاصيل حول هذا الموضوع، راجع صفحة “أوضاع بناء تطبيق Flutter” (Flutter’s build modes).

ملاحظة مهمة: إذا كنت قلقًا بشأن حجم تطبيقك، فراجع صفحة “قياس حجم التطبيق الخاص بك“.

 

Leave a Comment

Your email address will not be published. Required fields are marked *

en_USEN