Używaj ponownie układów z operatorem <include>

Android oferuje wiele różnych widżetów, które mają małe, interaktywne elementy wielokrotnego użytku, jednak może być konieczne ponowne wykorzystanie większych komponentów, które wymagają specjalnego układu. Aby skutecznie korzystać z pełnych układów, umieść jeden układ w innym za pomocą tagów <include> i <merge>.

Dzięki temu możesz tworzyć złożone układy, np. panel z przyciskiem Tak lub Nie lub niestandardowy pasek postępu z tekstem opisu. Oznacza to, że możesz wyodrębniać dowolne elementy aplikacji, które występują w wielu układach, zarządzać nimi oddzielnie i uwzględniać je w każdym układzie. Pojedyncze komponenty interfejsu można tworzyć za pomocą niestandardowych elementów View. Jednak łatwiej to zrobić, używając ponownie pliku układu.

Tworzenie układu wielokrotnego użytku

Zacznij od utworzenia nowego pliku XML i zdefiniowania układu, którego chcesz używać ponownie. Na przykład tak wygląda układ, który określa pasek tytułu do uwzględnienia w każdej aktywności (titlebar.xml):

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/titlebar_bg"
    tools:showIn="@layout/activity_main" >

    <ImageView android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@drawable/gafricalogo" />
</FrameLayout>

Element główny View musi być dokładnie taki, jaki ma być wyświetlany w każdym układzie, do którego chcesz dodać ten układ.

Używanie tagu <include>

W układzie, do którego chcesz dodać komponent wielokrotnego użytku, dodaj tag <include>. Oto przykład układu, który obejmuje pasek tytułu z poprzedniego przykładu:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/app_bg"
    android:gravity="center_horizontal">

    <include layout="@layout/titlebar"/>

    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="@string/hello"
              android:padding="10dp" />
    ...
</LinearLayout>

Możesz też zastąpić wszystkie parametry układu (dowolne atrybuty android:layout_*) widoku głównego uwzględnionego układu, określając je w tagu <include>. Widać to w tym przykładzie:

<include android:id="@+id/news_title"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         layout="@layout/title"/>

Jeśli jednak chcesz zastąpić atrybuty układu za pomocą tagu <include>, zastąp też atrybuty android:layout_height i android:layout_width, aby zastosować inne atrybuty układu.

Używanie tagu <merge>

Tag <merge> pomaga wyeliminować zbędne grupy widoków w hierarchii widoków, gdy dany układ jest uwzględniony w innym. Jednym z przypadków użycia <merge> jest implementacja widoku niestandardowego przez rozwinięcie interfejsu ViewGroup.

Jeśli np. układ główny to pionowy układ LinearLayout, w którym 2 kolejne widoki mogą być wielokrotnie wykorzystywane w wielu układach, układ wielokrotnego użytku, w którym umieszczasz 2 widoki, wymaga własnego widoku głównego. Użycie innego elementu LinearLayout jako poziomu głównego układu wielokrotnego użytku powoduje jednak pionowy element LinearLayout wewnątrz pionowego elementu LinearLayout. Zagnieżdżony element LinearLayout nie służy do celów rzeczywistych i spowalnia działanie interfejsu użytkownika.

Zamiast tego możesz rozszerzyć widok LinearLayout, aby utworzyć widok niestandardowy, i użyć kodu XML układu do opisania jego widoków podrzędnych. Górny tag w pliku XML to <merge>, a nie LinearLayout, jak w tym przykładzie:

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

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/add"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/delete"/>

</merge>

Gdy uwzględnisz ten układ w innym układzie, używając tagu <include>, system zignoruje element <merge> i umieści 2 przyciski bezpośrednio w układzie zamiast tagu <include>.

Więcej informacji o elemencie <include> znajdziesz w sekcji dotyczącej zasobu Układ.