[Android] RecyclerView + CardView

RecyclerView + CardView 사용법입니다.

RecyclerView는 ListView 보다 더욱 향상되고 유연해진 View 입니다.

RecyclerView는 위와 같은 구조로 되어있습니다.

먼저 프로젝트를 생성해줍니다. 

Alt + Ctrl + Shift + s 를 누르게 되면 아래와 같이 Project Structure 화면이 뜹니다.

recyclerview 를 선택한 후 OK 버튼을 누릅니다.

마찬가지로 CardView도 추가해줍니다.

위와 같이 build.gradle 파일에 dependencies가 추가 됩니다. (CardView 추가된게 빠졌네요..)

프로젝트의 전체적인 구조는 MainActivity, RvAdapter, activity_main.xml, list_item.xml 입니다.

MainActivity.java 의 소스입니다.

package kr.co.recyclerviewdemo;

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.View;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends Activity {

   private RecyclerView rv;
   private LinearLayoutManager llm;
   private List<Integer> count;
   private int i = 0;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      rv = (RecyclerView) findViewById(R.id.main_rv);
      llm = new LinearLayoutManager(this);

      count = new ArrayList<>();

      rv.setHasFixedSize(true);
      rv.setLayoutManager(llm);
   }

   public void onClick(View view) {
      switch (view.getId()) {
         case R.id.main_btn_add : {
            i ++;
            count.add(i);
            RvAdapter adapter = new RvAdapter(getApplication(), count, i);
            rv.setAdapter(adapter);
            Log.d("Count", count + "");
            break;
         }
      }
   }
}

RecyclerView는 LayoutManager를 생성해야하며 아이템을 관리해줍니다.

RvAdapter.java 의 소스입니다.

package kr.co.recyclerviewdemo;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.List;

/**
 * Created by yongyi on 2017-11-27.
 */

public class RvAdapter extends RecyclerView.Adapter<RvAdapter.CustomViewHolder> {

   private Context context;
   private List<Integer> items;
   private int i;

   public RvAdapter(Context context, List<Integer> items, int i) {
      this.context = context;
      this.items = items;
      this.i = i;
   }

   @Override
   public CustomViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
      View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_item, parent, false);
      CustomViewHolder viewHolder = new CustomViewHolder(view);
      return viewHolder;
   }

   @Override
   public void onBindViewHolder(CustomViewHolder holder, int position) {
      final Integer item = items.get(position);
      holder.title.setText(item + "");
      holder.content.setText(item + "content");
   }

   @Override
   public int getItemCount() {
      return this.items.size();
   }

   public class CustomViewHolder extends RecyclerView.ViewHolder {
      TextView title;
      TextView content;
      public CustomViewHolder(View itemView) {
         super(itemView);
         title = itemView.findViewById(R.id.item_tv_title);
         content = itemView.findViewById(R.id.item_tv_content);
      }
   }

}

Adapter에서는 ViewHolder를 상속받는 CustomViewHolder를 내부적으로 만들고 그 외의 내용은 ListView와 큰 차이가 없습니다.

activity_main.xml 의 소스입니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
   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"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical"
   tools:context="kr.co.recyclerviewdemo.MainActivity">
   <Button
      android:id="@+id/main_btn_add"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:onClick="onClick"
      android:text="ADD"/>
   <android.support.v7.widget.RecyclerView
      android:id="@+id/main_rv"
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
   </android.support.v7.widget.RecyclerView>
</LinearLayout>

list_item.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="wrap_content"
   android:layout_margin="3dp"
   xmlns:app="http://schemas.android.com/apk/res-auto">
   <android.support.v7.widget.CardView
      android:id="@+id/item_cardview"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_margin="1dp"
      app:cardUseCompatPadding="true"
      app:cardElevation="5dp"
      app:cardCornerRadius="3dp">
      <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:padding="10dp"
         android:orientation="vertical">
         <TextView
            android:id="@+id/item_tv_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="25dp"
            android:textStyle="bold"
            android:text="title"/>
         <TextView
            android:id="@+id/item_tv_content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:text="content"/>
      </LinearLayout>
   </android.support.v7.widget.CardView>

</LinearLayout>

완성된 화면은 다음과 같습니다.

Kotlin으로 코딩한 RecyclerView + CardView << Click 바로가기