كورس اندرويد

لغة XML هي اللغة الأساسية المستخدمة في تصميم واجهات تطبيقات الأندرويد، حيث تعمل على تحديد شكل التطبيق وعناصره مثل الأزرار والنصوص والصور بشكل منفصل عن أكواد البرمجة. تتيح هذه اللغة فصل التصميم عن المنطق البرمجي مما يجعل عملية التطوير أسهل وأكثر تنظيمًا، فيمكن للمصمم تعديل واجهة المستخدم دون الحاجة للتعامل مع الأكواد. يقوم كل ملف XML على عنصر جذر يحتوي بداخله عناصر فرعية كـ TextView وButton، ولكل عنصر خصائص تحدد أبعاده وألوانه ونصوصه. من أشهر أنماط التخطيط المستخدمة LinearLayout لترتيب العناصر أفقيًا أو عموديًا، وRelativeLayout لتحديد المواقع بالنسبة لبعضها، وConstraintLayout الذي يمنح مرونة أكبر في التصميم. يتم إنشاء ملفات XML تلقائيًا عند إضافة واجهة جديدة في Android Studio، ويمكن التبديل بين واجهة التصميم المرئية والكود للتعديل مباشرة.

يعتمد إنشاء واجهات تطبيقات الأندرويد على كتابة عناصر XML داخل ملف يحتوي على عنصر جذر مثل LinearLayout أو ConstraintLayout يتم وضع جميع المكونات بداخله. يجب تحديد الأبعاد الأساسية لكل عنصر باستخدام خاصيتي layout_width وlayout_height مع قيم مثل match_parent لملء المساحة أو wrap_content لاحتواء المحتوى فقط، كما يُنصح بإعطاء كل عنصر معرفًا فريدًا عبر android:id ليسهل التحكم به في كود البرمجة. يعتمد ترتيب العناصر على نوع التخطيط المستخدم؛ فـ LinearLayout يرتبها أفقيًا أو عموديًا بينما يمنح ConstraintLayout مرونة أكبر في تحديد المواقع. تشمل خصائص التصميم الهوامش margin والحشوات الداخلية padding والألوان وأحجام الخطوط، ويجب الالتزام بالإغلاق الصحيح لكل وسم سواء بإغلاق كامل أو ذاتي لضمان ظهور الواجهة بشكل منظم وسليم.

في هذا الدرس ستتعلم القواعد الأساسية لإنشاء وتصميم العناصر في واجهات تطبيقات الأندرويد باستخدام XML. ستتناول كيفية اختيار التخطيط المناسب (Layout) كـ LinearLayout أو RelativeLayout أو ConstraintLayout، وكيفية تحديد حجم العناصر باستخدام layout_width وlayout_height مع استخدام match_parent أو wrap_content. ستتعرف أيضًا على أهمية المعرف android:id لربط العناصر بالبرمجة، وكيفية ضبط الخصائص مثل الهوامش margin والحشوة padding وتنسيق الألوان والنصوص. يشمل الدرس نصائح لضمان توافق الواجهة مع شاشات وأجهزة مختلفة، والترتيب الصحيح للوسوم XML للإغلاق السليم والتنظيم الجيد.---

يشرح هذا الدرس طريقة إنشاء أول مشروع أندرويد في Android Studio مع توضيح خطوات إعداد واجهة المستخدم باستخدام ملف XML Layout. يتم التعرف على اختيار التخطيط الجذري المناسب وضبط خصائص العرض والارتفاع للعناصر، بالإضافة إلى إضافة مكونات أساسية مثل النصوص والأزرار والتبديل بين واجهة التصميم المرئي وكود XML لإجراء التعديلات المباشرة على مظهر التطبيق.

يشرح هذا الدرس طريقة استخدام ImageView في واجهات الأندرويد وكيفية ضبط خاصية scaleType لتحديد كيف تُعرض الصورة داخل العنصر — سواء تكون centerCrop لعرضها بملء العنصر مع اقتصاص الأجزاء الزائدة، أو centerInside لعرضها كاملة داخل الحدود دون اقتصاص، أو center لوضعها في مركز العنصر دون تعديل مقاسها. كما يتضمن أيضًا كيفية تحديد خصائص العرض والارتفاع وضبط الهوامش والتكرير (إعادة التكرار) إذا لزم الأمر.

في هذا الدرس يتم التعرّف على ImageView وخصائصه في تصميم واجهات الأندرويد، مع التركيز على خاصية scaleType التي تُحدد كيف تُعرض الصورة داخل العنصر. من الخيارات التي تُستخدم كثيرًا: center التي تضع الصورة في وسط العنصر دون تغيير مقياسها، centerCrop التي تُكبّـر الصورة لتملأ العنصر مع اقتصاص الأجزاء الزائدة، وcenterInside التي تُصغّر أو تكبّـر الصورة بحيث تبقى بكاملها داخل العنصر دون اقتصاص.

في هذا الدرس يتم التعرّف على ImageView وخصائصه في تصميم واجهات الأندرويد، مع التركيز على خاصية scaleType التي تُحدد كيف تُعرض الصورة داخل العنصر. من الخيارات التي تُستخدم كثيرًا: center التي تضع الصورة في وسط العنصر دون تغيير مقياسها، centerCrop التي تُكبّـر الصورة لتملأ العنصر مع اقتصاص الأجزاء الزائدة، وcenterInside التي تُصغّر أو تكبّـر الصورة بحيث تبقى بكاملها داخل العنصر دون اقتصاص.

في هذا الدرس، سنتعلّم طريقة استخدام ImageView بشكل أعمق مع خصائص متقدمة للتحكم في الصور داخل واجهات الأندرويد، مثل ضبط scaleType لتحديد كيف تظهر الصورة داخل العنصر، وكيفية استخدام خصائص إضافية مثل adjustViewBounds، padding، وlayout_margin لضبط المساحة المحيطة بها. كما يتم توضيح كيف يؤثّر اختيار الأبعاد (عرض وارتفاع) على مظهر الصورة داخل التطبيق، وكيفية التعامل مع الصور بأحجام وأشكال مختلفة لإظهارها بأفضل جودة.

يشرح هذا الدرس مفهوم ViewGroup في تصميم واجهات الأندرويد، مع التركيز على LinearLayout و RelativeLayout. تُبيّن كيفية ترتيب العناصر داخل الواجهات — في LinearLayout ترتيب أفقي أو عمودي، بينما في RelativeLayout تحديد مواقع العناصر بالمقارنة مع عناصر أخرى أو مع الحاوية الحاضنة. كما يتطرق الدرس لكيفية استخدام الخصائص مثل layout_alignParent... و layout_toRightOf و layout_below لتحديد الموقع، وتأثير خصائص layout_width و layout_height على تنظيم وتنسيق الواجهة.

في هذا الدرس يتم شرح كيفية استخدام ViewGroup من النوع LinearLayout الذي يرتّب العناصر أفقيًا أو عموديًا بناءً على الخاصية orientation، مقابل RelativeLayout الذي يتيح تحديد موقع كل عنصر نسبةً للأجزاء الأخرى أو الحاوية الأم باستخدام خصائص مثل layout_below، layout_toRightOf، layout_alignParentTop وغيرها. يتعرف المتعلم أيضًا على تأثير layout_width وlayout_height في كل من التخطيطين، وكيفية استخدام المراجع بين العناصر عبر المعرفات id لضبط مواضعها بدقة داخل الواجهة.