תכנות לאנרדואיד בקלות פרק 5 – בניית Layouts על ידי xml

בפרק זה אנו נתקין את אופן כתיבת layouts באמצעות XML.
בעיקר נתרכז בסוגי controls, ואיך כדאי לגשת לממשקים מעט מורכבים יותר מאשר תבניות סטנדרטיות.
בואו ניזכר רגע באפליקצייתhello world מפרק 3
 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent" >

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_centerVertical="true"

        android:text="@string/hello_world"

        tools:context=".MainActivity" />

</RelativeLayout>

אז מה יש לנו כאן?
יש לנו RelativeLayout שהוא בעצם container, נהוג להתחיל כל קובץ layout באיזשהו container שכזה.
RelativeLayout בעצם הינו Layout אשר כל הרכיבים אשר הם הילדים שלו מסודרים באופן יחסי אחד לשני, לדוגמא: במידה ויש לנו TextView ו Button.
נשים לב כי באופן אוטומטי כאשר יוצרים פרוייקט Android חדש, אנו מקבלים TextView ללא אלמנט id.
מהו אותו id?
על מנת להגדיר control ב XML, ולעשות בו שימוש דינאמי או שינוי התוכן שלו או מאפיינים אחרים, אנו צריכים reference ל id שלו. איך כל זה מתחבר לנו?
בואו נגדיר id עבור ה TextView :

	android:id=”@+id/tv1”

למעשה אנו מוסיפים id חדש לפרוייקט (אשר יירשם באותו קובץ R בתיקיית gen באופן אוטומטי) בשם tv1
לאחר מכן, במידה ונרצה לשנות את התוכן של ה TextView, בקוד ה java של ה Activity המתאים, נרשום:

	TextView tv1 = (TextView)findViewById(R.id.tv1); tv1.settext(“goodbye world”);

המתודה findViewById מחזירה View, לכן אנו צריך לבצע Casting ל TextView, מכיוון ש setText הינה מתודה של textView.

הערה לגבי RelativeLayout

במידה ולא נגדיר באופן מפורש את אופן הסידור שלהם, הם יהיו אחד על השני, נוכל להשתמש ב intellisense של Eclipse על מנת לראות את מגוון האפשרויות שלנו

לדוגמא:

Layout_toLeftOf=”@id/tv1” – יציין כי ה control יהיה ממוקם מתחת ל control עם id=tv1

Layout_above=”@id/tv1” – יציין כי ה control יהיה ממוקם מעל ל control עם id=tv1

הפקודות הבאות ימרכזו את ה control במרכז ה container:

android:layout_centerHorizontal="true"

android:layout_centerVertical="true

· **ישנה חובה לציין רוחב וגובה עבור כל control ע"י:

Layout_width

Layout_height

ניתן להתמש במידות עצמן ב:

- “wrap_content” – למעשה יתכווץ ויתרחב ע"פ התוכן שקיים , למשל TextView שיתרחב ויתכווץ ע"י גודל הטקסט שבתוכו.

- “fill_parent” – למעשה יתפוס את אותו המקום כמו ה"אבא" שלו, במקרה שלנו ה"אבא" שלו הינו ה RelativeLayout

- כמו כן, ניתן להשתמש במידות שהן ב dp,sp,px – הקונבנציה היא להשתמש ב

dp(dip – density independent pixels).

סוגי controls נוספים:

EditText

Checkbox

DatePicker

TimerPicker

ScrollView

ListView

ImageView

ImageButton

ToggleButton

עבור כל control ישנם כמה מאפיינים ספציפייים אשר ניתן להגדיר, לדוגמא:

Control מאוד שימושי הינו EditText – (תיבה להזנת טקסט), למשל – אם ברצוני לייעד את ה EditText להזנה של מס' טלפון, אני אוכל להגדיר כי tap על תיבת הזנת הטקסט יקפיץ מקלדת נומרית, זאת ע"י הגדרת המאפיין:

android:inputType="number"

אלמנטים נוספים שיכולים לעזור לנו בבנייה של layouts:

Gravity, Layout Gravity

android:gravity

משפיע על האלמנט הפנימי של ה View, לדוגמא – הטקסט שבתוך ה TextView

android:layout_gravity

משפיע על האלמנט עצמו ביחס להורה שלו

Gravity,layout_gravity יכולים לקבל ערכים :

ככלל אצבע יש להשתמש ב RelativeLayouts, אך כמובן שיש לשקול את הנושא לפי המשימה שעל הפרק. לפעמים LinearLayout יהיה יותר נוח לשימוש, או אפילו Layouts מיוחדים כגון:

FrameLayout, ScrollView, TableLayout