• الإعلانات

    • فيصل الحربي

      تسجيل عضوية جديدة في المنتدى   01/31/2016

      السلام عليكم ورحمة الله وبركاته  عزيزي العضو الجديد :  حاليا رسالة الإيميل لتأكيد صحة إيميلكم تذهب للبريد العشوائي ( جاري حل المشكلة )  فإذا لم تجد رسالة التحقق من إيميلكم في صندوق الوارد لديكم إتجه للبريد العشوائي ( JUNK)  وقم بتفعيل إشتراككم من هناك   

البحث في المنتدى

Showing results for tags 'Learn'.

  • البحث بالتاقات

    اكتب الكلمات المفتاحيه بينها علامه الفاصله
  • البحث بكاتب الموضوع

تم إيجاد 3 نتيجة

  1. السلام عليكم وكل عام وانتم بخير الموقع التالى مفيد جدا لفهم CSS Layout http://learnlayout.com/toc.html
  2. بسم الله الرحمن الرحيم   إنشغلت بالفترة الأخيرة بمشروع تطبيق انترنت, الأمر الذي شغلني هو أنه كان يتطلب التعامل مع خرائط Google لتحديد الأماكن وتخزين إحداثياتها, ولكوني لم أتعامل معها من قبل فقد بحثت بالكثير من المواقع العربية ولم أجد ما أحتاجه, وموقع developers.google لا يعمل في بلدي, ولكن والحمد لله وبعد عناء البخث توصلت إلى النتيجة المطلوبة وأنهيت المشروع.   ولكي لا يعاني أحد غير مثل ما عانيت سأضع هنا خلاصة ما تعلمته عن خرائط Google, التطبيق سيكون بواسطة Javascript   الخطوة الأولى إنشاء صفحة HTML فارغة كما يلي: <!DOCTYPE html><html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <title>مثال خرائط Google</title> <meta name="description" content=""> <meta name="author" content=""> </head> <body> </body> </html>وفي قسم Head قبل وسم النهاية سنضع السطر الذي يقوم بجلب مكتبة خرائط Google: <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyD9uiyFbXfbSOsY6umTUtl4_rvl_LkQKxE&sensor=false&libraries=places"></script>والآن سنحدد المكان الذي ستظهر به الخريطة في قسم Body كوسم DIV ولنعطه ID مميز ويمكن تحديد أبعاده بواسطة CSS كما يلي: <div id="map_canvas" style="width: 500px; height: 300px"></div>هكذا يكون تصميم الصفحة جاهزاً والآن ننتقل إلى البرمجة, أولاً سنعرف ثلاث متغيرات تعبر عن: الخريطة, مستوى التقريب, الإحداثيات: var map; var zoom=5; var lat = 34.99697127696379; //default latitude var lng = 36.885860443114325; //default longitude var homeLatlng = new google.maps.LatLng(lat, lng); //set default coordinates للحصول على الإحداثيات عرفنا رقمين الأول هو خط العرض والثاني هو خط الطول, وتم تحويلهما إلى كائن الإحداثيات homeLatlng بواسطة دوال خرائط Google.   ثم سنعرف كائن يجمع الإحداثيات ومستوى التقريب ونوع الخريطة (وهذا الكائن مطلوب لإنشاء الخريطة): var myOptions = { center: new google.maps.LatLng(lat, lng), //set map center zoom: zoom, //set zoom level to 17 mapTypeId: google.maps.MapTypeId.ROADMAP //set map type to road map };تم تحديد الخريطة كخريطة عادية ثنائية الأبعاد بواسطة MapTypeId .   بعدها ننشئ الخريطة باستخدام المعلومات التي حددناها وتحديد مكان ظهور الخريطة في الصفحة: map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); //initialize the mapوهكذا ستظهر الخريطة على الصفحة.       قد تحتاج لعلامة لتحديد مكان معين وأخذ إحداثياته بواسطة هذه الخريطة, لابأس الأمر بسيط, قم بتعريف كائن للعلامة وليكن homeMarker وتحديد مكانه الإفتراضي بالإحداثيات التي حددناها فوق (أو يمكنك تحديد أحداثيات أخرى) وتحديد الخريطة التي سيطبق عليها وتحديد إمكانية تحريكه إما true أو false كما يلي: var homeMarker = new google.maps.Marker({ //set marker position: homeLatlng, //set marker position equal to the default coordinates map: map, //set map to be used by the marker draggable: true //make the marker draggable });وهكذا ستظهر علامة حمراء في الخريطة, ولكن في وضعها الحالي لا فائدة منها إطلاقاً لأننا لم نأخذ الإحدائيات بعد. فلننشأ مربع نص لتخزين الإحداثيات ومربع نص آخر لتخزين رابط الخريطة ورابط لتخزين رابط صورة الخريطة وذلك في قسم Body وإعطاء كل خانة ID مميز: <input name="coords" id="coords" value=" " size="100" eadonly> <br> <input name="map_url" id="map_url" value=" " size="100" readonly> <br> <a id="map_img" target="_blank" href="">Get Image</a> ولنعد إلى البرمجة ونضيف مستمع حدث للخريطة عند تحريكها ونجعلها تتطبق دالة تقوم بأخذ الإحداثيات الجديدة ومستوى التقريب الجديد ومن ثم وضعها في الخانات السابقة كما يلي: google.maps.event.addListener(map, 'center_changed', function(){ lat = homeMarker.getPosition().lat(); //set lat to current latitude where the marker is plotted lng = homeMarker.getPosition().lng(); //set lng current latitude where the marker is plotted zoom = map.getZoom(); document.getElementById('map_img').href="http://maps.google.com/maps/api/staticmap?center=" + lat + ',' + lng + "&zoom=" + zoom + "&size=600x400&maptype=roadmap&sensor=false&markers=color:red|label:none|" + lat+ ',' + lng; document.getElementById('coords').value=lat+","+lng; document.getElementById('map_url').value="http://maps.google.com/?q="+lat+","+lng+"&z="+zoom; });ماذا إذا قام المستخدم بتحريك العلامة ولم يحرك الخريطة, طبعاً لن تتغير الإحداثيات ولحل هذه المشكلة نضيف مستمع حدث للعلامة ونجعلها تتطبق نفس الدالة السابقة:   google.maps.event.addListener(homeMarker, 'position_changed', function(){ lat = homeMarker.getPosition().lat(); //set lat current latitude where the marker is plotted lng = homeMarker.getPosition().lng(); //set lat current longitude where the marker is plotted zoom = map.getZoom(); document.getElementById('map_img').href="http://maps.google.com/maps/api/staticmap?center=" + lat + ',' + lng + "&zoom=" + zoom + "&size=600x400&maptype=roadmap&sensor=false&markers=color:red|label:none|" + lat + ',' + lng; document.getElementById('coords').value=lat+","+lng; document.getElementById('map_url').value="http://maps.google.com/?q="+lat+","+lng+"&z="+zoom; });  وبهذا نحصل على الإحداثيات ومستوى التقريب ويمكن إرسالها إلى أي صفحة تطبيق ويب لإستخدامها.   بالمرفقات المثال الذي عملنا عليه: google map sample.rar  
  3. بسم الله الرحمن الرحيم   كتيب أساسيات برمجة ألعاب Flash بواسطة Flixel مؤلف من ثلاثة أقسام: القسم الأول: مقدمة عن Flixel وكيفية تثبيت الأدوات اللازمة القسم الثاني: مشكلة الكتابة باللغة العربية وكيفية حلها القسم الثالث: تحليل وبرمجة لعبة الأفعى بواسطة Flixel     إن هذا الكتيب مجرد مقدمة لكتاب شامل خاص بـ Flixel إن شاء الله     وهذا الكتيب مع ملفات الأمثلة: من هنا