حزم تطبيقات الويب

بحث
Dreamweaver

Dreamweaver

فتح التطبيق

عمل حزم تطبيقات الويب كتطبيقات هاتف جوال أصلية (الإصدار CS5.5)

يساعدك تكامل Dreamweaver مع jQuery Mobile وPhoneGap في إنشاء تطبيقات ويب وحزمها للنشر على الأجهزة المستندة إلى نظامي التشغيل Android™ وiOS. يستخدم Dreamweaver حزم تطوير البرامج من PhoneGap لإنشاء الحزمة (ملف .apk لجهاز Android/.xcodeproj لجهاز iPhone/iPad)

بمجرد حزم تطبيق هاتف محمول مع Dreamweaver، يمكنك عرضه في محاكي جهاز، أو نشره على جهازك الخاص.

ملاحظة:

تطبيق الهاتف المحمول الذي قمت بحزمه مع Dreamweaver هو تطبيق مخصص لأغراض التصحيح فقط. سيتم تشغيل التطبيق في برامج محاكاة Android وiOS، أو على جهازك المحمول الشخصي إذا قمت بالتحويل، ولكن لا يمكنك تحميل تصحيح تطبيقات الهاتف المحمول إلى متجري Apple وAndroid. ولكي تتمكن من تحميل تطبيقات iOS أو Android، يجب القيام بخطوة توقيعها الإضافية خارج Dreamweaver. لمزيد من المعلومات حول تحميل التطبيقات إلى متجري Apple وAndroid، راجع وثائق Android، أو دليل مستخدم البرنامج على Apple iOS Provisioning Portal. (قبل أن تتمكن من الوصول إلى Apple iOS Provisioning Portal، يجب التسجيل باستخدام Apple Developer Program [مجاني] والاشتراك في iOS Developer Program [رسوم سنوية].)

إنشاء تطبيق ويب باستخدام صفحة بداية التشغيل

يمكنك استخدام أي من صفحات بداية التشغيل لإنشاء تطبيق الويب الخاص بك. على الرغم من ذلك، إذا قام تطبيق الويب، عند نشره كتطبيق هاتف محمول، بالوصول إلى ميزات أصلية لأجهزة محمولة، فاستخدم الصفحة jQuery Mobile ‏(PhoneGap).

تحتوي صفحة بداية تشغيل jQuery Mobile ‏(PhoneGap) على الملف phonegap.js، بالإضافة إلى ملفات jQuery Mobile أخرى. يحتوي الملف phonegap.js على واجهات برمجة تطبيقات مطلوبة للعمل مع ميزات الهاتف المحمول الأصلية، مثل GPS ومقياس التسارع وكاميرا وما إلى ذلك.

  1. حدد File > ‏New.

  2. حدد Page From Sample > ‏Mobile Starters > ‏jQuery Mobile ‏(PhoneGap).

  3. انقر فوق Create.

  4. في اللوحة Insert ‏(Window > ‏Insert)، حدد jQuery Mobile. عندئذٍ يتم عرض المكونات التي يمكنك إضافتها إلى تطبيق الويب.

  5. في طريقة العرض Design، ضع المؤشر في المكان الذي تريد إدراج المكون فيه، وانقر فوق المكون في اللوحة Insert. في مربع الحوار الذي يظهر، قم بتخصيص المكونات باستخدام الخيارات.

    ملاحظة:

    لتحرير الملف PhoneGap.js، قم بتكوين إطار عمل التطبيق وإعدادات التطبيق. لمزيد من المعلومات، راجع الموضوعات التي تناقش إنشاء حزم التطبيقات.

قم بمعاينة الصفحة في طريقة العرض Live. يتم تطبيق بعض فئات CSS في طريقة العرض Live فقط.

متطلبات النظام لحزم التطبيقات

يجب التأكد من استيفاء متطلبات النظام التالية قبل متابعة حزم التطبيقات.

نظام التشغيل MAC OS - ‏iOS

  • إصدار Mac OS X Snow Leopard 10.6.x أو إصدار أحدث

  • Xcode 3.2.x مع iOS SDK (تعليمات التثبيت أدناه).

نظام التشغيل MAC OS - ‏Android

  • إصدار Mac OS X 10.5.8 أو إصدار أحدث (x86 فقط)

  • Android SDK (تعليمات التثبيت أدناه).

نظام التشغيل Windows - ‏iOS

  • إصدار iOS هو الوحيد المتوفر لمستخدمي أجهزة كمبيوتر Apple

نظام التشغيل Windows - ‏Android

  • نظام التشغيل Windows XP ‏(32 بت) أو Vista ‏(32 أو 64 بت) أو Windows 7 ‏(32 أو 64 بت)

  • Android SDK (تعليمات التثبيت أدناه).

إنشاء حزمة تطبيقات (نظام التشغيل Windows)

لمزيد من المعلومات حول إنشاء تطبيق ويب، بما في ذلك نماذج الملفات، راجع هذا التدريب على Dreamweaver Developer Center.

  1. افتح تطبيق الويب الذي تريد تحويله إلى تطبيق هاتف محمول. تأكد من إعداد تطبيق الويب كموقع في Dreamweaver، ومن أن حجم موقعك أقل من 25 ميغابايت.

    ملاحظة:

    تأكد من أن التطبيق يحتوي على ملفات HTML5 وCSS وJavaScript فقط.

  2. حدد Site > ‏Mobile Applications > ‏Configure Application Framework.

  3. انقر فوق Easy Install لتثبيت Android SDK.

    ملاحظة:

    في حالة فشل Easy Install، الرجاء مراجعة الملاحظة التقنية 90408.

  4. حدد موقعًا لتثبيت ملفات SDK به، وانقر فوق Select. بعد الانتهاء من التثبيت، انقر فوق Save.

  5. حدد Site > ‏Mobile Applications > ‏Application Settings.

  6. بالنسبة إلى Bundle ID، أدخل اسمًا للحزمة باستخدام المعلومات الموجودة في مربع الحوار.

  7. أدخل اسمًا للتطبيق، واسم الشخص الذي صمم التطبيق.

  8. حدد الخيارات التالية (اختياري):

    1. في Application Icon PNG، حدد ملف PNG لاستخدامه كرمز للتطبيق. يقوم Dreamweaver بتغيير حجم الرمز إلى الحجم القياسي إذا لم تقم بتغيير حجمه بالفعل.

    2. حدد مسار هدف للحزمة.

    3. لتنزيل أحدث مكونات SDK وتثبيتها من Google، انقر فوق Manage AVDs. استخدم Android SDK وAVD Manager لتحديث Android SDK. لمزيد من المعلومات حول استخدام المدير، راجع http://developer.android.com/sdk/adding-components.html.

      ملاحظة:

      عند النقر فوق Save، يتم نسخ الملف phonegap.js إلى جذر الموقع.

  9. قم بأحد الإجراءات التالية:

    • إذا كنت تقوم بنشر تطبيقك مباشرةً على جهاز، فحدد Site > ‏Mobile Applications > ‏Build. حدد نظام أساسي/جهاز للإصدار.

    • إذا أردت الاطلاع على الكيفية التي سيبدو عليها الإصدار على أحد برامج المحاكاة قبل إنشائه، فحدد Site > ‏Mobile Applications > ‏Emulate and Build.

إنشاء حزمة تطبيقات (نظام التشغيل Mac OS)

للاطلاع على تدريب حول إنشاء تطبيق ويب، بما في ذلك نماذج الملفات، راجع هذه المقالة على Dreamweaver Developer Center.

  1. افتح تطبيق الويب الذي تريد تحويله إلى تطبيق هاتف محمول. تأكد من إعداد تطبيق الويب كموقع في Dreamweaver، ومن أن حجم موقعك أقل من 25 ميغابايت.

    ملاحظة:

    تأكد من أن التطبيق يحتوي على ملفات HTML5 وCSS وJavaScript فقط.

  2. حدد Site > ‏Mobile Applications > ‏Configure Application Framework.

  3. قم بتثبيت SDK لنظام التشغيل iOS أو Android استنادًا إلى متطلباتك:

    • انقر فوق الارتباط Apple iOS Dev Center لتنزيل وتثبيت xcode وiOS SDK. يتم تثبيت التطبيق افتراضيًا إلى الدليل نظام التشغيل <رقم الإصدار>/المطور.

      قم بتسجيل الدخول إلى Dev Center باستخدام المعرف Apple ID. والتسجيل مجاني. لذا قم بإنشاء حساب إذا لم تكن مستخدمًا مسجلاً.

    ملاحظة:

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

    • انقر فوق Easy Install لتثبيت Android SDK.
    ملاحظة:

    في حالة فشل Easy Install، الرجاء مراجعة الملاحظة التقنية 90408.

  4. انقر فوق Save.

  5. حدد Site > ‏Mobile Applications > ‏Application Settings.

  6. في Bundle ID، أدخل اسمًا للحزمة باستخدام المعلومات الموجودة في مربع الحوار.

  7. أدخل اسمًا للتطبيق، واسم الشخص الذي صمم التطبيق.

  8. قم بالإجراءات التالية (اختياري):

    • (نظام التشغيل Android) في Application Icon PNG، حدد ملف PNG لاستخدامه كرمز لتطبيق Android. يقوم Dreamweaver بتغيير حجم الرمز إلى الحجم القياسي إذا لم تقم بتغيير حجمه بالفعل.

    • (نظام التشغيل Mac® OS 10.6.x) في Startup Screen PNG، حدد ملف PNG لاستخدامه كأيقونة لتطبيق iOS. يقوم Dreamweaver بتغيير حجم الرمز إلى الحجم القياسي إذا لم تقم بتغيير حجمه بالفعل.

    • (نظام التشغيل Mac OS 10.6.x) حدد أحد إصدارات iPhone/iPod Touch/iPad الذي تقوم بإنشاء الحزمة له.

    • حدد مسار هدف مختلفًا للحزمة.

    ملاحظة:

    عند النقر فوق Save، يتم نسخ الملف phonegap.js إلى جذر الموقع.

  9. قم بأحد الإجراءات التالية:

    • إذا كنت تقوم بنشر تطبيقك مباشرةً على جهاز، فحدد Site > ‏Mobile Applications > ‏Build. حدد نظام أساسي/جهاز للإصدار.

    • إذا أردت الاطلاع على الكيفية التي سيبدو عليها الإصدار على أحد برامج المحاكاة قبل إنشائه، فحدد Site > ‏Mobile Applications > ‏Emulate and Build.

المزيد مثل هذا

احصل على مساعدة بشكل أسرع وأسهل

مستخدم جديد؟

ارتباطات سريعة

عرض جميع خططك إدارة خططك
عرض الارتباطات السريعة
إخفاء الارتباطات السريعة

إشعارات قانونية    |    سياسة الخصوصية على الإنترنت