본문 바로가기
android

RecyclerView 기본 사용

by 윈 Win 2021. 1. 7.
728x90

블로그 이사했습니다!

 

👇 블로그 이전 공지 👇

블로그 이전 안내 (tistory.com)

 

 

👇 새 블로그에서 글 보기 👇

[Android] RecyclerView 사용법 — Win Record (tistory.com)

 

[Android] RecyclerView 사용법

⚠️ 2021.01.07에 작성된 글입니다 ⚠️ 리사이클러뷰란? 정의 안드로이드 앱에서 다량의 데이터를 스크롤로 표시하기 위해 사용하는 위젯 앱에서 대량의 데이터 세트 또는 자주 변경되는 데이터

win-record.tistory.com

 

 


 

 

구성요소

recyclerview를 구현하기 위해서는 크게 세가지가 필요.

  • item layout : 눈에 보이는 아이템의 디자인(xml)
  • adapter : 아이템 레이아웃에 아이템 데이터를 넣어주는 역할
  • data : 아이템을 구성하는 데이터. java의 경우 class로 만드는 경우 多

 

아이템에 반영할 데이터(type OR class)

데이터를 담는 리스트(보통 ArrayList)

리스트 각 아이템의 디자인인 아이템 틀(xml)

틀에 원하는 대로 데이터를 넣기 위한 ViewHolder

이 모든 작업(리스트의 아이템을 틀에 넣어 보여주기)을 하는 adapter

리스트를 어떤 방식으로 보여줄지 정하는 layoutManager

 

 

 

- ViewHolder

adapter 안에 위치.

findViewById 메소드 처럼 xml과 데이터를 연결함.

 

- LayoutInflater

ViewHolder 안에 위치. 말 그대로 레이아웃을 팽창, 부풀리는 것.

한 아이템이 고유의 값(eg. id value)을 가지게 해 선택, 삭제 등의 작업을 용이하게 할 수 있도록 아이템 틀을 객체화함.

 

 

 


사용법

recyclerview를 만들기 위한 흐름

  1. 액티비티 레이아웃 recyclerView 추가 (xml)
  2. 아이템의 레이아웃 만들기 (xml)
  3. 아이템의 데이터 클래스 만들기 (java/kotlin)
    더보기
    데이터를 넣을 변수 & 생성자 & getter,setter를 생성한다.

  4. recyclerView의 adapter 만들기 (java/kotlin)
    더보기
    Adapter를 상속받은 CustomAdapter를 생성한다.

    이때 반드시 생성되는 method가 있다.
    - onCreateViewHolder : layoutInflater로 xml을 객체화하는 작업. viewHolder를 생성해 return.
    - onBindViewHolder : xml 내 위젯과 데이터를 묶는 작업. 각 item position에 해당하는 data를 viewHolder의 item에 표시.
    - getItemCount : 전체 데이터의 개수 return.

    그 외 필요한 것들
    - ViewHolder에 대한 inner class : xml의 위젯 선언과 id값 연결하는 작업. 위젯에 대한 이벤트 또한 제어.
    - Adapter constructor(생성자)

  5. 액티비티에서 adapter와 layoutManager 연결하기(java/kotlin)

 

item class

public class Member {
    String name;
    int age;
    String job;

    public Member(String name, int age, String job) {
        this.name = name;
        this.age = age;
        this.job = job;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public String getJob() {
        return job;
    }

    public void setJob(String job) {
        this.job = job;
    }
}

 

 

 

adapter code

public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.CustomViewHolder> {
    ArrayList<Member> members;
    Context mContext;

    public class CustomViewHolder extends RecyclerView.ViewHolder {
        //        adapter의 viewHolder에 대한 inner class (setContent()와 비슷한 역할)
        //        itemView를 저장하는 custom viewHolder 생성
//        findViewById & 각종 event 작업
        TextView tvName, tvAge, tvJob;

        public CustomViewHolder(@NonNull View itemView) {
            super(itemView);
            tvName = itemView.findViewById(R.id.item_name);
            tvAge = itemView.findViewById(R.id.item_age);
            tvJob = itemView.findViewById(R.id.item_job);
        }
    }

    public CustomAdapter(ArrayList<Member> members) {
//        adapter constructor
        this.members = members;
    }

    public CustomAdapter(ArrayList<Member> members, Context mContext) {
//        adapter constructor for needing context part
        this.members = members;
        this.mContext = mContext;
    }

    @NonNull
    @Override
    public CustomViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
//        onCreateViewHolder: make xml as an object using LayoutInflater & create viewHolder with the object
//        layoutInflater로 xml객체화. viewHolder 생성.
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_rv, parent, false);
        return new CustomViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull CustomViewHolder holder, int position) {
//        onBindViewHolder: put data of item list into xml widgets
//        xml의 위젯과 데이터를 묶는(연결하는, setting하는) 작업.
//        position에 해당하는 data, viewHolder의 itemView에 표시함
        holder.tvName.setText(members.get(position).getName());
        holder.tvAge.setText(String.valueOf(members.get(position).getAge()));
        holder.tvJob.setText(members.get(position).getJob());
    }

    @Override
    public int getItemCount() {
//        getItemCount: return the size of the item list
//        item list의 전체 데이터 개수 return
        return (members != null ? members.size() : 0);
    }
}

 

line 48에 세번째 파라미터인 false를 하지 않으면 아래 에러가 떠서 빌드가 되지 않는다.

java.lang.IllegalStateException: ViewHolder views must not be attached when created. Ensure that you are not passing 'true' to theattachToRoot

 

 

activity code

RecyclerView recyclerView;
ArrayList<Member> members = new ArrayList<>();
CustomAdapter adapter = new CustomAdapter(members, this);

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_basic);
        
    members.add(new Member("Kim", 12, "student"));
    members.add(new Member("Jake", 20, "programmer"));
    members.add(new Member("Tom", 41, "baker"));
    members.add(new Member("Conan", 32, "teacher"));
    members.add(new Member("Chris", 26, "COO"));
    members.add(new Member("John", 43, "PD"));
    members.add(new Member("Kate", 56, "professor"));
    members.add(new Member("Shara", 30, "student"));
    members.add(new Member("Megan", 14, "soccer player"));
    members.add(new Member("Josh", 17, "student"));
        
    recyclerView = findViewById(R.id.recyclerview);
    recyclerView.setLayoutManager(new LinearLayoutManager(this));
    recyclerView.setAdapter(adapter);
}

 

recyclerView 결과

 


이전 글

RecyclerView란 (tistory.com)

다음 글

RecyclerView CRUD (tistory.com)

 

 

 


참고자료

RecyclerView로 목록 만들기  |  Android 개발자  |  Android Developers

안드로이드 리사이클러뷰 기본 사용법. (Android RecyclerView) :: 개발자를 위한 레시피 (tistory.com)

Android RecyclerView 간단한 예제 :: 멈춤보단 천천히라도 (tistory.com)

 

 

공부하며 정리한 글입니다. 내용에 대한 피드백은 언제나 환영입니다.

'android' 카테고리의 다른 글

디데이 계산기  (0) 2021.01.11
WebView 웹뷰  (0) 2021.01.10
RecyclerView CRUD  (0) 2021.01.07
RecyclerView란  (0) 2021.01.06
android jetpack  (0) 2021.01.06

댓글