RecyclerView.zip


0. Result





1. Create the RecyclerView in the Layout



app/build.gradle

1
2
3
dependencies {
    compile 'com.android.support:recyclerview-v7:25.0.1'
}
cs

RecyclerView의 dependency 추가한다.

RecyclerView는 Android Support Library에 들어있다.



activity_main.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?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"
    tools:context="com.tistory.qlyh8.recyclerview.MainActivity">
 
    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v7.widget.RecyclerView>
 
</LinearLayout>
cs




2. Create Layout for Individual Items


main_list_item.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?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:orientation="vertical">
 
    <TextView
        android:id="@+id/main_data"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="22sp"
        android:padding="16dp"/>
 
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#dadada"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp" />
 
</LinearLayout>
cs




3. Create a ViewHolder and Adapter


RecyclerViewAdapter.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
package com.tistory.qlyh8.recyclerview;
 
/*
 * Created by YUNHEE on 2017-12-30.
 */
 
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
 
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.RecyclerViewAdapterViewHolder>{
 
    // 리스트에 표시할 아이템 수
    private int mNumberItems;
    private final RecyclerViewAdapterOnClickHandler mClickHandler;
 
    public RecyclerViewAdapter(int numberOfItems, RecyclerViewAdapterOnClickHandler clickHandler) {
        mNumberItems = numberOfItems;
        mClickHandler = clickHandler;
    }
 
    //onClick 메시지를 받는 인터페이스
    public interface RecyclerViewAdapterOnClickHandler {
        void onClick(String text);
    }
 
    public class RecyclerViewAdapterViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener{
 
        public final TextView mainTextView;
 
        public RecyclerViewAdapterViewHolder(View view) {
            super(view);
            mainTextView = view.findViewById(R.id.main_data);
            view.setOnClickListener(this);
        }
 
        /**
         * 클릭하는 동안 하위 뷰에서 호출된다.
         * @param v: 클릭된 뷰
         */
        @Override
        public void onClick(View v) {
            mClickHandler.onClick(String.valueOf(getAdapterPosition()));
        }
    }
 
    /**
     * 새로운 ViewHolder가 새로 생성될 때마다 호출된다.
     * 이것은 RecyclerView가 배치될 때 발생한다.
     * 화면을 채우고 스크롤 할 수 있도록 충분한 ViewHolder들이 만들어진다.
     * @param viewGroup: 이 ViewHolder들이 포함되는 ViewGroup
     * @param viewType: RecyclerView에 둘 이상의 아이템 type이 있는 경우
     * return : 각 리스트 아이템의 뷰를 보유하는 새로운 RecyclerViewAdapterViewHolder
     */
    @Override
    public RecyclerViewAdapterViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
        LayoutInflater inflater = LayoutInflater.from(viewGroup.getContext());
        View view = inflater.inflate(R.layout.main_list_item, viewGroup, false);
 
        return new RecyclerViewAdapterViewHolder(view);
    }
 
    /**
     * 지정된 위치에 데이터를 표시하기 위해 RecyclerView에 의해 호출된다.
     * ViewHolder의 내용을 전달된 "position"인수를 사용하여 특정 위치의 정보를 갱신한다.
     * @param holder: 데이터 셋의 지정된 위치에서 아이템의 내용을 나타내기 위해 갱신해야 하는 ViewHolder
     * @param position: 어댑터의 데이터 셋 내의 아이템의 위치
     */
    @Override
    public void onBindViewHolder(RecyclerViewAdapterViewHolder holder, int position) {
        holder.mainTextView.setText(String.valueOf(position));
    }
 
    /**
     * 표시 할 아이템 수를 반환한다.
     * 이것은 배경과 애니메이션의 레이아웃을 돕기 위해 뒤에서 사용된다.
     * @return : 사용 가능한 아이템 수
     */
    @Override
    public int getItemCount() {return mNumberItems;}
}
 
cs




4. Wire the RecyclerView up with the Adapter and the LinearLayoutManager


MainActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
package com.tistory.qlyh8.recyclerview;
 
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.widget.Toast;
 
public class MainActivity extends AppCompatActivity implements RecyclerViewAdapter.RecyclerViewAdapterOnClickHandler {
 
    private static final int NUM_LIST_ITEMS = 20;
    private RecyclerView mRecyclerView;
    private RecyclerViewAdapter mRecyclerViewAdapter;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        mRecyclerView = findViewById(R.id.recyclerview_main);
 
        // LinearLayoutManager는 HORIZONTAL 또는 VERTICAL 방향을 지원한다.
        // 역방향 레이아웃 매개 변수는 주로 오른쪽에서 왼쪽 언어에 대해 반전되어야하는 HORIZONTAL 레이아웃에 유용하다.
        LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);
        layoutManager.setReverseLayout(false);
 
        mRecyclerView.setLayoutManager(layoutManager);
        // 리스트 안의 각 아이템은 같은 크기를 가짐
        mRecyclerView.setHasFixedSize(true);
 
        // 데이터를 표시하는 뷰와 연결
        mRecyclerViewAdapter = new RecyclerViewAdapter(NUM_LIST_ITEMS, this);
        mRecyclerView.setAdapter(mRecyclerViewAdapter);
    }
 
    /**
     * RecyclerView 아이템 클릭을 처리하기 위해 MainActivity 클래스에서 재정의된다.
     * @param text: 클릭한 뷰의 데이터
     */
    @Override
    public void onClick(String text) {
        Toast.makeText(this, text, Toast.LENGTH_SHORT).show();
    }
}
 
cs



Android Course of Udacity - Lesson 3

Add the RecyclerView adapter




3가지 오버라이드 함수


onCreateViewHolder ()

RecyclerView를 ViewHolder로 인스턴스화한다.

ViewHolder를 생성하고 뷰를 붙인다.


onBindViewHolder ()

RecyclerView가 데이터 소스에서 가져온 정보를 뷰에 넣는다.

재활용 되는 뷰가 호출하여 실행한다.

ViewHolder를 전달하고 Adapter는 position의 데이터를 결합한다.


getItemCount ()

데이터 소스의 아이템 개수를 반환한다.



   

이용과정


1)

RecyclerView가 Adapter에게 얼마나 많은 아이템을 출력해야 하는지 물어본다.

여러 번 물어 볼 수 있기 때문에 짧은 시간 안에 그 개수를 반환해주는 것이 중요하다.

   

2)

RecyclerView가 Adapter에게 ViewHolder를 만들라고 명령한다.

이 과정에서 각 아이템의 뷰들은 onCreateViewHolder를 호출해서 XML과 연결한다.


3)

OnCreateViewHolder 함수는 아이템 뷰를 XML과 연결시켜 하나의 뷰를 만들어내고

새로운 뷰를 가지는 ViewHolder 객체를 반환한다.

 

4) 

각각의 ViewHolder가 만들어지면

RecyclerView는 각 아이템에 정보를 넣기 위해 onBindViewHolder를 호출한다.

 

      

스크롤할 때 마다 RecyclerView는 Adapter를 통해

ViewHolder에 새로운 데이터를 넣어서 그 ViewHolder를 재사용하게 된다.




Add the Layout Manager




3가지 LayoutManager을 지원한다.

  


LinearLayoutManager

아이템들이 수직, 수평방향으로 스크롤한다.

디폴트는 수직 스크롤이다.

 


GridLayoutManager

LinearLayoutManager의 서브 클래스이다.

아이템들이 있는 격자가 수평이나 수직으로 스크롤한다.

 


StaggeredGridLayoutManager

격자의 간격을 결정한다.

다양한 차원을 가지는 내용을 보여줄 때 사용한다.


Android Course of Udacity - Lesson 3

How RecyclerView Works



1. RecyclerView는 아이템들을 생성해서 재사용을 위해 큐나 Recycling bin에 넣어둔다.

2. 스크롤 시 RecyclerView는 전에 생성된 아이템들 중 하나를 건네준다.

3. 작성한 코드는 이 아이템에 새 내용을 채우게 된다.

4. 스크롤을 통해 지나간 아이템은 재사용을 위해 다시 큐로 돌아간다.




Using RecyclerView

RecyclerView, Adapter, ViewHolder, Layout Manager, Data Source



RecyclerView

모듈화 되어 있다.

새로운 뷰를 추가하기 위해 Adapter를 가지고 있다.



Adapter

데이터를 가져와서 뷰에 적용시킨다.

RecyclerView에게 ViewHolder를 전달한다.



ViewHolder

각각의 아이템이 화면에 어떻게 나타내는지 결정한다.

RecyclerView에 대한 모든 서브 뷰를 보유한다.

실제 아이템의 레퍼런스를 가지고 있다.

뷰에 새로운 데이터를 넣어 업데이트할 때 캐시로 사용할 수 있다.



Layout Manager

RecyclerView에게 수평,수직, 애니메이션 등으로 뷰를 어떻게 보여줄 지 말해준다.



Data Source

RecyclerView는 Data Source를 기반으로 하기 때문에 아이템들을 관리하기 쉽다.


Android Course of Udacity - Lesson 3

+ Recent posts