W UI nie wyświetlamy tylko jednego elementu na raz, zwykle jest ich znacznie więcej.

Korzystamy wtedy z rozkładów (layoutów), dzięki którym możemy odpowiednio pogrupować elementy w widoku.

ViewGroup jest klasą abstrakcyjną, a jak wiemy z programowania obiektowego, nie da się utworzyć obiektu takiej klasy. Jeżeli mamy do czynienia z klasą dziedziczącą po klasie abstrakcyjnej, to obiekt takiej klasy możemy stworzyć. Klasami dziedziczącymi po ViewGroup są m.in.: LinearLayout, RelativeLayout oraz GridLayout.

Layouty mogą być kontenerami dla innych layoutów oraz elementów widoku. W skrócie możemy je w sobie zagnieżdżać.

LinearLayout – Jeden z najpopularniejszych layoutów, który układa elementy w pionowej kolumnie lub poziomym rzędzie.

• android:orientation – określenie kieruknu: horisontal/vertical
• android:layout_weight – waga elementu, czyli wielkość obszaru jaki będzie element zajmował

Przykład użycia:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="some content 1"
        android:textSize="30sp"
        android:background="#c0c0c0"
    />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:text="some content 2"
        android:textSize="30sp"
        android:background="#aaaaaa"
    />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="some content 3"
        android:textSize="30sp"
        android:background="#aabbbc"
    />

</LinearLayout>

Linijka xmlns:android=”http://schemas.android.com/apk/res/android” wskazuje na używaną przestrzeń nazw.

Zadanie:

Wykorzystując dotychczas zdobytą wiedzę i korzystając z pomocy dokumentacji spróbuj odtworzyć widoczny poniżej layout:

RelativeLayout – układa elementy względnie, czyli względem innych elementów lub rozkładu.

• android:layout_alignParent…– Bottom/Left/Right/Top – określenie położenia względem rozkładu
• android:layout_center… -Horizontal/Vertical – gdy chcemy wyśrodkować element w rodzicu/rozkładzie
• android:layout_below – możemy użyć celem umieszczenia elementu pod innym elementem, ale ten musi mieć przypisane ID
  

Przykład użycia:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <ImageView 
        android:src="@drawable/rocks"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="centerCrop"
    />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:gravity="center"
        android:text="Mój relatywny layout"
        android:textSize="28sp"
        android:textColor="#000"
        android:background="#fff"
    />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="button1"
        android:textSize="20sp" 
        android:layout_alignParentBottom="true"
        android:background="#fff"
    />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="button2"
        android:textSize="20sp" 
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:background="#fff"
    />

</RelativeLayout>