[안드로이드 개인 공부] xml에서 include 와 merge

<include> 태그를 사용하면 레이아웃을 여러 파일로 나눌수가 있다. 그렇기 때문에 아주 긴 GUI를 구현하는데 도움을 준다.

 

activity_main.xml

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

    <!-- First include file -->
    <include layout="@layout/reuse_item1" />

    <!-- Second include file -->
    <include layout="@layout/reuse_item2" />

</LinearLayout>

현재 메인 엑티비티는 두개의 레이아웃을 include하고 있다. 각 아이템에 해당되는 xml을 모두 써주기에는 너무 복잡하기 때문에, 가독성을 높이기 위해 include를 통해서 레이아웃을 여러 파일로 나눠서 사용할 수 있다. 또한 같은 디자인이 반복될 경우 <include>를 통해서 구현이 가능하다.

 

reuse_item1.xml

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

    <TextView
        android:id="@+id/textView1"
        android:text="Second include"
        android:textAppearance="?android:attr/textAppearanceMedium"/>

    <TextView
        android:id="@+id/textView2"
        android:text="More text"
        android:textAppearance="?android:attr/textAppearanceMedium"/>

</LinearLayout>

reuse_item1은 두개의 텍스트 뷰를 가지고 있는 구조이다.

 

reuse_item2.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/reuse_container" 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <Button
        android:id="@+id/button1"
        android:text="btn1"
        android:textAppearance="?android:attr/textAppearanceMedium"/>

    <Button
        android:id="@+id/button2"
        android:text="btn2"
        android:textAppearance="?android:attr/textAppearanceMedium"/>

</LinearLayout>

reuse_item2는 두개의 버튼이 나란히 수평으로 이어져있는 구조이다.

 

<include>태그를 사용한 결과로 acitivity_main.xml의 렌더링의 모습은 아래와 같을 것이다.

 

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

    <!-- First include file -->
    <LinearLayout
    android:id="@+id/reuse_container" 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    	<TextView
        	android:id="@+id/textView1"
        	android:text="Second include"
        	android:textAppearance="?android:attr/textAppearanceMedium"/>
  	    <TextView
     	    android:id="@+id/textView2"
        	android:text="More text"
        	android:textAppearance="?android:attr/textAppearanceMedium"/>
	</LinearLayout>

    <!-- Second include file -->
    <LinearLayout
    	android:id="@+id/reuse_container" 
    	android:layout_width="match_parent"
    	android:layout_height="match_parent"
    	android:orientation="horizontal">

    	<Button
        	android:id="@+id/button1"
        	android:text="btn1"
        	android:textAppearance="?android:attr/textAppearanceMedium"/>

    	<Button
        	android:id="@+id/button2"
        	android:text="btn2"
        	android:textAppearance="?android:attr/textAppearanceMedium"/>
	</LinearLayout>
    
</LinearLayout>

이렇게  <include>를 통해 구현한 xml은 자바 코드에서 findViewById(R.id.textView1)을 통해서 위젯을 받아올 수 가 있다.

하지만  부득이하게 LinearLayout이 중복이 되고 있다. 어떻게 하면 reuse_item1과 reuse_item2를 acitivity_main에 끼워넣을 수 있을까?

 

바로 <merge>태그가 그런 역할을 해준다.

 

예를 들어서 위의 reuse_item1을 아래와 같이 바꿀 수 있다.

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

    <TextView
        android:id="@+id/textView1"
        android:text="Second include"
        android:textAppearance="?android:attr/textAppearanceMedium"/>

    <TextView
        android:id="@+id/textView2"
        android:text="More text"
        android:textAppearance="?android:attr/textAppearanceMedium"/>

</merge>

 

merge로 바꾼후 activity_main.xml의 랜더링 모습은 아래와 같다.

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

	<!-- first include file -->
   	<TextView
       	android:id="@+id/textView1"
       	android:text="Second include"
       	android:textAppearance="?android:attr/textAppearanceMedium"/>
    <TextView
   	    android:id="@+id/textView2"
       	android:text="More text"
       	android:textAppearance="?android:attr/textAppearanceMedium"/>
	
    <!-- Second include file -->
    <LinearLayout
    	android:id="@+id/reuse_container" 
    	android:layout_width="match_parent"
    	android:layout_height="match_parent"
    	android:orientation="horizontal">

    	<Button
        	android:id="@+id/button1"
        	android:text="btn1"
        	android:textAppearance="?android:attr/textAppearanceMedium"/>

    	<Button
        	android:id="@+id/button2"
        	android:text="btn2"
        	android:textAppearance="?android:attr/textAppearanceMedium"/>
	</LinearLayout>
    
</LinearLayout>

reuse_item2.xml은 horizontal 방향으로 그려주고 있기에, 중복이라고 할 수 없다. 그렇기에 그대로 두고 <include> 해주면 된다.

 

여기서 잠깐!!

<merge>에 가장 큰 문제점이 있다고 하는데, 그것은 <include>선언시 명시했던 id가 사라진다는 점이다. 따라서 <merge>를 xml은 중복 id가 발생할 수 있으니 한 곳에서 <include>하는 상황을 피해야 될것이다.