Hello Android

נפתח אפליקצית אנדרואיד המדפיסה hello world על המסך. כלי הפיתוח של אנדרואיד ה- ADT - Android Design Tool, מגיע עם תוכנית הדוגמא hello world מובנית. אנו נשפץ אותה מעט רק כדי לקבל תחושה על מה בעצם קורה שם.

פתיחת פרויקט
אני מניח שבשלב זה בוצעו ההתקנות של 3 המרכיבים: JDK, Eclipse, Android SDK.
אם לא, זה הזמן להתקין...

• הפעל את Eclipse.
• פתח באקליפס פרויקט אנדרואיד חדש: file->new->Android Project
• הכנס את הנתונים הבאים- ראה תמונה למטה :
• Project name: HelloWorld. זהו פרמטר של Eclipse ורק כאן יש לו משמעות.
• Build Target: Android 2.2
• Application name: Hello World. משמש לתצוגה.
• Package name: com.example.hello. זהו שם חבילת ה-java. ראה פוסט בנושא.
• Create Activity: Hello. זהו שם ה-Activity הראשון שיופעל.
• Min SDK Version: 8

התמונה הבאה מתארת את חלון פתיחת פרויקט חדש (כפתורי הבחירה בתחתית החלון נקצצו מהתמונה):

• לחץ על סיום (Finish).

• כעת נריץ את הפרויקט על גבי האמולטור, ונקבל הדפסת "Hello World" על המסך. אח"כ נסביר קצת.
• הרץ את הפרויקט:  קליק ימני על HelloAndroid ב- Project Explorer ובחר: Run as -> Android Application
• כתוצאה מההרצה יופעל האמולטור. זה יראה כך:

כעת לחץ על Menu (כפתור שני משמאל, ראה בתמונה), ואז על בחירת חלון האפליקציות - יופיע במרכז המסך למטה. מתקבל המסך לו ציפינו, ראה תמונה:

לחץ על כפתור סמל הבית ואז על סמל המטריצה שיוביל לתצוגת האפליקציות. זהה את האייקון עם הכיתוב "Hello World". לחיצה עליו תפעיל את האפליקציה.

עד כאן ביצענו את הפעולות הבאות:

• יצרנו פרויקט אנדרואיד חדש.
• בנינו והרצנו אותו על האמולטור. קיבלנו הדפסה של Hello World על המסך - למרות שלא כ"כ ברור מאיפה זה הגיע...

כעת נבחן את הפרויקט וננסה להבינו. ניתן מבט על חבילת הקבצים של הפרויקט: בחלון- Package Explorer באקליפס נוכל לראות את עץ הפרויקט בו הקבצים מאורגנים בספריות (Directories), שמתפצלות מ HelloAndroid.

נביט על ספריות הפרויקט. מבנה העץ בו הן מסודרות קבוע:

• ספרית src מכילה את קובצי המקור, הכתובים בג'אווה.
• ספרית Android2.2 שמכילה את ספריות ג'אווה, אנדרואיד וכד'.
• ספרית res המכילה קבצי  resource -קבצי עזר המאורגנים בתתי ספריות כפי שמפורט להלן:

• ספריות draw - מכילות תמונות שונות לתצוגה, כולל אייקונים. נפתחו 3 ספריות- hdpi, mdpi, ldp עבור מכשירים עם רזולוציה גבוהה, בינונית ונמוכה.
• ספרית layout - כוללת קבצים המתארים את מבנה מסך התצוגה. עבור כל מסך תצוגה נדרש קובץ כזה, הבנוי בפורמט XML. שימוש בקובץ layout מאפשר הפרדה בין קוד התוכנית לעיצוב המסך ובכך מאפשר שינוי עיצוב המסך בלי שום צורך לשנות את התוכנית עצמה. בהמשך נדון במבנה קובץ ה-layout.
• ספרית values - כוללת קבצים המכילים ערכים קבועים, למשל שמות (מחרוזות\strings) להדפסה על המסך. קיימים (כיום) 6 סוגים של קבצי XML שניתן לשמור תחת values:
• strings
• styles
• animations
• dimensions
• colors
• arrays
• ריכוז הערכים והמאפיינים בקובץ נפרד מאפשר לבצע בקלות שינויים  בלי צורך לשנות את התוכנית עצמה או את ה- layout. השיטה הזו בהחלט מאד דומה לשיטה של HTMS ו CSS. בדוגמא שלנו נשתמש ב- strings.xml, כשבפוסטים אחרים  נדגים שימוש בשאר הסוגים של קבצי ה-values.

בשיעור זה נתייחס ל 4 קבצים:
קובץ layout ששמו main.xml.
קובץ values ששמו strings.xml
קובץ draw ששמו icon.png
קובץ src ששמו Hello.java.

• ספרית gen מכילה קבצים המיוצרים אוטומטית על ידי המערכת לצורכת בניית האפליקציה. הקובץ  שנמצא ב-gen  הוא R.java,  המכיל אינפורמציה שנאספה מקבצי ה- resourse ומאורגנת בפורמט המתאים לשפת ג'אווה. האינפורמציה מאורגנת ב- classes עם מספרי זהוי (id) על פיהם התוכנית יכולה להתייחס ל- resources. נציין ש-class  R מנוהל אוטומטית ע"י ה-plug-in של האנדרואיד באקליפס. המערכת תזהה כל שינוי שיעשה באלמנטים שבספריית res, ותעדכן את הקובץ R.java בהתאם. נסו למשל להוסיך קובץ תמונה לספריית draw ובידקו את העידכון האוטומטי ב- R.java. באותו אופן שנו את קובץ ה-layout וודאו את השינוי האוטומטי ב-R.java. בתוך הקובץ אפשר לראות מספרים הקסאדצימאלים לשימושן של מנהל ה-resources של אנדרואיד. מדובר במצביעים מסוג Integer. זוהי השיטה של אנדרואיד לנהל את המשאבים בצורה חסכונית. החיסרון - זוהי הצגה אבסטרקטית. בכל אופן - המפתח לא נדרש להכיא את תוכן הקובץ הזה בכלל!

 ה AndroidManifest.xml הוא קובץ המתאר את מרכיבי האפליקציה ומגדיר את החיבורים בינהם.נתייחס אליו באחד מהשיעורים הבאים.



קובץ ה-Layout נראה כך:

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3.     android:orientation="vertical"
4.     android:layout_width="fill_parent"
5.     android:layout_height="fill_parent"
6.     >
7. <TextView 
8.     android:layout_width="fill_parent"
9.     android:layout_height="wrap_content"
10.     android:text="@string/hello"
11.     />
12. </LinearLayout>

השורה הראשונה מסמנת שמדובר בקובץ xml ורסיה 1.0 וקידוד הקובץ.

מכאן ואילך יוגדר מבנה התצוגה. תחילה מעטפת התצוגה הכוללת, ואח"כ יוגדרו האופי והגודל של כל אחד ממרכיבי התצוגה. מרכיבי התצוגה יוגדרו אחד אחרי השני כשכל רכיב תצוגה תופס "פרוסה" \ Section מהתצוגה או בתרמינולוגית אנדרואיד מה UI - User Interface. באפליקציה הנ"ל יש רכיב תצוגה יחיד, ה TextView.

השורה השניה מגדירה את מבנה המעטפת של המסך, ואכן המזהה LinearLayout עוטף את שאר ההגדרות בהתחלה ובסוף. הוא מגדיר מבנה בכיוון אנכי (orientation vertical) כך שמרכיבי התצוגה ימוקמו אחד אחרי השני בציר האנכי. רוחב התצוגה וגודל התצוגה מוגדרים fill_parent שמשמעותו - השתמש בכל המרחב העוטף הקיים.

עד כאן הגדרות המעטפת שסומנו ע"י התג LinearLayout. בשורה 7 התג TextView מגדיר איזור להדפסת טקסט בתצוגה. גם כאן מגדירים את רוחב התצוגה (שורה 8)- שוב כ fill_parent אבל גובה התצוגה (שורה 9) מוגדר כאן כ-wrap_content שמשמעותו "השתמש בגודל הדרוש להכלת התוכן הקיים.
וכעת להגדרת תוכן התצוגה (שורה 10):  "text="@string/hello. משמעות הסימון היא שהטקסט שיודפס נמצא בקובץ בשם string.xml והטקסט מוצמד למחרוזת ששמה hello. בדיוק לזה התכוונתי כשתארתי את תפקידו של קובץ strings.xml הנמצא בספרית values. נעבור כעת לצפות בו.

strings.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="hello">Hello World, Hello!</string>
    <string name="app_name">Hello World</string>
</resources>

בקובץ מוגדרות שתי מחרוזות \ string: הראשונה hello אליה ראינו התיחסות בפסקה שתארה את קובץ ה- layout. כעת ניתן לראות שהערך שמושם למחרוזת בשם hello הוא Hello World, Hello!, ואכן זה היה הפלט שהודפס למסך. המחרוזת השניה המוגדרת בקובץ שלנו היא ה app_name, כלומר שם האפליקציה. שם זה מצורף בראש הפלט.

להמשך הבנת התמונה נבחן את קובץ הגאווה hello.java.

Hello.java

package com.example.hello;

1. import android.app.Activity;
2. import android.os.Bundle;
3. public class Hello extends Activity {
4.     /** Called when the activity is first created. */
5.     @Override
6.     public void onCreate(Bundle savedInstanceState) {
7.         super.onCreate(savedInstanceState);
8.         setContentView(R.layout.main);
9.     }
10. }

שורה 3 מגדירה מחלקה (class) בשם Hello. זהו השם שנתנו ל-activity בזמן יצירת הפרויקט. כל מחלקה נשמרת בקובץ נפרד ששמו כשם המחלקה. המחלקה Hello מרחיבה\יורשת את המחלקה Activity (עדיין שורה 3). המחלקה Activity מטפלת ביצירת חלון המאפשר את ממשק המשתמש UI.
המתודה היחידה המוגדרת במחלקה היא onCreate. מתודה זו מופעלת תמיד עם הפעלת המחלקה. שורה 7 מפעילה את הפונקציה המקורית שנמצאת במחלקת Activity אותה אנו יורשים. שורה 8 מפעילה מתודה המופעלת על קובץ main.xml הנמצא בספרית layout. מתודה זו לוקחת את האינפורמציה קובץ ה- layout (אותו סקרנו בפרוט), ובונה את התצוגה לפיו. זהו.
כאן אני מציע תרגיל קטן: נשנה את הפלט המודפס לפלט בעברית: "שלום אנדרואיד, להתראות בשיעור הבא". גש לקובץ strings.xml והחלף את Hello World, Hello! ב- שלום אנדרואיד, להתראות בשיעור הבא. שמור את הקובץ והרץ את האפליקציה מחדש.