افضل طريقة لتحويل موقع الى تطبيق بالاندرويد ستوديو

 رمضان مبارك كريم وكل عام وانتم  بالف خير 

في غالب الاحيان تحتاج الى تطوير خدماتك على موقعك وتوسيع عدد زوار الموقع للوصول الى اعلى عدد ممكن من المستخدمين فانك تحتاج للوصول الى منصات مختلفه وتطبيقات لانظمه تشغيل مختلفه تطبيق الاندرويد هو افضل وسيله للوصول الى عدد لا باس به من

المستخدمين الدائمين

فوائد تحويل تطبيق الويب الى منصة الاندرويد :

1- الوصول الى مستخدمين دائمين من خلال تثبيت التطبيق على الاجهزة

2 - الاستفادة من الاعلانات الخاصة بكل من admob و adsense

3 - تسهيل تصفح الموقع للهواتف وبقاء المستخدم لاكثر مدة ممكنة على عكس الحاسوب

4 - هناك تقنيات اخرى لم اتطرق لها في هذه التدوينة كالبقاء على تواصل مع المستخدم من خلال الاشعارات لكل المواضيع الجديدة والاستفتاء

قبل الولوج الى الشرح ننصحك ايضا بزيارة تدوينات ذات صلة :

عبر الرابط التالي

https://guercifzone-ar.blogspot.com/search/label/Android?&max-results=5

المعطيات : 

لدي موقع  على blogger من غوغل 

يحتوي  الموقع على رموز خاصة بادسنس

يحتوي على  اكثر من 200 تدوينة في ما يخص  البرمجة 

لما لم  استخدم  خدمات google api  ؟ 

ببساطة  انا من محبي  المجانيات ولاارغب  في انفاق فلس على  خواص يمكنني  الحصول عليها  بطريقة مجانية خدمات  غوغل  المجانية  محدودة الى 1000  نقرة كل 24 ساعة  ثم تتوقف الخدمة  نهيك عن صعوبة  الحصول عليها وتحتاج  الى  ان  تدفع  لكي تحصل على  نقرات زيارة جديدة على  تطبيقك وهذه ليست  بخطوة  عملية  لانجاح مشروع موقع قد يكون  تجاري وانت  تنفق قبل ان تكسب  فلس واحد 

المشروع بالكامل ستجده على  github قم  بفتح حساب وعمل frok للمشورع  لكي تحمله على حسابك او على  جهازك من  خلال  الرابط  التالي https://github.com/guercifzone/arZone   المشروع  بالكامل بالجافا ، اسف لعشاق  الكوتلن

إنشاء  المشروع :

1 نقوم  بانشاء مشروع جديد واختصارا للوقت نختار مشروع  افتراضي  ثم نختار  الاسم والباكدج وغيرها ما يميز تطبيقنا 

2 نقوم بانشاء مجلد ui او  يمكنك تسميته بما تريد هذا  المجلد  سيحمل عدد من fragment  ان وجدت ان  الملف تم  انشاؤه بشكل تلقائي من خلال  الاندرويد  ستوديو  فهذا  امر  جيد لانه سحمل محتوى الموقع 

الموقع  الذي سابنيه في سورس كود لا احب  اضهاره  الى  الزائر داخل تطبيق الاندرويد وايضا ارغب بتشغيل الجافاسكربت  في الموقع  بالكامل ومن الغباء  القيام  بنفس  الكود على  كل صفحة وfragment لوحدها  لذا احتاج  الى  class  تتحكم في هذا  اقوم بانشاء كلاس تحت عنوان  webcontroller  

الكلاس WebViewController.java

في   shouldOverrideUrlLoading قمنا بتحميل الرابط  الرسمي  للموقع بدون تفرع  وقمنا بتفعيل  الجافاسكربت داخل  الموقع من خلال  الكود  التالي 

view.getSettings().setJavaScriptEnabled(true);

وقمنا  بعمليتي  حقن للكود css من خلال js  الهدف من الكود هو اخفاء عناصل menu  من الموقع داخل  التطبيق وفي كل  الصفحات والfregment واخترت  حدث  بدا التحميل وحدث نهاية التحميل كنوع من الضمان لعدم ظهور الmenu الخاصة  بالموقع والاعتماد على  القائمة الخاصة بالتطبيق بدلا منها 

الكود المخصص لها تجده عبر الرابط  التالي :
https://github.com/guercifzone/arZone/blob/main/app/src/main/java/com/guercif/arzone/WebViewController.java

3 - من خلال الضغط على  الزر  اليمن  للفارة  على المشروع نختار new->activity->emty activity

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

هذف الكود  هو  اظهار  مؤقت  للاكتفتي  spash  كنوع تقديمي لكي تضهر  الmainactivity 

https://github.com/guercifzone/arZone/blob/main/app/src/main/java/com/guercif/arzone/Splash_Screen.java

4 -  الان يبقى لنا انشاء الفروع الخاصة  بالموقع  ،  افتراضيا يقوم  الاندرويد  سشتوديو  بانشاء fragment  افتراضية  مع  موديلاتها  الخاصة  يمكنك  ازالتها او  ابقائها  الخيار يعود  اليك 

نتجه  الى ملف  ui  او  كيفما اسميت  الملف  نقوم  بنشاء ملف اخر يحمل  اسم  القسم مثلا انا عندي قسم  للاندرويد  android  قمت  بانشاء ملف ثم  الضغط  عليه  واختيار  fragment withviewmodels  ال view model  مخصصة  لاقسام  الموقع 

سيعطيك كود  افتراضي قم  بازالة الكود  الافتراضي لكل من  modelView والfragment  

ستلاحظ  انني استعنت بالكلاس webviewController لعملية حقن كود  js  وضعت رابط مخصص لشروحات  الاندرويد في حدود  9 تدوينات لكل صفحة في modelview  يعلن عن عنوان fragment 

وبهذه الطريقة تقوم  بانشاء كل قسم خاص بك على التطبيق حسب اقسام  الموقع  لديك  رابط  السورس كود 

https://github.com/guercifzone/arZone/tree/main/app/src/main/java/com/guercif/arzone/ui/android

يمكنك معاينة التطبيق عبر  الرابط  التالي 

https://play.google.com/store/apps/details?id=com.guercif.arzone