안드로이드 리사이클러뷰(RecyclerView) 정리.

안드로이드 리사이클러뷰 예제.

기본 사이트.

https://developer.android.com/training/material/lists-cards.html?hl=ko#Dependencies

RecyclerView 위젯 리스트뷰 보다 향상된 위젯.

수평 스크롤, 수직스크롤 및 그리드 레이아웃과  커스텀 레이아웃 매니저를 사용하면 다양한 가능구성이 가능하다.

레이아웃 매니저의 종류는

LinearLayoutManager, GridLayoutManager, StaggeredGridLayoutManager, 커스텀레이아웃매니저 등 다양하다.

LinearLayoutManager 은 수직, 수평으로 레이아웃 구성이 가능하다.

수평구조.

LinearLayoutManager layoutManager = new LinearLayoutManager(this);

layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);

recyclerView.setLayoutManager(layoutManager);

or

LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);

//맨뒤에 변수는 정방향으로 할지 역방향으로 할지의 매개변수이다. false 일때 이동방향이 ->  , true 일때 이동방향이  <-

recyclerView.setLayoutManager(layoutManager);

수직구조.

LinearLayoutManager layoutManager = new LinearLayoutManager(this);

layoutManager.setOrientation(LinearLayoutManager.VERTICAL);

recyclerView.setLayoutManager(layoutManager);

or

LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);

//맨뒤에 변수는 정방향으로 할지 역방향으로 할지의 매개변수이다.   false  이동방향이  위에서 아래로, true 일때 맨아래에서 위로

recyclerView.setLayoutManager(layoutManager);

//격자 모양의 레이아웃을 그린다.. 보여지는 셀 이 큰이미지의 사이즈 높이 혹은 넗이는 고정된다..

GridLayoutManager layoutManager = new GridLayoutManager(this, 2);

recyclerView.setLayoutManager(layoutManager);

// 가변적 격자모양의 레이아웃을 그린다. 보여줄수있는 세로 셀 갯수를 정하고 수평 모드로 스크롤 된다. 높이는 작은 사이즈의 이미지에 맞추어 그려진다.???

StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.HORIZONTAL);

recyclerView.setLayoutManager(layoutManager);

// 가변적 격자모양의 레이아웃을 그린다. 보여줄수있는 가로 셀 갯수를 정하고 수직 모드로 스크롤 된다. 넓이는 작은 사이즈의 이미지에 맞추어 그려진다.???

StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);

recyclerView.setLayoutManager(layoutManager);

레이아웃을 그리기 위한 준비가 되었다면 리사이클러뷰 아답터 및 뷰 홀더를 만들어야 한다.

우선 할일은 아이템 뷰를 만드는 것이다.

res->layout 폴더에 item_layout.xml 만들고 보여줄 위젯들을 등록한다.

item_layout.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="wrap_content"

    android:layout_height="wrap_content"

    tools:context="com.example.jojaeyeong_pc.test_layout.MainActivity">

    <ImageView

        android:id="@+id/imageView"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        />

</LinearLayout>

그런 다음 리사이클러뷰아답터 클래스를 만들어야 한다.

커스텀리사이클러뷰아답터 클래스를 생성하고 리사이클러아답터를 상속 받는다.

리사이클러아답터를 상속받으며 뷰 홀더를 정의 해주어야 한다.

public class CustomRecyclerViewAdapter extends RecyclerView.Adapter<CustomRecyclerViewAdapter.ViewHolder> {

    // 각 데이터 항목에 대한 뷰에 대한 참조를 제공합니다.

    // 복잡한 데이터 항목은 항목 당 둘 이상의보기가 필요할 수 있습니다.

    // 뷰 홀더에서 데이터 항목에 대한 모든 뷰에 대한 액세스 권한을 제공합니다.

    public static class ViewHolder extends RecyclerView.ViewHolder {

// findViewById 를 적게호출하기위한 방법.

//레이아웃 지정.

        ImageView imageView;

        // public ViewHolder(View itemView, ImageView imageView) {

        //     super(itemView);

        //     this.imageView = imageView;

        // }

        public ViewHolder(View itemView) {

            super(itemView);

            //위젯 등록

            //복잡한 레이아웃일수록 위젯의 갯수가 많아진다.

            imageView = (ImageView) itemView.findViewById(R.id.imageView);

        }

    }

//액티비티에서 받을 데이터를 정의합니다.

    ArrayList<ViewItem> mViewItems;

//아답터 기본 생성자.

    public CustomRecyclerViewAdapter(){

    

    }

//아답터 생성자. 어래이리스트를 받고 데이터를 초기화.

    public CustomRecyclerViewAdapter(ArrayList<ViewItem> mViewItems) {

        this.mViewItems = mViewItems;

    }

// BEGIN_INCLUDE(recyclerViewOnCreateViewHolder)

    // Create new views (invoked by the layout manager)

// BEGIN_INCLUDE (recyclerViewOnCreateViewHolder)

    // 새로운 뷰를 생성합니다 (레이아웃 관리자에 의해 호출 됨).

    @Override

    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

//레이아웃 인플레이터를 이용하여 뷰를 재생성함.

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.adapter_recycler_view, parent, false);

        //홀더에 뷰를 등록 하여 사용.

        ViewHolder holder = new ViewHolder(view);

        return holder;

    }

// BEGIN_INCLUDE (recyclerViewOnBindViewHolder)

    // 뷰 내용을 바꿉니다 (레이아웃 관리자에 의해 호출 됨)

    @Override

    public void onBindViewHolder(ViewHolder holder, int position) {

    

        // Get element from your dataset at this position and replace the contents of the view with that element 

        //이 위치에서 데이터 집합의 요소를 가져 와서 뷰의 내용을 해당 요소로 바꿉니다.

    //뷰가 등록된 홀더의 내용을 어레이리스트에 등록된 데이터로 변경 혹은 교체를 한다.

        holder.imageView.setBackgroundResource(mViewItems.get(position).getImage());

    }

// Return the size of your dataset (invoked by the layout manager)

// (레이아웃 관리자에 의해 호출 된) 데이터 세트의 크기를 반환합니다.

    @Override

    public int getItemCount() {

        return mViewItems.size();

    }

//해당 메서드는 상속받은 것이 아니며 새로운 데이터를 가져와 리스트뷰를 갱신할 수 있다.

public void setData(ArrayList<ViewItem> mViewItems) {

        this.mViewItems = mViewItems;

        notifyDataSetChanged();

    }

}

이제 필요한 준비는 액티비티에 데이터를 등록하고 리사이클뷰 및 레이아웃 매니저를 통하여 화면에 보여주면 된다.

최초 프로젝트를 만들때 생성된 MainActivity.java와 activity_main.xml, 데이터클래스를 만들어 준다. 

ViewItem.java 클래스를 만들고 해당 클래스에는 이미지 리소스만 담도록 했다.

복잡한 레이아웃을 구성하기위한 자료가 더 많이 있다면 여기에 데이터를 담고

커스텀리사이클뷰아답터에서  onBindViewHolder(ViewHolder viewHolder, final int position) 메서드에서

필요한 데이터를 넣어 화면 구성을 하면 된다.

ViewItem.java

public class ViewItem {

//이미지 리소스 경로 (R.drawable.이미지이름)

    private int image;

//데이터를 등록할때 생성자를 이용하여 해당 이미지를 바로 등록한다.

    public ViewItem(int image) {

        this.image = image;

    }

// onBindViewHolder() 메서드에서 사용하게될 getter 함수.

    public int getImage() {

        return image;

    }

}

MainActivity.java

public class MainActivity extends AppCompatActivity {

/**데이터를 담을 어레이리스트 변수 선언*/

private ArrayList<ViewItem> mViewItems;

/**리사이클러뷰 변수선언*/

private RecyclerView recyclerView;

/**커스텀 리사이클러뷰 아답터 변수 선언*/

CustomRecyclerViewAdapter adapter;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

//어레이리스트 초기화 초기화 안하여 앱 실행이 안되는 경우가 있다.

//초기화를 안하면 만들어진 어레이리스트를 대입하면 된다.

        mViewItems = new ArrayList<>();

// 데이터 입력.

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        mViewItems.add(new ViewItem(R.drawable.ic_launcher));

        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

        adapter = new CustomRecyclerViewAdapter(mViewItems);

//레이아웃 매니저 수평

        LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);

        //레이아웃 매니저 수직

        // LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);

//or 

// 수평 또는 수직으로의 레이아웃 정렬방식을 메서드로 지정..

        // LinearLayoutManager layoutManager = new LinearLayoutManager(this);

        // layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);

        // layoutManager.setOrientation(LinearLayoutManager.VERTICAL);

// 그리드뷰 레이아웃 매니저 (context: , spancount: 한줄에 보여줄 그리드 개수)

        // GridLayoutManager layoutManager = new GridLayoutManager(this, 2);

// 지그재그가 가능한 그리드뷰 레이아웃 매니저 (spancount: 한줄에 보여줄 그리드 개수, 수평 또는 수직 정렬방식 지정.)

        // StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.HORIZONTAL);

        //StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);

//리사이클러뷰에 어떻게 보여줄지 레이아웃 매니저를 등록.

        recyclerView.setLayoutManager(layoutManager);

        // use this setting to improve performance if you know that changes

        // in content do not change the layout size of the RecyclerView        

        

        // 변경 사항을 알고있는 경우이 설정을 사용하여 성능을 향상 시키십시오.

        // 콘텐츠에서 RecyclerView의 레이아웃 크기를 변경하지 않습니다.

// 동일한 레이아웃이 구성된다면 해당 매서드를 true 시켜준다.

        recyclerView.setHasFixedSize(true);

        

        //리사이클러뷰에 아답터를 등록.

        recyclerView.setAdapter(adapter);

        

    }

}

activity_main.xml

레이아웃 xml 엔 리사이클러뷰 위젯 하나만 등록되어 있다.

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.ConstraintLayout 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.example.jojaeyeong_pc.test_layout.MainActivity">

    <android.support.v7.widget.RecyclerView

        android:id="@+id/recyclerView"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        />

</android.support.constraint.ConstraintLayout>