سلسلة تعلم برمجة تطبيقات الأندرويد .. الدرس الثالث

أهلا بمحبي الأندرويد 🙂

في الدرس الماضي، قمنا بتشغيل الأمثلة التي تأتي مع الحزمة البرمجية. كما قمنا باستعراض دورة حياة تطبيق الأندرويد Software Development Life Cycle SDLC وانتهينا بالتعرف على الملفات المكونة لنظام الأندرويد وبرمجة تطبيق أهلا بالعالم.

في درسنا الثالث، سنقوم بما يلي:

١- شرح طريقة عرض النص بشكل مغاير لما قمنا به في الدرس الماضي.

٢- شرح طريقة إظهار صورة في التطبيق.

٣- شرح مفهوم النوايا Intents وبرمجة تطبيق يقوم بالاتصال على رقم يدخله المستخدم.

لنبدأ !

١- طريقة عرض النص.

تذكرون أننا في الدرس الثاني قمنا بتغيير النص الذي أردنا إظهاره عن طريق ملف ال main.xml، كما في الصورة

ما نود الآن عمله هو إيضاح إمكانية عدم استعمال الدالة

setContentView(R.layout.main);

والتي تقوم بعرض الواجهة التي حُددت معالمها ومحتوياتها باستخدام ملف main.xml. الهدف من عرض هذه النقطة هو التركيز على أهمية ملفات ال XML التي تسهل الأداء بشكل أكبر وأكثر فعالية.

ببساطة (باستخدام ملفات الدرس السابق) قم بمسح:

TextView

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:text="@string/hello"

من main.xml ليصبح محتوى الملف بعدها:





الآن في ملف HelloWorldArdroid.java قم باستدعاء المكتبة التالية:

import android.widget.TextView;

عبر هذه المكتبة، سنقوم باستعمال عنصر الواجهة النصية TextView بتعريف كائن Object داخل دالة onCreate على النحو التالي:

TextView HelloWorldText = new TextView(this);

لا يخفى على مبرمج الجافا الغرض من تمرير this عند استدعاء الدوال البرمجية في الجافا Functions/Methods. وفي هذه الحالة، this تستخدم للدلالة على أن الكائن المنشأ ينتمي للسياق البرمجي الحالي المتمثل بمجموعة السياق  Context Class والتي هي أحد أسلاف Ancestors المجموعة التي نعمل عليها حاليا (بتتبع التسلسل الهرمي نجد أن: HelloWorldArdroid extends Activity extends ApplicationContext extends Context).

الآن نقوم باستعمال الدالة setText لتعيين النص الذي نريد الكائن HelloWorldText أن يحمله:

HelloWorldText.setText("Hello World");

والآن نطلب من دالة setContentView أن تعرض الكائن على النحو التالي:

setContentView(HelloWorldText);

المحتوى النهائي للملف:

package android_programming_series.HelloWorldArdroid;

import android.app.Activity;

import android.os.Bundle;

import android.widget.TextView;

public class HelloWorldArdroid extends Activity {

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

TextView HelloWorldText = new TextView(this);

HelloWorldText.setText("Hello World");

setContentView(HelloWorldText);

}

}

مشكلة هذه الطريقة تكمن في أنها تعرض عنصرا واحدا فقط (أو واجهة واحدة كالواجهة النصية أعلاه). لذلك سنقوم من الآن وصاعدا باستخدام ملف XML لإضافة العناصر والواجهات بمختلف أنواعها.

٢- شرح طريقة إظهار صورة في التطبيق.

يمكنكم استكمال العمل على المشروع الحالي أو انشاء مشروع جديد تحت أي مسمى، مثلا HelloWorldImage. علينا إنشاء صورة لنقوم بعرضها. اخترت الصورة التالية

وقمت بحفظها تحت مجلد drawable_hdpi.

نقوم بفتح ملف الmain.xml ونضيف بداية العنصر الخاص بالواجهة الرسومية (صورة) وهو <ImageView. ثم نقوم بعدها بإضافة الخصائص التالية:

android:id="@+id/imageviewar"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:src="@drawable/imageviewar"

تقوم الخاصية الأولى بتوليد رقم خاصID بالعنصر المسمى imageviewar (حيث يتم التعامل مع الواجهات Viewsعبر أرقامها الخاصة). تتحكم الخاصيتان اللاحقتان بطول وعرض الصورة. أما الخاصية الأخيرة فعن طريقها يتم تحديد مصدر الصورة (وهو تحت مجلد drawable بغض النظر عن تفرعات المجلد).

ملف ال XML:







الملف المصدري هو كالتالي:
package android_programmers_guide.HelloWorldImage;

import android.app.Activity;

import android.os.Bundle;

public class HelloWorldImage extends Activity {

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

}

}

التطبيق في الجهاز الافتراضي:

٣- شرح مفهوم النوايا Intents وبرمجة تطبيق يقوم بالاتصال على رقم يدخله المستخدم.

قبل تعريف ال Intents، علينا التفريق بين مفهومين: التطبيق Application و النشاط Activity. التطبيق هو عبارة عن نشاط واحد أو أكثر. في تطبيق الرسائل النصية مثلا، كل اختيار يمثل نشاطا. بمعنى، خيار كتابة الرسائل هو نشاط، وخيار عرض الرسائل هو نشاط مختلف وهكذا.

النوايا Intents بكل بساطة هي وسيلة لتمرير المعلومات من نشاط لآخر وبكلمات أخرى، تمرير ما ينوي فعله المبرمج بين الأنشطة. ولكنها تستخدم فقط في حالة وددنا استخدام نشاط خارج التطبيق الذي نعمل عليه. مثلا، اذا أراد المبرمج من تطبيقه أن يأخذ كلمة معينة من المستخدم ليبحث عنها بين ملفات النظام فإنه سيقوم بتصميم نشاط تحتوي واجهته على حقل نصي يمكن للمستخدم الكتابة فيها، وما يتم ادخاله يتم تمريره الى نظام الأندرويد تحت نية عمل بحث في ملفات النظام (وال Intent اسمه في هذه الحالة: SEARCH_ACTION) الذي يستقبل الطلب ويفهم النية\المعلومة المرغوب تحقيقها ويستدعي بدوره نشاط البحث Search Activity. نلاحظ أن النية تم تمريرها الى نشاط خارج التطبيق، وهو نشاط يقوم عليه نظام التشغيل. بالنسبة للأنشطة التي ذكرتها في معرض حديثي عن تطبيق الرسائل النصية، فهي أنشطة داخل التطبيق الواحد ولا يتم استخدام مفهوم النوايا Intents عليها (سنرى كيفية التعامل معها في الدرس القادم).

هناك نوعان من النوايا، نوايا النشاط Activity Intents و النوايا واسعة الانتشار Broadcast Intents. النوع الأول هو ما قمنا بشرحه. بينما النوع الثاني فهو نوع عكسي نوعا ما. النوع الثاني عبارة عن رسائل يرسلها نظام التشغيل للأنشطة العاملة التي يمكنها التفاعل مع هذه الرسائل بحسب وظيفتها. مثلا نجد أن النية المسماة CAMERA_BUTTON_ACTION يتم اطلاقه عند تشغيل الكاميرا. اضغط هنا للاطلاع على ال Intents المتاحة لكل نوع: Activity Action Intents ، Broadcast Intents.

ستتضح الصورة بشكل أكبر في نهاية هذا الدرس.

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

سنبدأ بملف ال main.xml: (أفترض الآن أنكم تفهمون محتواه دون الحاجة الى شرح)









تم شرح الغرض من عنصر TextView من قبل. بالنسبة لعنصر EditText فهو يعني الحقل النصي القابل للتغيير (الحقل الذي سيتم ادخال الرقم فيه). عنصر الزر Button وهو الزر الذي بضغطه سيتم الاتصال.

بالنسبة لملف ArdroidCaller.java نقوم بداية باستدعاء المكتبات التالية:

import android.app.Activity;

import android.os.Bundle;

import android.content.Intent;

import android.net.Uri;

import android.widget.Button;

import android.widget.EditText;

import android.view.View;

تتضح نسبيا مهمة كل مكتبة بمجرد قراءة اسمها باستثناء الرابعة والأخيرة اللتان سنرى الغرض من استدعائهما قريبا.

public class ArdroidCaller extends Activity {

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

final EditText phoneNumber = (EditText) this.findViewById(R.id.phoneNumber);

final Button callButton = (Button) this.findViewById(R.id.callButton);

نلاحظ في السطرين الأخيرين كيفية استدعاء المؤشر الذي يشير الى الرقم ID الخاص بالعنصر. لاحظوا أننا قمنا بعمل Downcast في كلا السطرين لأن مخرج الدالة findViewById هو من نوع View.
أعتقد أن العديدين ممن برمجوا بلغة الجافا كانوا قد مروا على برمجة واجهات المستخدم User Interface وتحديدا برمجة الأزرار Buttons واستخدموا أحد مفاهيم برمجة الجافا وهو مبدأ المجموعات المجهولة Anonymous Classes الذي يستخدم عادة في كتابة setOnClickListener المسؤول عن متابعة الزر وتنفيذ عدد من الأوامر عند ضغط الزر من قبل المستخدم.

callButton.setOnClickListener(new Button.OnClickListener() {

public void onClick(View v)

{

المفترض أن نقوم باستدعاء ال Intent المسؤول عن الاتصال ويسمى ACTION_CALL وأن نقوم بدمجه مع الرقم المدخل وارساله الى نظام التشغيل. وهذا ما يحصل باستخدام:

Intent callIntent = new Intent(Intent.ACTION_CALL,Uri.parse("tel:" + phoneNumber.getText()));

ثم نطلب من نظام التشغيل إطلاق النشاط الخاص بعمل المكالمة:

callIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);

لاحظ أن FLAG_ACTIVITY_NEW_TASK تعني اطلاق النشاط كمهمة جديدة، وهناك في الواقع عدة أوامر توضح الكيفية التي يريد المبرمج عبرها اطلاق النشاط، فمثلا يوجد: FLAG_MULTIPLE_TASK_LAUNCH التي تقوم بإطلاق النشاط حتى لو أنه يعمل في الأصل (نسخة ثانية من النشاط)، وغيرها.
في النهاية سنطلب من النظام تشغيل ال Intent عبر:

startActivity(callIntent);

اذا، يصبح الملف في النهاية كما يلي:

package android_programming_series.ArdroidCaller;

import android.app.Activity;

import android.os.Bundle;

import android.content.Intent;

import android.net.Uri;

import android.widget.Button;

import android.widget.EditText;

public class ArdroidCaller  extends Activity {

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

final EditText phoneNumber = (EditText) this.findViewById(R.id.phoneNumber);

final Button callButton = (Button) this.findViewById(R.id.callButton);

callButton.setOnClickListener(new Button.OnClickListener() {

public void onClick(View v)

{

Intent callIntent = new Intent(Intent.ACTION_CALL,Uri.parse("tel:" + phoneNumber.getText()));

callIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);

startActivity(callIntent);

}

});

}

قبل تشغيل البرنامج، بقي لدينا مسألة صغيرة. هل لاحظت عند تنصيبك للتطبيقات على جهازك أنك تُسأل عما اذا كنت تصرح للتطبيق باستخدام الانترنت مثلا أو الاطلاع على رسائلك وغيرها؟ هذه هي الأذونات Permissions المرتبطة بالتطبيقات التي يجب أن توافق عيها ليعمل البرنامج بشكل صحيح.
ما قمنا به في تطبيقنا لا يختلف حالا عن باقي التطبيقات، فاستخدام خاصية الاتصال تحتاج اذن المستخدم. لذلك، في ملف الاعدادات العامة ArdroidCaller Manifest.xml ، نضيف سطر ال XML التالي:


ليصبح ملف  ArdroidCaller Manifest.xml كاملا:
























للاطلاع على معظم الأذونات الموجودة اضغط هنا.
الآن نشغل التطبيق على الجهاز الافتراضي لنرى التالي:

وبالضغط على زر الاتصال Call يظهر:

أعتقد أن هذا الدرس كان طويلا بعض الشيء 🙂

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

درسنا القادم سيكون عن كيفية التأكد من المدخلات التي يدخلها المستخدم، فكما تلاحظون في التطبيق أعلاه، قد يدخل المستخدم أحرفا ورموزا تجعل عملية الاتصال خاطئة. كما أننا سنتعلم طريقة استغلال زر القائمة Menu في عملية التنقل بين الأنشطة المختلفة الموجودة في التطبيق الواحد (اذا سنتعلم أيضا كيفية عمل تطبيق متعدد الأنشطة).

بالتوفيق يا أصدقاء !

إقرأ المزيد عن

، ، ، ، ،

وائل العلواني

وائل العلواني.. مدون سوري ومطور تطبيقات أندرويد.. مهتم بالتقنية وآخر تطوراتها.. يعمل في شركة خاصة في مجال تقصي الأعمال BI وتعدين البيانات Data Mining

التعليقات: 29 ضع تعليقك

ماشاء الله سلسلة متميزة!
لي اقتراح:
لم لا يتم جمع كافة السلسلة وذلك بعد انتهائها وإخراجها على شكل ملف بي دي إف ونشرها بين المهتمين؟
أرى أن ذلك سيساعد على إثراء محتوانا العربي ويسهل على القارئ الرجوع للمواضيع بسهولة.

شكرا لك وائل، وتمنياتي لك بالنجاح المستمر

فكرة جميلة أعتقد أننا سنقوم بها 🙂

مع التحية

RT @anasonline: RT @ardroid: سلسلة تعلم برمجة تطبيقات الأندرويد .. الدرس الثالث http://bit.ly/5QFZ1c

عابر سبيل يقول:

الف شكر اخوي وائل .. وفقك الله وانفعك بعلمك

لدي بعض الأسئله:

ما هو مستوى هذه الدروس ؟

و ما هي نصيحتك لمن ليس لديه حرف واحد من لغة الجافا ؟

وكيف يتعلم هذه اللغه ؟

دمت بود

أهلا بك أخي عابر سبيل..

كنا قد ذكرنا في الدرس الأول من السلسلة أن الدروس موجهة للقارىء الملم بلغة الجافا بمستوى مبتدىء متقدم الى متوسط.

بالنسبة للسؤال الثاني فهناك جوابان، ان كنت ملما بلغة برمجة أخرى، لنقل سي شارب مثلا، فيكفي وجود الفكر والفهم البرمجي لديك لاتقان لغة الجافا، حيث المفاهيم واحدة الى حد بعيد والاختلاف يكون بطريقة كتابة الأوامر Syntax.

أما اذا كنت غير ملم بأي لغة برمجة فعليك بالشروحات العربية أو الانجليزية المنتشرة على الانترنت،، وبالتوفيق..

عابر سبيل يقول:

شكرا لك اخي على هذه المعلومه

طبعا اعتبر نفسي محترف متوسط في اللينكس و أوامره
وتعاملي دائما مع الــ Geek ولكن ليست لدي أية لغه برمجه

وكنت زمان اتطلع الى هذه اللغه و كيف أدرسها ولكن لا أجد
أو لا أعرف أين البداية .

حاولت أن اقسم وقتي بين العمل والدراسه ولكن ساعات لعمل
تأكل الوقت كله .

وإلى الآن لم أجد الشرح الوافي والكفي لتعلم البدايه .

دمت بود واعذرني على الاطالة

سلمان يقول:

السلام عليكم

بداية احب ان اشرك اخي وائل و اسأل الله جل في علاه ان يهديك و يثبتك و يوفقك وجميع المسلمين.
اريد ان اتعلم الجافا هل تستطيع ان تدلني على افضل موقع او كتاب (يفضل باللغة العربية) ؟؟

شكرا لجهودكم
محبكم من السعودية

وعليكم السلام،،
شكرا لك أخي الكريم على كلماتك.
بالنسبة لأفضل كتاب، فهناك العديد منها، ولكني أفضل الكتاب التالي: http://www.amazon.com/Thinking-Java-One-Off-Bruce-Eckel/dp/0131002872
وهو بالانجليزية ولكن لغته بسيطة.

بالنسبة للمواقع فحقيقة يوجد الآلاف منها ولا يحضرني موقع معين حاليا، كل ماعليك فعله هو البحث عن شروحات Tutorials عربية أو انجليزية. وأسأل الله أن يوفقك في مسعاك.

اول شي اشكرك على المجهود الرائع

والشي الثاني
بغيت انبه على نقطه صغيره
في شرح النقطه الثانية
وهي انك طلبت تسمية الصور بأسم
HelloWorldImage
ولما استدعيتها استدعيتها بأسم ثاني
android:src=”@drawable/imageviewar”
وصراحه هذي النقطه لخبطتني
فحبيت انبه عليها

ومشكور مره ثانية

كلامك صحيح أخي ابوعبدالعزيز.. أشكرك على التنبيه ومعذرة على الخطأ الذي أفلت من مرحلة التنقيح.. (سيتم تصحيحه)

تحياتي لك وبالتوفيق 🙂

sara يقول:

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

شكراً و keep going 🙂

بارك الله فيك أخي
إذا ممكن تشرح لنا دور this

أهلا أخي عبدالمؤمن.. ذكرت في الشرح بأن:
this تستخدم للدلالة على أن الكائن المنشأ ينتمي للسياق البرمجي الحالي المتمثل بمجموعة السياق Context Class والتي هي أحد أسلاف Ancestors المجموعة التي نعمل عليها حاليا (بتتبع التسلسل الهرمي نجد أن: HelloWorldArdroid extends Activity extends ApplicationContext extends Context).

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

تحياتي لك..

د عبد الله يقول:

بس حبيت أنوه أنه في ( / ) ناقصة في إغلاق الـ tag في نقطة رقم 2

Mohd يقول:

اخي وائل

واجهني الخطأ التالي

Installation error: INSTALL_FAILED_OLDER_SDK
Please check logcat output for more details.
Launch canceled!

بحثت عن حل ولم اجد

Mohd
أنت تقوم بتنصيب التطبيق على محاكي أو جهاز نسخته أقدم من التطبيق. يعني التطبيق نسخته ٢.٠ مثلا وأنت تحاول تنصيبه على جهاز يحمل النسخة ١.٦. يتوجب عليك عمل العكس.

العكس او ان تكون النسخة مشابهة لتلك الموجودة على الجهاز. (مشابهة أو أقل)

Mohd يقول:

يعطيك العافية

قمت قبل فترة بتنزيل آخر نسخة من دون تثبيت المحاكي الجديد

اكرر شكري لك

toto يقول:

اخوي لو سمحت انا طبقت اظهار الصوره بالمحاكي لكن تطلع لي بالمحاكي المسج هدا

the application hello World Image (process android_programmers_guide……)has stopped unexpectedly.

في ايش تتوقع اني علطان

angel_flower يقول:

il faut déclarer toutes les classes java dans le fichier AndroidManif.xml
par exemple on déclare la classe personne:

بمعنى اخر يجب تعريف كل الاجزاءjava في AndroidManif.xml

محمد يقول:

السلام عليكم ..
مررت بالصدفه على الموقع الجميل و عندي تعليق و سؤال بعد اذنك.
اولا ..مررت بسرعه على الشرح و تقريبا لم افهم شيئ لان الشرح كان باللغة العربية و هذه اول مرة اتعرض فيها لشرح كودات باللغه العربية فالمصطلحات كانت صعبه شوي .
ثانيا
انا مبرمج Microsoft .NET
اعمل في شركه اتصلات و قد طلب مني العمل على دراسه امكانية انشاء تطبيقات معينه للهواتف الذكية (بلاك بيري ,اي فون ,و الهواتف التي تعمل على اندرويد بلاتفورم) .
المشكله هنا انني استطيع فهم المنطق في البرمجه في شرحك ولكن مشكلتي في ال Syntax ..هناك اختلاف بين الجافا و مايكروسوفت دوت نت .
سؤالي هو :
حل اتاحت اندرويد مؤخرا الفرصه لتطوير هذه التطبيقات باستخدام مايكروسوفت دوت نت ام لا ..و تقبل مروري مع الشكر .

محمد عبد الفتاح يقول:

مع اﻷسف سيد محمد تطوير تطبيقات اﻷندرويد حصراً بلغة الجافا.

اسماء يقول:

السلام عليكم

قابلتني المشكلة دي عند تطبيق البرنامج ومش عارفة اوصل لحل

ارجو اي حد عارف الحل يساعدني

http://www.4shared.com/photo/WftkPYeG/____.html

حنين يقول:

السلام عليكم
شكرا اخي على هذا المجود واسأل الله ان يجعلهفي ميزان حسناتك .
انا طالبة في السنةالخامسة في الكلية.ادرس مادة mobile computing والتي تطرقنا فيها لنظام الاندرويد.الاستاذ طلب منا انجاز مشروع عمل الة حاسبة.انا بدأت بالبرمجة ولكني واجهت صعوبة في حل بعض الامور واحتاج الى من يرشدني وللاسف الوقت الذي كلفنا به لانجاز هذا المشروع قصير جدا..
فارجو ان تكون عون لي. لا اطلب منك ان تعطيني البرمجة جاهزة مقدمة على طبق من ذهب.بل مساعدة في شرح ما استعصى علي.ارجو ان ترد علي قبل 18 من يونيو 20112.
سأتواصل معك عن طريق الايميل..
ودعواتكم لي بالنجاح….

صديق يقول:

الرجاء وضع التطبيق في ملف يمكن تحميله
بعض الصور في الدرس لم تضهر

mohamed يقول:

يا اخي انا عندي مشكلة لما احمل الاندرويد لااجد ملف ازو لكي اثبته على vmware وعند فك الضغط على الملف اجد ما يلي: boot – data.sqs- isolinux- isolinux.cfg- kernel- ramdisk- system.sqs- vesamenu.c32- ارجو المساعدة وشكرا

عبدالله المترب يقول:

اخي العزيز وائل

اريد اعمل برنامج لعرض الصور لتلفونات الاندرويد

ارجوك بأن ترد لي بماذا اعمل حيث وانا حملت adt-bundle-windows-x86-20130219

وايضا jdk-7u17-nb-7_3-windows-i586

هل هؤلا الملفات المطلوبه او في نقص اخي
وجزاك الله خيرا

محمد يقول:

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

مصعب يقول:

اتمنى المساعده انا لا استطيع انا اجد ملف youtube xml ما هو الحل

Leave a Reply

Your email address will not be published. Required fields are marked *