꿈꾸는 시스템 디자이너

레이아웃 인플레이션(Layout Inflation)의 이해 본문

Development/Android

레이아웃 인플레이션(Layout Inflation)의 이해

독행소년 2013. 5. 14. 11:49

일반적으로 하나의 Activity에 하나의 Layout을 적용하여 사용한다.

하지만 필요에 따라 한 Activity에 여러개의 Layout을 적용할 필요가 있을 때 Layout Inflation 기법을 이용한다.


- 여러 Activity에서 중복 사용할 Layout이 필요할 때

- Activity 실행 도중 동적으로 Layout을 추가/삭제할 필요가 있을 때


<activity_main.xml>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Inflate Layout"
            android:textAppearance="?android:attr/textAppearanceMedium" />

        <Button
            android:id="@+id/mainButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="onClick"
            android:text="Inflate" />
    </LinearLayout>

    <!-- Inflation할 레이아웃 영역 -->
    <LinearLayout
        android:id="@+id/inflatedLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >
    </LinearLayout>

</LinearLayout>

위의 레이아웃에서는 텍스트뷰와 버튼을 하나의 리니어레이아웃으로 구성하고 그 아래  inflatedLayout이라는 id를 가지는 별도의 레이아웃을 추가하였다(33줄 ~ 39줄). 이 영역이  향후 새로운 레이아웃이 추가될 영역이다.

* 29행은 동적으로 사용자가 버튼을 눌렀을때 레이아웃이 추가되도록 하기 위해  추가한 이벤트이다.


<Inflated_layout.xml>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Large Text"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

</LinearLayout>

위의 레이아웃은 inflatedLayout에 들어갈 레이아웃을 굿어한 것이다. 하나의 텍스트뷰와 하나의 버튼이 구성되어 있는 것을 확인할 수 있다.


<MainActivity.java>

package com.example.inflatetest;

import android.os.Bundle;
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;

public class MainActivity extends Activity {

	boolean visible = false;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		// activity_main.xml에서 정의한 LinearLayout 객체 할당 		
		LinearLayout inflatedLayout = (LinearLayout)findViewById(R.id.inflatedLayout);
		// LayoutInflater 객체 생성
		LayoutInflater inflater =  (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		// Inflated_Layout.xml로 구성한 레이아웃을 inflatedLayout 영역으로 확장
		inflater.inflate(R.layout.lnflated_layout, inflatedLayout);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}
	
	/*
	activity_main.xml에서 정의한 버튼을 클릭할 때 동적으로 확장되도록 할 수도 있음. 
	public void onClick(View v){
		
		if(visible == false)
		{
			LinearLayout inflatedLayout = (LinearLayout)findViewById(R.id.inflatedLayout);
			
			LayoutInflater inflater =  (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
			inflater.inflate(R.layout.lnflated_layout, inflatedLayout);
			
			visible = true;
		}
	}
	*/
}

위의 자바코드를 살펴보면, 19행에서 메인 레이아웃을 화면에 출력한 후, 메인 레이아웃 내에 정의한 inflatedLayout의 객체를 생성한다. 그리고 LayoutInflater의 객체를 생한 후 inflate 메모드를 호출하여 R.layout.Inflated_layout영역에 inflatedLayout을 추가한다.

또한 30행부터와 같이 버튼을 클릭했을 때 레이아웃이 추가되도록 할 수 도 있다.


Comments