بوابة اإلنترنت الرقمية دورة تعلم برمجت تطبيقاث األندرويد _- المحاضرة الحامسة-_ حل الوظيفت السابقت مع شرح بعض الميزاث األخرى في إنشاء ال Activities هذه

الحجم: px

بدء العرض من الصّفحة:

Download "بوابة اإلنترنت الرقمية دورة تعلم برمجت تطبيقاث األندرويد _- المحاضرة الحامسة-_ حل الوظيفت السابقت مع شرح بعض الميزاث األخرى في إنشاء ال Activities هذه"

مُتوكّل قحطان
منذ 2 سنوات سابقة
المشاهدات:

1 بوابة اإلنترنت الرقمية دورة تعلم برمجت تطبيقاث األندرويد _- المحاضرة الحامسة-_ حل الوظيفت السابقت مع شرح بعض الميزاث األخرى في إنشاء ال Activities هذه الدورة برعا ة كل الشكر والتقد ر للدكتور المهندس عبدالحل م دندوش ف توج ه لنشر الفائدة للجم ع.. 1

2 ف هذه المحاضرة - بإذن هللا - سوف نقوم بشرح حل وظ فة المحاضرة السابقة باإلضافة للق ام بشرح طرق إنشاء activities أخر غ ر األساس ة وبعض المم زات األخرى.. نص الوظ فة السابقة : المطلوب تصم م الواجهة الرئ س ة لبرنامج األذكار بح ث تحتوي على 4 أزرار زر أذكار الصباح وزر أذكار المساء وزر أذكار اإلست قاظ من النوم وزر أذكار ما قبل النوم.. وقم بتصم م وترت ب األزرار بالشكل الذي روق لك. طر قة الحل بالبدا ة نقوم بتأس س الترت ب األساس للواجهة هل ه linear أو غ ر ذلك : : الواجهة بشكلها األساس تكون "linear_layout default = " linear نقوم بتحد د طر قة إصطفاف العناصر الت سوف نقوم بإضافتها هل ه أفق ة أم عمود ة : horizontal Vertical or 2

3 وبعدها نقوم بوضع العناصر : نقوم بوضع العناصر الت نر د أن نضمنها ضمن هذه الActivity وه كما هو واضح ف هذه الوظ فة : 4 أزرار لكل زر كتابة محددة وID محدد. س: ما الفرق ب ن ال ID وب ن ال text متلك ID خاص به وهل جب على كل عنصر أن ج: ال text هو ما كتب داخل العنصر ول س له أي فعل برمج فهو تصم م أو label لمعرفة إلى ماذا ش ر الزر و مكنك كتابة أي ش ء تر ده به وبال ق ود.. ولكن ال نستخدمه وال نستط ع إستخدامه ف البرمجة. و مكن أن كون هناك أكثر من زر متلك نفس ال text :مثال : زر ن مكتوب على كل واحد منهم "خروج" 3

أما ال ID فهو مم ز لكل عنصر نر د أن نقوم ببرمجته وإعطاءه وظ فة مع نة بح ث أننا نستدع الزر عن طر ق ال ID ومن ثم نقوم بإعطاءه مهمة مع نة تم تنف ذها ف حال الضغط على الزر.

4 أما ال ID فهو مم ز لكل عنصر نر د أن نقوم ببرمجته وإعطاءه وظ فة مع نة بح ث أننا نستدع الزر عن طر ق ال ID ومن ثم نقوم بإعطاءه مهمة مع نة تم تنف ذها ف حال الضغط على الزر.. ال شترط إعطاء ID لكل عنصر لكن العناصر الت ال تملك ID ال مكن إعطاؤها أ ة مهمة أو برمجتها.. نقوم بإضافة األزرار على الشكل التال : نالحظ ف الصورة بعد إضافة ال ID لكل عنصر وجوده على سار الشاشة مع الtext الخاص به. بعد إضافة تعر ف كل عنصر ننتقل اآلن إلى القسم المرئ من األسفل : Graphical Layout 4

5 نالحظ الشكل التال : بعد الدخول إلى ال properties الخاصة بكل عنصر وتظب ط مكانه ووضع ته كما تم شرحه ف المحاضرة الماض ة ظهر لنا الشكل التال : 5

6 نكرر جم ع ما سبق على كافة األزرار ف ظهر لنا الشكل التال : طر قة تشغ ل البرنامج الخاص بك لمعا نة ك ف ظهر على جهاز األندرو د : بالزر ال م ن إضغط على المشروع الخاص بك وإضغط على run as ومن ثم : android application 6

إنتظر قل ال حتى تم تحم ل البرنامج على المحاك الخاص بك : بعض الميزات اإلضافية التي يمكننا تعلمها اآلن : - 1 تغيير أيقونة البرنامج الخاص بك : قم بالخطوات التال ة : -قم بإخت ار أ قونة خاصة بالبرنامج

7 إنتظر قل ال حتى تم تحم ل البرنامج على المحاك الخاص بك : بعض الميزات اإلضافية التي يمكننا تعلمها اآلن : - 1 تغيير أيقونة البرنامج الخاص بك : قم بالخطوات التال ة : -قم بإخت ار أ قونة خاصة بالبرنامج الخاص بك على أن كون إمتدادها.png أ ب - إذهب إلى مسار المشروع الخاص بك والذي كون ف الغالب : C:\Users\YOURUSER\workspace ومن ثم أدخل إلى ملف res ومنه إلى األ قونة الخاصة بك ف هذا المسار drawable-hdpi وقم بوضع 7

8 ج- نقوم بالعودة إلى ال eclipse اآلن ونذهب إلى المشروع الخاص بنا وإلى ملف ال AndroidManifest.xml الذي ذكرنا سابقا أنه تحكم ف كامل البرنامج. د- نقوم بالتعد ل كما ف الصورة : 8

9 بعد ذلك نقوم بتشغ ل البرنامج الخاص بنا فنالحظ : وضع خلفية للactivity : الخاصة بك نقوم بوضع الخلف ة الت نرغب بأن تكون خلف ة هذا البرنامج ف نفس المسار الذي قمنا بوضع األ قونة ف ه. أ 9

10 ب- نقوم بالذهاب إلى ملف الxml الخاص بال activity ونض ف خاص ة الخلف ة : android:background="@drawable/background_name" نقوم بتشغ ل المشروع فتظهر لنا الخلف ة الخاصة بنا.. هناك خواص أخرى خاصة بالزر من كظهور التنو ه hint ولون الزر وشفاف ته ونوع الخط الخاص به وغ رها سأتركها للمحاضرة القادمة إن شاء هللا.. 10

11 .. اآلن سوف نقوم بتعلم مفهور ال Values وك ف ة اإلستفادة منها ال Values ه مفهوم دل على الق م بدال من أن نضع نصا كامال داخل الكود البرمج نقوم بترم زه ف قسم ال values بق مة مع نة من حرف ن ونضعهم بداله وهكذا كون البرنامج مصنف وسهل التصم م ف جهة الق م ف جهة واألكواد البرمج ة البحتة ف جهة أخرى.. فبدل من أن تبحث عن نص مع ن ب ن الكود الذي صل إلى مئات األسطر لتقوم بتعد له تقوم باإلشارة إلى هذا النص عن طر ق متحول ف الvalues وعندما تقوم بتعد ل هذا المتحول تم تعد ل جم ع ما رتبط به داخل هذا البرنامج.. أ ضا تستخدم للثوابت :إسم البرنامج وإسم الactivity وغ رها بح ث تكون ثابتة ومعروفة.. تستخدم أ ضا ال Values لأللوان : فاأللوان ف برمجة األندرو د تتكون من خل ط من األلوان الثالثة األساس ة األزرق واألخضر واألحمر تخ ل أنك تحتاج إلى اللون البنفسج وكلما أردت إستخدامه لكتابة نص مع ن فإنك تقوم بكتابة الكود الخاص به وتتذكر مما كان تكون! بالتال نقوم بإنشاء متحول ف الValues نسم ه violet ونكتب بداخله الق مة الخاصة باللون البنفسج وبالتال كلما إحتجنا إلى اللون نستدع هذه الق مة مباشرة.. ف ماذا سوف نستخدم الValues ف مشروعنا األول بدل من أن نقوم بكتابة األذكار الخاصة بنا داخل الكود كل ذكر قد كون سطر أو سطر ن! نقوم بوضعها داخل الValues وإستخدام المتحول الخاص بها. 11

12 نقوم بهذه الطر قة بإضافة األذكار واحدة تلو األخرى كل ذكر تم إضافته بValue خاصة به... بعد اإلضافة سوف نقوم بإنشاء طر قة إنشاء الactivity : activity جد دة واحدة لكل نوع من أنواع الذكر 12

13 فتظهر لنا النافذة التال ة :.. نضغط على Finish فتظهر لنا صفحة جد دة فارغة للبدء بتصم مها الوظ فة القادمة : المطلوب إنشاء 4 واجهات ل Activities مختلفة كل واحدة تضم عنوان خاص بها و أذكارها الخاصة إما بالصباح أو بالمساء أو قبل النوم أو اإلست قاظ من النوم من المرجع ف اإلنترنت : حصن المسلم عند إنشاء الواجهة والبدء بوضع األذكار سوف نالحظ حاجتنا إلى أن نجعل الشاشة قابلة لك تصبح قابلة للسحب إلى أسفل وأعلى حتى نتمكن من قراءة الباق.. ستخدم ال Scroll_View عندما ال نستط ع أن نضع كل مانر د ف الواجهة فتصبح الواجهة بعد تضم نه طو لة بإمكاننا تضم ن ما شئنا بها و تم النزول إل ها عن طر ق ال scroll بعد ذلك.. 13

14 نالحظ كثرة الكتابات ف الواجهة خرجت عن الactivity بالتال نحتاج إلى تعر ف Scroll_View لك نستط ع النزول إلى األسفل أو األعلى ومشاهدة باق العناصر.. : تم تعر ف ال Scroll_View بالطر قة التال ة - نقوم بإضافة الكود التال قبل تعر ف طر قة ترت ب الواجهة :"أي ف مثالنا قبل كود ال : Linear 1 <ScrollView xmlns:android=" android:layout_width="fill_parent" android:layout_height="wrap_content" > 14

15 - نقوم بكتابة كود الواجهة بشكل طب ع بعد ذلك وف األخ ر بعد إغالق ترو سة الlinear ال ننسى إغالق ترو سة ال ScrollView كما ف الكود : 2 <?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android=" android:layout_width="fill_parent" android:layout_height="wrap_content" > <LinearLayout xmlns:android=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="test for ScrollView" android:isscrollcontainer="true" /> </LinearLayout> </ScrollView> س : قمت بتصم م جم ع الواجهات المطلوبة ولكن عندما أقوم بتشغ ل المشروع تظهر دائما أول واجهة "الواجهة الرئ س ة main الت قمنا بتصم مها ف المحاضرة السابقة " فما الحل ج : سوف نقوم ف المحاضرة القادمة إن شاء هللا بتعلم طر قة ربط األزرار بالواجهات بح ث عمل البرنامج بشكل سل م وبعدها نقوم بإضافة بعض اإلضافات الجمال ة للبرنامج.. 15

16 من هنا إلى ذلك الوقت ف حال أردت تجربة الواجهات الخاصة بك أو أردت تنز ل صور من مشروعك قم بالدخول إلى ملف الmain.java الموجود داخل الsrc وقم بتعد ل السطر التال : setcontentview(r.layout.main); إلى : setcontentview(r.layout.x);. ح ث X هو إسم الواجهة المراد أن تعمل فور تشغ ل البرنامج بالتوف ق والسالم عل كم ورحمة هللا وبركاته المهندس : عبدالعز ز رضوان 10-Mar

ملفّات مشابهة

) NSB-AppStudio برمجة تطبيقات األجهزة الذكية باستخدام برنامج ( ) برمجة تطبيقات األجهزة الذكية باستخدام برنامج ( NSB-AppStudio الدرس األول ) 1 ( الدرس

) NSB-AppStudio برمجة تطبيقات األجهزة الذكية باستخدام برنامج ( ) برمجة تطبيقات األجهزة الذكية باستخدام برنامج ( NSB-AppStudio الدرس األول ) 1 ( الدرس ) NSB-AppStudio ) 1 ( أهداف الدرس : بعد انتهاء هذا الدرس ستكون الطالبة قادرة على أن : )1 توضح مميزات برنامج ( NSB-AppStudio ) 2( تعدد لغات البرمجة المستخدمة في برنامج ( NSB-AppStudio ) 3( تذكر خطوات كتابة