Android bietet zwar eine Vielzahl von Widgets für kleine, wiederverwendbare, interaktive Elemente, aber möglicherweise müssen Sie auch größere Komponenten wiederverwenden, die ein spezielles Layout erfordern. Wenn Sie komplette Layouts effizient wiederverwenden möchten, können Sie mit den Tags <include> und <merge> ein Layout in ein anderes einbetten.
So lassen sich komplexe Layouts erstellen, z. B. ein Bereich mit Ja- oder Nein-Schaltflächen oder eine benutzerdefinierte Fortschrittsanzeige mit Beschreibungstext. Außerdem können Sie alle Elemente Ihrer Anwendung, die für mehrere Layouts gemeinsam sind, extrahieren, separat verwalten und in jedes Layout einbinden. Sie können einzelne UI-Komponenten erstellen, indem Sie ein benutzerdefiniertes View schreiben. Das geht jedoch einfacher, wenn Sie eine Layoutdatei wiederverwenden.
Wiederverwendbares Layout erstellen
Erstellen Sie zunächst eine neue XML-Datei und definieren Sie das Layout, das Sie wiederverwenden möchten. Im folgenden Layout wird beispielsweise eine Titelleiste definiert, die in jede Aktivität aufgenommen werden soll (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>
Die Stamm-View muss genau so aussehen, wie sie in jedem Layout erscheinen soll, in dem Sie dieses Layout hinzufügen möchten.
<include>-Tag verwenden
Fügen Sie im Layout, in das Sie die wiederverwendbare Komponente einfügen möchten, das Tag <include> hinzu. Hier ist beispielsweise ein Layout mit der Titelleiste aus dem vorherigen Beispiel:
<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>
Sie können auch alle Layoutparameter – alle android:layout_*-Attribute – der Stammansicht des enthaltenen Layouts überschreiben, indem Sie sie im <include>-Tag angeben. Dies wird im folgenden Beispiel gezeigt:
<include android:id="@+id/news_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="@layout/title"/>
Wenn Sie jedoch Layoutattribute mit dem <include>-Tag überschreiben möchten, müssen Sie auch android:layout_height und android:layout_width überschreiben, damit die anderen Layoutattribute wirksam werden.
<merge>-Tag verwenden
Mit dem Tag <merge> lassen sich redundante Ansichtsgruppen aus der Ansichtshierarchie entfernen, wenn ein Layout in ein anderes aufgenommen wird. Ein Anwendungsfall für <merge> ist die Implementierung einer benutzerdefinierten Ansicht durch Erweiterung einer ViewGroup.
Wenn Ihr Hauptlayout beispielsweise eine vertikale LinearLayout ist, in der zwei aufeinanderfolgende Ansichten in mehreren Layouts wiederverwendet werden können, erfordert das wiederverwendbare Layout, in dem Sie die beiden Ansichten platzieren, eine eigene Stammansicht. Die Verwendung eines anderen LinearLayout als Stamm für das wiederverwendbare Layout führt jedoch zu einem vertikalen LinearLayout innerhalb eines vertikalen LinearLayout. Das verschachtelte LinearLayout erfüllt keinen wirklichen Zweck und verlangsamt die UI-Leistung.
Stattdessen können Sie ein LinearLayout erweitern, um eine benutzerdefinierte Ansicht zu erstellen, und eine Layout-XML zur Beschreibung der untergeordneten Ansichten verwenden. Das oberste Tag in der XML-Datei ist <merge> und nicht LinearLayout, wie im folgenden Beispiel gezeigt:
<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>
Wenn Sie dieses Layout mithilfe des <include>-Tags in ein anderes Layout einfügen, ignoriert das System das <merge>-Element und platziert die beiden Schaltflächen anstelle des <include>-Tags direkt im Layout.
Weitere Informationen zu <include> finden Sie unter Layoutressource.