이 튜토리얼에서는 Android에서 RecyclerView를 사용하여 끝없는 목록(무한 스크롤, Infinite Scroll)을 구현하는 방법을 단계별로 알아봅니다.
무한 스크롤은 사용자가 목록의 맨 아래까지 도달하면 자동으로 다음 데이터를 로딩하는 기능입니다. SNS 피드나 뉴스 앱처럼 많은 데이터를 연속해서 보여줘야 하는 화면에서 필수적인 패턴입니다. 핵심 원리는 다음과 같습니다.
- 스크롤 리스너로 마지막 아이템이 화면에 보이는지 감지
- 마지막 아이템이 보이면 로딩 인디케이터(ProgressBar)를 추가
- 데이터 로딩이 완료되면 인디케이터를 제거하고 새 아이템을 삽입
그럼 본격적으로 구현 과정을 살펴보겠습니다.
1단계 – 프로젝트 생성 및 의존성 추가
Android Studio에서 File → New Project를 선택하고 필요한 정보를 모두 입력하여 새 프로젝트를 생성합니다.
그다음 build.gradle(Module: app) 파일에 아래 의존성을 추가합니다.
implementation 'com.android.support:cardview-v7:28.0.0' implementation 'com.android.support:recyclerview-v7:28.0.0'
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:tools="https://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>3단계 – MainActivity 구현
src/MainActivity.java에 다음 코드를 작성합니다. 이 클래스가 무한 스크롤의 핵심 로직을 담당합니다.
주요 포인트는 세 가지입니다.
- populateData(): 초기 데이터 10개를 생성합니다.
- initScrollListener(): 스크롤 이벤트를 감지하여 마지막 아이템이 완전히 보이면 loadMore()를 호출합니다.
- loadMore(): 리스트 끝에 null을 추가해 로딩 뷰를 표시하고, Handler의 postDelayed()로 2초 후 실제 데이터를 추가합니다.
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import android.os.Bundle;
import android.os.Handler;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
RecyclerView recyclerView;
RecyclerViewAdapter recyclerViewAdapter;
ArrayList<String> rowsArrayList = new ArrayList<>();
boolean isLoading = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
recyclerView = findViewById(R.id.recyclerView);
populateData();
initAdapter();
initScrollListener();
}
private void populateData() {
for (int i = 0; i < 10; i++) {
rowsArrayList.add("Number " + i);
}
}
private void initAdapter() {
recyclerViewAdapter = new RecyclerViewAdapter(rowsArrayList);
recyclerView.setLayoutManager(new LinearLayoutManager(getApplicationContext()));
recyclerView.setAdapter(recyclerViewAdapter);
}
private void initScrollListener() {
recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrollStateChanged(@NonNull RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
}
@Override
public void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
LinearLayoutManager linearLayoutManager = (LinearLayoutManager) recyclerView.getLayoutManager();
if (!isLoading) {
if (linearLayoutManager != null && linearLayoutManager.findLastCompletelyVisibleItemPosition() == rowsArrayList.size() - 1) {
//bottom of list!
loadMore();
isLoading = true;
}
}
}
});
}
private void loadMore() {
rowsArrayList.add(null);
recyclerViewAdapter.notifyItemInserted(rowsArrayList.size() - 1);
Handler handler = new Handler();
handler.postDelayed(new Runnable() {
@Override
public void run() {
rowsArrayList.remove(rowsArrayList.size() - 1);
int scrollPosition = rowsArrayList.size();
recyclerViewAdapter.notifyItemRemoved(scrollPosition);
int currentSize = scrollPosition;
int nextLimit = currentSize + 10;
while (currentSize - 1 < nextLimit) {
rowsArrayList.add("Number " + currentSize);
currentSize++;
}
recyclerViewAdapter.notifyDataSetChanged();
isLoading = false;
}
}, 2000);
}
}4단계 – 어댑터(Adapter) 구현
새 Java 클래스인 RecyclerViewAdapter.java를 만들고 아래 코드를 추가합니다.
이 어댑터의 핵심은 다중 뷰 타입(Multiple View Type) 처리입니다. 데이터가 null이면 로딩 뷰(VIEW_TYPE_LOADING), 값이 있으면 일반 아이템 뷰(VIEW_TYPE_ITEM)를 반환하여 두 가지 형태의 ViewHolder를 상황에 맞게 사용합니다.
package app.com.sample;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ProgressBar;
import android.widget.TextView;
import java.util.List;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private final int VIEW_TYPE_ITEM = 0;
private List<String> mItemList;
RecyclerViewAdapter(List<String> itemList) {
mItemList = itemList;
}
@NonNull
@Override
public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
if (viewType == VIEW_TYPE_ITEM) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_row, parent, false);
return new ItemViewHolder(view);
} else {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_loading, parent, false);
return new LoadingViewHolder(view);
}
}
@Override
public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, int position) {
if (viewHolder instanceof ItemViewHolder) {
populateItemRows((ItemViewHolder) viewHolder, position);
} else if (viewHolder instanceof LoadingViewHolder) {
showLoadingView((LoadingViewHolder) viewHolder, position);
}
}
@Override
public int getItemCount() {
return mItemList == null ? 0 : mItemList.size();
}
@Override
public int getItemViewType(int position) {
int VIEW_TYPE_LOADING = 1;
return mItemList.get(position) == null ? VIEW_TYPE_LOADING : VIEW_TYPE_ITEM;
}
private class ItemViewHolder extends RecyclerView.ViewHolder {
TextView tvItem;
ItemViewHolder(@NonNull View itemView) {
super(itemView);
tvItem = itemView.findViewById(R.id.textViewItem);
}
}
private class LoadingViewHolder extends RecyclerView.ViewHolder {
ProgressBar progressBar;
LoadingViewHolder(@NonNull View itemView) {
super(itemView);
progressBar = itemView.findViewById(R.id.progressBar);
}
}
private void showLoadingView(LoadingViewHolder viewHolder, int position) {
}
private void populateItemRows(ItemViewHolder viewHolder, int position) {
String item = mItemList.get(position);
viewHolder.tvItem.setText(item);
}
}5단계 – 아이템 레이아웃(item_row.xml) 작성
새 Layout 리소스 파일인 item_row.xml을 생성하고 다음 코드를 추가합니다. CardView 안에 TextView를 배치한 기본적인 리스트 아이템 구조입니다.
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="https://schemas.android.com/apk/res/android"
xmlns:app="https://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardElevation="2dp"
app:cardUseCompatPadding="true">
<TextView
android:id="@+id/textViewItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp" />
</androidx.cardview.widget.CardView>6단계 – 로딩 레이아웃(item_loading.xml) 작성
새 Layout 리소스 파일인 item_loading.xml을 생성하고 다음 코드를 추가합니다. 가운데 정렬된 ProgressBar가 들어있어 데이터를 불러오는 동안 사용자에게 로딩 중임을 알려줍니다.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:indeterminate="true"
android:paddingLeft="8dp"
android:paddingRight="8dp" />
</LinearLayout>7단계 – AndroidManifest.xml 확인
androidManifest.xml에 아래와 같이 MainActivity가 등록되어 있는지 확인합니다.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android" package="app.com.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 스마트폰을 컴퓨터에 연결했다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 열고 툴바의 Run 아이콘을 클릭하세요. 실행할 디바이스로 자신의 휴대폰을 선택하면, 모바일 기기에 아래와 같은 초기 화면이 표시됩니다.
목록을 맨 아래까지 스크롤하면 잠시 ProgressBar가 나타나고, 2초 후 새로운 아이템 10개가 자동으로 추가되는 것을 확인할 수 있습니다. 이것이 바로 RecyclerView를 활용한 무한 스크롤의 기본 구조입니다. 실제 프로젝트에서는 Handler 대신 Retrofit, OkHttp 같은 네트워크 라이브러리의 비동기 콜백 안에 동일한 로직을 적용하면 됩니다.