Повторно используйте макеты с помощью <include>

Попробуйте способ создания композиций.

Jetpack Compose — это рекомендуемый набор инструментов для создания пользовательского интерфейса для Android. Узнайте, как работать с макетами в Compose.

Слотовые схемы →

Хотя Android предлагает множество виджетов для создания небольших, многократно используемых интерактивных элементов, вам также может потребоваться повторно использовать более крупные компоненты, требующие специальной компоновки. Для эффективного повторного использования целых макетов используйте теги <include> и <merge> для встраивания одного макета в другой.

Это позволяет создавать сложные макеты — например, панель с кнопками «да» или «нет» или настраиваемый индикатор выполнения с описанием. Это также означает, что вы можете выделить любые элементы вашего приложения, общие для нескольких макетов, управлять ими отдельно и включать их в каждый макет. Хотя вы можете создавать отдельные компоненты пользовательского интерфейса, написав собственный View , это проще сделать, повторно используя файл макета.

Создайте многоразовый макет.

Для начала создайте новый XML-файл и определите макет, который вы хотите иметь возможность повторно использовать. Например, вот макет, который определяет заголовок окна для каждого действия ( 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>

Корневой View должен выглядеть именно так, как вы хотите, чтобы он отображался в каждом макете, куда вы планируете добавить этот макет.

Примечание: Атрибут tools:showIn в приведенном выше XML-файле является специальным атрибутом, который используется только на этапе проектирования в Android Studio и удаляется во время компиляции. Он указывает макет, который включает этот файл, поэтому вы можете предварительно просмотреть и отредактировать этот файл, как он отображается при встраивании в родительский макет.

Используйте тег <include>

Внутри макета, куда вы хотите добавить многоразовый компонент, добавьте тег <include> . Например, вот макет, который включает заголовок из предыдущего примера:

<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>

Вы также можете переопределить все параметры макета — любые атрибуты android:layout_* — корневого представления включенного макета, указав их в теге <include> . Это показано в следующем примере:

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

Однако, если вы хотите переопределить атрибуты макета с помощью тега <include> , также переопределите android:layout_height и android:layout_width чтобы другие атрибуты макета вступили в силу.

Используйте тег <merge>

Тег <merge> помогает устранить избыточные группы представлений в иерархии представлений при включении одного макета в другой. Один из вариантов использования <merge> — это реализация пользовательского представления путем расширения ViewGroup .

Например, если ваш основной макет представляет собой вертикальный LinearLayout в котором два последовательных элемента могут быть повторно использованы в нескольких макетах, то для повторно используемого макета, в котором вы размещаете эти два элемента, требуется собственный корневой элемент. Однако использование другого LinearLayout в качестве корневого элемента для повторно используемого макета приводит к созданию вертикального LinearLayout внутри вертикального LinearLayout . Вложенный LinearLayout не выполняет никакой реальной функции и замедляет работу пользовательского интерфейса.

Вместо этого вы можете расширить LinearLayout , чтобы создать пользовательское представление, и использовать XML-файл макета для описания его дочерних представлений. Верхним тегом в XML-файле будет <merge> , а не LinearLayout , как показано в следующем примере:

<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>

При включении этого макета в другой макет с помощью тега <include> система игнорирует элемент <merge> и размещает две кнопки непосредственно в макете, на месте тега <include> .

Для получения дополнительной информации о <include> см. ресурс Layout .