본문 바로가기

개발 이야기/Android (안드로이드)

Android DataBinding과 ViewModel 적용하기

320x100

DataBinding이란?

DataBinding은 Android에서 제공하는 라이브러리로, XML 레이아웃 파일에서 UI 구성요소를 직접 코드에서 참조하지 않고도 데이터와 UI를 연결할 수 있는 기능을 제공합니다. 이를 통해 코드의 가독성을 높이고, 유지보수를 쉽게 할 수 있습니다.

 

DataBinding의 주요 장점

  1. 코드 간소화: findViewById() 호출을 제거.
  2. 양방향 데이터 바인딩: 데이터와 UI 간의 동기화를 쉽게 구현.
  3. 타입 안전성: 컴파일 타임에 레이아웃 요소와 바인딩이 검증.
  4. MVVM 패턴 지원: ViewModel과의 결합이 자연스러움.

ViewModel이란?

ViewModel은 Android Architecture Components 중 하나로, UI 관련 데이터를 저장하고 관리하는 데 사용됩니다. ViewModel은 수명 주기(ACTIVITY, FRAGMENT 등)에 독립적이며, 화면 회전과 같은 구성 변경에도 데이터를 유지합니다.

ViewModel의 주요 특징

  1. 수명 주기 인식: 구성 변경에도 데이터 유지.
  2. 데이터 캡슐화: UI와 데이터 간의 명확한 경계 제공.
  3. MVVM 패턴 지원: View와 데이터를 효과적으로 연결.

DataBinding과 ViewModel을 함께 사용하기

1. 프로젝트에 DataBinding 및 ViewModel 추가

build.gradle(Module) 파일에서 다음 의존성을 추가합니다:

android {
    ...
    buildFeatures {
        dataBinding true
    }
}

dependencies {
    implementation "androidx.lifecycle:lifecycle-viewmodel-ktx:2.6.1"
    implementation "androidx.lifecycle:lifecycle-livedata-ktx:2.6.1"
}

 

2. 간단한 예제: MVVM 패턴 구현

 

2.1. XML 레이아웃 파일 작성

<!-- res/layout/activity_main.xml -->
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <data>
        <!-- ViewModel 객체를 바인딩 -->
        <variable
            name="viewModel"
            type="com.example.app.MainViewModel" />
    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:padding="16dp">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Enter text"
            android:text="@={viewModel.inputText}" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{viewModel.inputText}" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="@{() -> viewModel.onButtonClick()}"
            android:text="Click Me" />

    </LinearLayout>
</layout>

 

 

2.2. ViewModel 클래스 작성

// MainViewModel.java
package com.example.app;

import androidx.lifecycle.LiveData;
import androidx.lifecycle.MutableLiveData;
import androidx.lifecycle.ViewModel;

public class MainViewModel extends ViewModel {

    // 입력 텍스트를 저장하는 LiveData
    public MutableLiveData<String> inputText = new MutableLiveData<>("");

    private MutableLiveData<String> _message = new MutableLiveData<>("Hello, World!");
    public LiveData<String> message = _message;

    // 버튼 클릭 이벤트 처리
    public void onButtonClick() {
        _message.setValue("Button clicked! Text: " + inputText.getValue());
    }
}

 

 

2.3. Activity에서 DataBinding 및 ViewModel 연결

// MainActivity.java
package com.example.app;

import android.os.Bundle;
import androidx.activity.ComponentActivity;
import androidx.databinding.DataBindingUtil;
import androidx.lifecycle.ViewModelProvider;
import com.example.app.databinding.ActivityMainBinding;

public class MainActivity extends ComponentActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // DataBinding 설정
        ActivityMainBinding binding = DataBindingUtil.setContentView(this, R.layout.activity_main);

        // ViewModel 설정
        MainViewModel viewModel = new ViewModelProvider(this).get(MainViewModel.class);

        // ViewModel과 DataBinding 연결
        binding.setViewModel(viewModel);
        binding.setLifecycleOwner(this);
    }
}

실행 결과

  1. EditText에 입력한 텍스트가 TextView에 실시간으로 반영됩니다.
  2. 버튼 클릭 시 ViewModel의 onButtonClick() 메서드가 호출되어 메시지가 변경됩니다.
반응형