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

Google Maps بالعربية – الدرس الثانى

[mhc_section admin_label=”section”][mhc_row admin_label=”row”][mhc_column type=”1_4"][m[mhc_image admin_label=”صورة” src=”http://hendiware.16mb.com/wp-content/uploads/2016/08/gm.png” show_in_lightbox=”off” url_new_window=”off” animation=”off” hoverfx=”none” sticky=”off” image_mask=”off” border_radius=”0" align=”right” force_center_on_mobile=”on” saved_tabs=”all”]/mh[/mhc_image][mhc_text admin_label=”نص” shared_module=”8537" saved_tabs=”all” background_layout=”light” text_orientation=”right”]>الدرس الأول

ابدأ مع Google Map

الدرس الثانى

انواع الخرائط والـ Gestures والـ Markers

 


اذا واجهتك أى مشكلة

قم بطرحها فى جروب

Hendiware Developers

[/mhc_[/mhc_text][/mhc_column][mhc_column type=”3_4"]os[mhc_post_header admin_label=”عنوان المقالة” title=”on” meta=”off” avatar=”on” author=”on” date=”on” categories=”on” comments=”off” views=”off” text_orientation=”right” text_color=”dark” featured_image=”on” featured_placement=”above” parallax=”on” parallax_method=”off” animation=”off” custom_paddings=”40" size=”30px” title_bold=”on” text_shadow=”off” text_background=”off” text_bg_color=”#ffffff” overlay=”on” saved_tabs=”all”]ost[/mhc_post_header][mhc_text admin_label=”نص” background_layout=”light” text_orientation=”right”]لدرس السابق Google Maps بالعربية الدرس الأول قمنا بانشاء اول خريطة عن طريق انشاء أكتييتفى جديد للخريطة بواسطة الأندرويد ستوديو وأنشأ لنا الخريطة تلقائيا وقمنا بشرح الكود فى هذا الدرس نتابع ونقوم بالقيام بعمليات اخرى مختلفة على الخريطة .

تحديد نوع الخريطة

توفر لنا Google Maps عدة أشكال للخرائط منها شكل القمر الصناعى ومنها الشكل العادى ومنها شكل الطرق فقط او شكل الطرق مع التسميات التوضيحية ويمكننا تغيير شكل الخريطة أو نوع عرضها عن طريق استخدام الميثود setMapType() وهذه الميثود تأخذ باراميتر واحد وهو نوع الخريطة وهذه هى الانواع المتوفرة

GoogleMap.MAP_TYPE_NONE : وفى هذا النوع تعرض الخريطة بدون اى تسميات توضيحية او اشكال توضح التباين الجغرافى للمناطق مجرد خريطة صماء خالية من المعالم  يمكنك تجربتها الان عن طريق استخدام الميثود كالتالى :

قم بتشغيل التطبيق على موبايلك  للتجربة

 

GoogleMap.MAP_TYPE_NORMAL : نوع الخريطه العادى الذى يظهر لك الطرق والأماكن بأسماءها قم بتحديد هذا النوع فى الميثود السابقة وقم بتشغيل التطبيق وشاهد النتيجة

 

GoogleMap.MAP_TYPE_SATELLITE : النوع الخاص بعرض القمر الصناعى فهو يعرض كوكب الارض من الاعلى بكل تفاصيله لكن بدون تسميات توضيحية .

 

GoogleMap.MAP_TYPE_HYBRID : مثل القمر الصناعى تماما لكنه يعرض تسميات توضيحية وتفاصيل على الخريطة

 

التحكم فى الـGestures الخاصة بالخريطة 

الـ Gestures  هنا هى عبارة عن تحكمك فى الخريطة باصابعك حيث الان فى كل مرة فى المرات السابقة كنا نشغل الخريطة كنت تتحكم فيها تقوم بتحريك الكاميرا باصابعك يمين ويسار وتقوم بالتكبير والتصغير والدوران ..الخ يمكننا التحكم فى هذه الامور من حيث تفعيلها أو تعطيلها او تعطيل بعضها وهكذا عن طريق الوصول للاعدادت الـ UI الخاصة بالخريطة برمجيا بهذا الميثود getUiSettings() ومن ثم فعل ما نريد على سبيل المثال اذا اردت تعطيل جميل الـ Gestures الخاصة بالخريطة سأقوم بهذا كالتالى :

قم الان بتشغيل التطبيق وستجد أن الخريطة اصبحت لا تستجيب للمسات اصابعك لا بالتكبير ولا بالتصغير ولا بغيره لا تقلق هى ليست متجمدة او متوقفة :v .

حسنا الان لنقم بتجربة شىء اخر سوف أقوم بتعطيل الـZoom فقط وذلك كالتالى :

قم الان بتشغيل التطبيق وستلاحظ أن كل شىء يعمل من تحرك وتدوير الخريطة ما عدا الزووم فقط هو الذى لا يعمل لاننا قمنا بتعطيله

الان وضحت الفكرة يمكنك تجربة الـ Methods الاخرى الموجودة بالـ UI Settings بنفسك وستجد انه يمكنك التحكم بـ UI الخريطة من تعطيل او اظهار ازرار التكبير والتصغير او مال الى ذلك من امور تخص الـ UI الخاص بخريطة جوجل .

 

 

الاستجابة للضغطات على الخريطة 

يمكنك الاستجابة للضغطات على الخريطة مثل طرق الاستجابة التى نقوم بها للزر العادى او لاى مكون أخر وذلك عن طريق إضافة Listener لذلك سنقوم الان بإضافة MapClickListener كالتالى :

حيث عند الضغط يتم تمرير خط الطول والعرض  التى تم الضغط عليهما واستدعاء الميثود onMapClick لنقم الان بالتجربة باضافة Toast كالتالى :

 

قم الان بتشغيل التطبيق والضغط على أى مكان بالخريطة وشاهد النتيجة .

 

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

الكلاس LatLng هى عباره عن كلاس تحتوى على خطى الطول والعرض معا ويمكن استخراج كل منهما على حدة كالتالى :

الان قم بتشغيل التطبيق وشاهد ماذا يحدث عند الضغط على اى مكان

 

بنفس الطريقة يمكن عمل Handle للـ LongClick

إضافة الأشياء للخريطة 

يمكنك ايضا اضافة الأشياء للخريطة مثل الـ Markers أو الدوائر او المضلع الشكل الذى قد يكون مثلث او مربع او شكل اخر مضلع او حتى ايقونة تريدها

وسنبدأ بالـ Markers

الـ Marker  

الماركر هو عباره عن كائن يمكن وضعه على الخريطة فى اى مكان وله عدة صفات كخطوط الطول والعرض التى يوضع بها وكذلك ايقونة وعنوان ووصف والشكل الافتراضى له هو هذا البالون الاحمر الذى نراه بشكل افتراضى فى الخرائط ولإنشاء Marker يجب علينا أن نقوم أولا بتحديد خصائصه وGoogle Maps تقدم لنا كلاس MarkerOptions يمكننا من خلالها تحديد خصائص الماركر  شاهد الكود  التالى :

 فى السطر الأول قمنا بإنشاء أوبجكت من الـ MarkerOptions وسميته zagazig وهى عاصمة محافظة الشرقية احد محافظات مصر والتى كتب فيها مرسى جميل عزيز اغنية (انا شرقاوى )  بعد الاتفاق مع عبدالحليم حافظ  :

يابو رمش بيجرح ويداوي …
وعيون يوصفها مغناوي …
من غير ما تقول رمشك قالي …
أنا من الزقازيق أنا شرقاوي.
وكان عبد الحليم سيغنيها لكنه توفى قبل ذلك.

فى السطر الثانى قمت بإنشاء اوبجكت من الـ Latlang لأجهز خطوط الطول والعرض الخاصة بالزقازيق واذا كنت لا تعرف كيف يمكنك الحصول على خطوط طول وعرض اى مدينة يدويا يمكنك فعل ذلك من خلال فتح Google Maps فى المتصفح والوصول للمكان الذى تريده على الخريطة ثم هذين الرقمين على التوالى هما خطوط الطول وخطوط العرض

 

فى السطر الثالث قمت باعطاء خاصية الـ position للماركر وحددت له الـ latlang الخاص بالزقازيق

فى السطر الرابع  قمت بتحديد عنوان الماركر الذى سيظهر عند الضغط على الماركر

فى السطر الخامس قمت بتحديد ايقونة الماركر يمكن عدم تحديد ايقونة خاصة وتركها وتجاهل هذا السطر او تحديد ايقونة مخصصة حيث تأخذ ال icon BtimabDescroption وهنا اردت ان اعطيه ايقونة من الـ drawables وهي ايقونة الانشر الموجودة بالـ mipmap الافتراضية فقمت باستخدام الكلاس المساعدة BtimapDescriptorFactory لجلب الصورة .

 

فى السطر السادس قمت بعمل اضافة للماركر على الخريطة

فى السطر السابع  قمت بتحريك الكاميرا نحو الزقازيق بزووم مقداره 12 عن طريق الميثود animateCamera وأعطائها الموضع التى ستتحرك نحوه .

 

الى هنا ينتهى الدرس التانى نتابع المزيد عن الخرائط فى الدرس القادم

 

 

 

 

 

 

 

 

 

[/mhc_text[/mhc_text][/mhc_column][/mhc_row][mhc_row admin_label=”صف”][mhc_column type=”4_4"]nt[mhc_comments admin_label=”تعليقات” show_comments=”on” /][/mhc_column][/mhc_row][/mhc_section]
السابق
Google Maps بالعربية – الدرس الأول
التالي
Google Maps بالعربية – الدرس الثالث

3 تعليقات

أضف تعليقا

  1. مشاري قال:

    السلام عليكم
    عملت كل المطلوب من انشاء Activity وتوليد مفتاح للخرائط كل الدرس الاول طبقته بشكل صحيح لكن
    المشكلة اذا شغلت ال activity يطلع لي مكتوب لن تشتغل الخريطة مالم تحدث google play service
    مع العلم اتوقع اني محدثه لكن لم اعرف حل المشكلة الى الان

    بعض معلومات عن مشروعي
    min sdk API 17
    target API 24

  2. skhr قال:

    سلام عليكم اخي
    هل يمكن أن تشرح لنا كيفية تعقب تلفون من تلفون اخر وشكرا

  3. عبدالعزيز قال:

    السلام عليكم
    اخي الكريم انا عملت نفس طريقتك ولكن لم يتم تكوين ملف باسم GoogleMap كما تشاهد في الصورة التالية :
    https://up.harajgulf.com/imagef-149557884116891-jpg.html
    مالعمل بارك الله فيك ؟؟

اترك تعليقاً

هذا الموقع يستخدم Akismet للحدّ من التعليقات المزعجة والغير مرغوبة. تعرّف على كيفية معالجة بيانات تعليقك.