Computer >> 컴퓨터 >  >> 프로그래밍 >> Android

안드로이드 ListView·RecyclerView 뷰 재활용 메커니즘, 단계별 예제로 완벽 이해하기

이 튜토리얼에서는 안드로이드에서 ListView(그리고 현대적인 대체재인 RecyclerView)의 뷰 재활용 메커니즘이 실제로 어떻게 동작하는지 단계별 예제를 통해 살펴봅니다.

뷰 재활용 메커니즘이란 무엇인가?

리스트에 수십, 수백 개의 항목이 있을 때 화면에 보이는 항목마다 뷰를 매번 새로 생성하면 불필요한 메모리 낭비와 심각한 스크롤 성능 저하가 발생합니다. 안드로이드는 화면에서 벗어난 뷰를 버리지 않고 재사용(reuse)하는 방식으로 이 문제를 해결합니다.

RecyclerView는 이 원리를 더욱 발전시킨 컴포넌트로, ViewHolder 패턴과 결합하여 동작합니다. onCreateViewHolder()는 새로운 뷰홀더가 필요할 때 최초 한 번만 호출되며, 이후 스크롤 시에는 이미 생성된 뷰홀더가 재활용되어 onBindViewHolder()에서 새로운 데이터만 다시 바인딩됩니다. 덕분에 레이아웃 인플레이션과 findViewById 비용이 크게 줄어들어 부드러운 스크롤이 가능해집니다.

예제 프로젝트 만들기

1단계 − Android Studio에서 새 프로젝트 생성

Android Studio를 실행하고 File ⇒ New Project를 선택한 뒤, 필요한 정보를 모두 입력하여 새 프로젝트를 생성합니다.

2단계 − res/layout/activity_main.xml 작성

메인 레이아웃 파일에 아래 코드를 추가합니다. 여기서는 RecyclerView를 사용합니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/card_recycler_view"
        android:scrollbars="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</LinearLayout>

3단계 − res/layout/card_row.xml 작성

리스트의 각 행(row)에 사용될 카드뷰 레이아웃입니다. TextView 하나로 구성된 간단한 구조입니다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
    xmlns:android="https://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/card"
    android:layout_marginTop="5dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp">
    <TextView
        android:id="@+id/tv_country"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:layout_gravity="center"
        android:textSize="18sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textStyle="bold" />
</androidx.cardview.widget.CardView>

4단계 − src/MainActivity.java 작성

메인 액티비티에서는 RecyclerView 초기화, 도시 목록 데이터 준비, 그리고 GestureDetector를 활용한 항목 클릭 이벤트 처리를 수행합니다.

package com.app.sample;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
    private ArrayList cities;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initViews();
    }
    private void initViews(){
        RecyclerView recyclerView = (RecyclerView)findViewById(R.id.card_recycler_view);
        recyclerView.setHasFixedSize(true);
        RecyclerView.LayoutManager layoutManager = new LinearLayoutManager(getApplicationContext());
        recyclerView.setLayoutManager(layoutManager);
        cities = new ArrayList<>();
        cities.add("Mumbai");
        cities.add("Chennai");
        cities.add("Kochin");
        cities.add("Bangalore");
        cities.add("Hyderabad");
        cities.add("Amaravati");
        cities.add("Goa");
        cities.add("Trivandram");
        cities.add("Coimbatore");
        cities.add("Vellore");
        cities.add("Salem");
        cities.add("Bhubaneswar");
        cities.add("");
        cities.add("Cuttack");
        cities.add("Mysore");
        RecyclerView.Adapter adapter = new DataAdapter(cities);
        recyclerView.setAdapter(adapter);
        recyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {
            GestureDetector gestureDetector = new GestureDetector(getApplicationContext(), new GestureDetector.SimpleOnGestureListener(){
                @Override public boolean onSingleTapUp(MotionEvent e) {
                    return true;
                }
            });
            @Override
            public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e) {
                View child = rv.findChildViewUnder(e.getX(), e.getY());
                if(child != null && gestureDetector.onTouchEvent(e)) {
                    int position = rv.getChildAdapterPosition(child);
                    Toast.makeText(getApplicationContext(), (Integer) cities.get(position), Toast.LENGTH_SHORT).show();
                }
                return false;
            }
            @Override
            public void onTouchEvent(RecyclerView rv, MotionEvent e) {
            }
            @Override
            public void onRequestDisallowInterceptTouchEvent(boolean disallowIntercept) {
            }
        });
    }
}

5단계 − src/DataAdapter.java 작성

어댑터 클래스가 바로 재활용 메커니즘의 핵심입니다. onCreateViewHolder()에서 뷰를 인플레이트하여 ViewHolder를 생성하고, onBindViewHolder()에서 재활용된 뷰홀더에 위치(position)에 맞는 데이터를 설정합니다.

package com.app.sample;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import androidx.recyclerview.widget.RecyclerView;
import java.util.ArrayList;
public class DataAdapter extends RecyclerView.Adapter<DataAdapter.ViewHolder>{
        private ArrayList<String> cities;
        public DataAdapter(ArrayList<String> countries) {
            this.cities = countries;
        }
        @Override
        public DataAdapter.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
            View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.card_row, viewGroup, false);
            return new ViewHolder(view);
        }
        @Override
        public void onBindViewHolder(DataAdapter.ViewHolder viewHolder, int i) {
            viewHolder.tv_country.setText(cities.get(i));
        }
        @Override
        public int getItemCount() {
            return cities.size();
        }
        public class ViewHolder extends RecyclerView.ViewHolder{
        private TextView tv_country;
        public ViewHolder(View view) {
            super(view);
            tv_country = (TextView)view.findViewById(R.id.tv_country);
        }
    }
}

6단계 − Manifests/AndroidManifest.xml 확인

매니페스트 파일에 MainActivity가 정상적으로 등록되어 있는지 확인합니다.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="com.app.sample">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

앱 실행 및 결과 확인

이제 애플리케이션을 실행해 보겠습니다. 실제 안드로이드 기기가 컴퓨터에 연결되어 있다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤 툴바의 Run 아이콘을 클릭하세요. 실행 옵션에서 자신의 모바일 기기를 선택하면, 기기 화면에 아래와 같이 도시 목록이 카드 형태로 표시됩니다. 목록을 빠르게 스크롤해도 끊김이 없다면, 그것이 바로 뷰 재활용 메커니즘이 정상적으로 동작하고 있다는 증거입니다.

안드로이드 ListView·RecyclerView 뷰 재활용 메커니즘, 단계별 예제로 완벽 이해하기