이 튜토리얼에서는 안드로이드 앱에서 가로 방향으로 스크롤되는 리스트 뷰(ListView)를 구현하는 방법을 단계별로 알아봅니다. 최신 안드로이드 개발에서는 기존의 ListView 대신 RecyclerView에 LinearLayoutManager의 가로(HORIZONTAL) 방향 옵션을 적용하는 것이 표준적인 접근 방식입니다.
1단계 – 새 프로젝트 생성
Android Studio를 실행한 후 File → New Project 메뉴로 이동하여, 프로젝트 생성에 필요한 정보를 모두 입력하고 새 프로젝트를 만듭니다.
2단계 – activity_main.xml 작성
res/layout/activity_main.xml 파일에 다음 코드를 추가합니다.
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="https://schemas.android.com/apk/res/android" android:id="@+id/rlMain" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="16dp" android:orientation="vertical"> <androidx.recyclerview.widget.RecyclerView android:id="@+id/recyclerView" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout>
3단계 – MainActivity.java 작성
src/MainActivity.java 파일에 다음 코드를 추가합니다. 핵심은 mLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL) 부분으로, 이 한 줄이 세로 리스트를 가로 스크롤 리스트로 바꿔줍니다.
package app.com.sample;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.DefaultItemAnimator;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private List<MovieModel> movieList = new ArrayList<>();
private MoviesAdapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RecyclerView recyclerView = findViewById(R.id.recyclerView);
mAdapter = new MoviesAdapter(movieList);
LinearLayoutManager mLayoutManager = new LinearLayoutManager(getApplicationContext());
mLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
recyclerView.setLayoutManager(mLayoutManager);
recyclerView.setItemAnimator(new DefaultItemAnimator());
recyclerView.setAdapter(mAdapter);
prepareMovieData();
}
private void prepareMovieData() {
MovieModel movie = new MovieModel("Mad Max: Fury Road", "Action & Adventure", "2015");
movieList.add(movie);
movie = new MovieModel("Inside Out", "Animation, Kids & Family", "2015");
movieList.add(movie);
movie = new MovieModel("Star Wars: Episode VII - The Force Awakens", "Action", "2015");
movieList.add(movie);
movie = new MovieModel("Shaun the Sheep", "Animation", "2015");
movieList.add(movie);
movie = new MovieModel("The Martian", "Science Fiction & Fantasy", "2015");
movieList.add(movie);
movie = new MovieModel("Mission: Impossible Rogue Nation", "Action", "2015");
movieList.add(movie);
movie = new MovieModel("Up", "Animation", "2009");
movieList.add(movie);
movie = new MovieModel("Star Trek", "Science Fiction", "2009");
movieList.add(movie);
movie = new MovieModel("The LEGO MovieModel", "Animation", "2014");
movieList.add(movie);
movie = new MovieModel("Iron Man", "Action & Adventure", "2008");
movieList.add(movie);
movie = new MovieModel("Aliens", "Science Fiction", "1986");
movieList.add(movie);
movie = new MovieModel("Chicken Run", "Animation", "2000");
movieList.add(movie);
movie = new MovieModel("Back to the Future", "Science Fiction", "1985");
movieList.add(movie);
movie = new MovieModel("Raiders of the Lost Ark", "Action & Adventure", "1981");
movieList.add(movie);
movie = new MovieModel("Goldfinger", "Action & Adventure", "1965");
movieList.add(movie);
movie = new MovieModel("Guardians of the Galaxy", "Science Fiction & Fantasy", "2014");
movieList.add(movie);
mAdapter.notifyDataSetChanged();
}
}4단계 – MovieModel.java 작성
리스트에 표시할 영화 데이터를 담기 위한 모델 클래스입니다. src/MovieModel.java 파일에 다음 코드를 추가합니다.
package app.com.sample;
public class MovieModel {
private String title, genre, year;
public MovieModel() {
}
public MovieModel(String title, String genre, String year) {
this.title = title;
this.genre = genre;
this.year = year;
}
public String getTitle() {
return title;
}
public void setTitle(String name) {
this.title = name;
}
public String getYear() {
return year;
}
public void setYear(String year) {
this.year = year;
}
public String getGenre() {
return genre;
}
public void setGenre(String genre) {
this.genre = genre;
}
}5단계 – movies_list.xml 작성
리스트의 각 항목 카드 레이아웃입니다. res/layout/movies_list.xml 파일에 다음 코드를 추가합니다.
<?xml version="1.0" encoding="utf-8"?> <androidx.cardview.widget.CardView xmlns:android="https://schemas.android.com/apk/res/android" android:layout_width="250dp" android:layout_height="100dp" android:layout_margin="8dp"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:padding="8dp"> <TextView android:id="@+id/title" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentStart="true" android:layout_toStartOf="@+id/year" android:textColor="#222222" android:textSize="16sp" android:textStyle="bold" /> <TextView android:id="@+id/year" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentEnd="true" android:textColor="#999999" /> <TextView android:id="@+id/genre" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" /> </RelativeLayout> </androidx.cardview.widget.CardView>
6단계 – MoviesAdapter.java 작성
RecyclerView에 영화 목록을 연결하는 어댑터 클래스입니다. src/MoviesAdapter.java 파일에 다음 코드를 추가합니다.
package app.com.sample;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import java.util.List;
public class MoviesAdapter extends RecyclerView.Adapter<MoviesAdapter.MyViewHolder> {
private List<MovieModel> moviesList;
class MyViewHolder extends RecyclerView.ViewHolder {
TextView title, year, genre;
MyViewHolder(View view) {
super(view);
title = view.findViewById(R.id.title);
genre = view.findViewById(R.id.genre);
year = view.findViewById(R.id.year);
}
}
public MoviesAdapter(List<MovieModel> moviesList) {
this.moviesList = moviesList;
}
@NonNull
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext())
.inflate(R.layout.movie_list, parent, false);
return new MyViewHolder(itemView);
}
@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
MovieModel movie = moviesList.get(position);
holder.title.setText(movie.getTitle());
holder.genre.setText(movie.getGenre());
holder.year.setText(movie.getYear());
}
@Override
public int getItemCount() {
return moviesList.size();
}
}7단계 – AndroidManifest.xml 확인
마지막으로 androidManifest.xml 파일에 다음과 같이 메인 액티비티가 등록되어 있는지 확인합니다.
<?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 Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤, 상단 툴바의 Run 
아이콘을 클릭하세요. 실행할 기기 목록에서 본인의 모바일 기기를 선택하면, 연결된 휴대폰 화면에 아래와 같이 가로로 스크롤되는 영화 목록이 표시됩니다.
