[ Android ] Android 레이아웃 재사용의 마법사: Include 태그와 데이터 바인딩 활용하기

 

include 태그는 안드로이드 레이아웃 작업을 할 때 매우 유용하게 활용 되는 태그이다.
이를 통해 하나의 레이아웃 파일을 다른 레이아웃 파일에 포함시킬 수 있으며,
이는 코드의 재사용성의 높이고 레이아웃 관리의 효율성을 개선하는 데 큰 도움이 된다.

예를 들어, 여러 화면에서 공통적으로 사용되는 헤더나 푸터 같은 UI 요소가 있다면, 해당 요소들을 별도의 레이아웃 파일로 만들어 두고, 각 화면의 레이아웃에서 include 태그를 사용해 해당 레이아웃 파일을 포함시킴으로써 여러 곳에서 이를 재사용할 수 있다.
이 방법을 통해 중복 코드를 줄이고, 유지 보수를 용이하게 만든다.

 

사용 방법은
1. 재사용할 레이아웃 파일 생성:
먼저, 재사용할 레이아웃 파일을 먼저 만들어주면 되는데
상단 바와 같이 레이아웃 구조는 같은데 타이틀 텍스트만 화면 마다 달라지는 경우, 데이터 바인딩을 같이 활용하는 것이 좋다.

데이터 바인딩 설정은 재사용할 레이아웃 파일을 layout 태그로 감싸고, data 태그 안에 다음과 같이 정의 하면 된다.

<data>
    <import type="android.view.View"/>
    <variable
        name="vm"
        type="com.commax.homeposco.base.BaseViewModel"/>
</data>

 

2. include 태그를 사용하여 레이아웃 포함:
재사용할 레이아웃을 포함하고자 하는 XML 파일에서 include 태그를 사용하여 생성한 레이아웃 파일을 포함시켜 주면 된다.
다음은 그 예시이다.

<include
    android:id="@+id/include_title"
    layout="@layout/include_title_with_line"
    bind:vm="@{vm}"
    android:layout_width="match_parent"
    android:layout_height="@dimen/favorite_main_title_height"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"/>

이러한 과정을 통해, 각 클래스마다 동일한 상단 바의 레이아웃을 일일이 구현 할 필요 없이,
include 태그를 통해 효율적으로 재사용할 수 있다.