[안드로이드] RecyclerView 리사이클러뷰 예제

Android/공부

[안드로이드] RecyclerView 리사이클러뷰 예제

꾸끄꾸꾸 2020. 6. 30. 18:18

리사이클러뷰를 이용한 간단한 예제

1. 라이브러리 추가

recyclerview 라이브러리를 추가해준다.

2. xml

1. 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"
    tools:context=".MainActivity"
    android:orientation="vertical">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:id="@+id/btn_auto"
            android:onClick="onAutoInsert"
            android:text="자동추가"/>
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="onMenuInsert"
            android:id="@+id/btn_insert"
            android:text="메뉴입력"/>

    </LinearLayout>

</LinearLayout>

2. list_item.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="wrap_content"
    tools:context=".MainActivity"
    android:orientation="horizontal"
    android:background="@android:color/white"
    android:padding="8dp">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:layout_gravity="center_vertical">

        <TextView
            android:id="@+id/txt_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TITLE"
            android:textSize="25dp"
            android:textStyle="bold"
            android:textColor="@android:color/black"/>

        <TextView
            android:id="@+id/txt_content"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="content"
            android:textSize="15dp"
            android:textColor="@android:color/darker_gray"/>
    </LinearLayout>

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="90dp"
        android:layout_height="90dp"
        app:srcCompat="@mipmap/ic_launcher"
        android:scaleType="centerCrop"/>
</LinearLayout>

3. list_insert.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"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="4dp"

    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="90dp"
        android:orientation="horizontal">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_weight="1">

            <EditText
                android:id="@+id/addTitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="TITLE"
                android:textSize="23dp"
                android:textColor="@android:color/black"
                android:textStyle="bold"/>

            <EditText
                android:id="@+id/addContent"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="content"
                android:textSize="15dp"
                android:textColor="@android:color/darker_gray"/>
        </LinearLayout>

        <ImageView
            android:id="@+id/addImage"
            android:layout_width="70dp"
            android:layout_height="70dp"
            android:scaleType="centerCrop"
            app:srcCompat="@mipmap/ic_launcher"
            android:layout_gravity="center"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:padding="3dp">

        <Button
            android:id="@+id/btn_go"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="입력" />

        <Button
            android:id="@+id/btn_cancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="취소" />
    </LinearLayout>
</LinearLayout>

3. java

1. MainActivity.java

package com.example.myrecyclerviewex;

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;

import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity implements MyRecyclerAdapter.MyRecyclerViewClickListener {


    ArrayList<ItemData> dataList = new ArrayList<>();
    MyRecyclerAdapter adapter = new MyRecyclerAdapter(dataList);
    static int i=0;
    int[] cat = {R.drawable.pic001, R.drawable.pic002, R.drawable.pic003,
            R.drawable.pic004, R.drawable.pic005, R.drawable.pic006,
            R.drawable.pic007, R.drawable.pic008, R.drawable.pic009,
            R.drawable.pic010};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        RecyclerView recyclerView = findViewById(R.id.recyclerView);
        RecyclerView.LayoutManager layoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(layoutManager);
        recyclerView.setAdapter(adapter);

        adapter.setOnClickListener(this);
    }

    //리스트 클릭 이벤트
    @Override
    public void onItemClicked(int position) {
        Toast.makeText(getApplicationContext(), ""+(position+1), Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onItemLongClicked(int position) {
        adapter.remove(position);
        Toast.makeText(getApplicationContext(),"리스트 삭제", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onTitleClicked(int position) {
        Toast.makeText(getApplicationContext(),dataList.get(position).getTitle(), Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onContentClicked(int position) {
        Toast.makeText(getApplicationContext(),dataList.get(position).getContent(), Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onImageViewClicked(int position) {
        Toast.makeText(getApplicationContext(), "Image", Toast.LENGTH_SHORT).show();
    }

    // 다이얼로그를 사용해 list_insert.xml과 연결
    public void onMenuInsert(View view) {

        final View innerView = getLayoutInflater().inflate(R.layout.list_insert, null);
        final Dialog mDialog = new Dialog(this);
        mDialog.setTitle("Title");
        mDialog.setContentView(innerView);
        mDialog.setCancelable(true);

        WindowManager.LayoutParams params = mDialog.getWindow().getAttributes();
        params.width = WindowManager.LayoutParams.MATCH_PARENT;
        params.height = WindowManager.LayoutParams.WRAP_CONTENT;
        mDialog.getWindow().setAttributes((android.view.WindowManager.LayoutParams) params);

        final EditText editTitle = mDialog.findViewById(R.id.addTitle);
        final EditText editCont = mDialog.findViewById(R.id.addContent);
        Button btn_go = mDialog.findViewById(R.id.btn_go);
        Button btn_cancel = mDialog.findViewById(R.id.btn_cancel);

        //입력버튼을 누르면 실행되는 이벤트
        btn_go.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String myTitle = editTitle.getText().toString();
                String myCont = editCont.getText().toString();

                dataList.add(new ItemData(cat[i], myTitle, myCont));
                Toast.makeText(getApplicationContext(), myTitle, Toast.LENGTH_SHORT).show();
                mDialog.dismiss();
            }
        });
        
        //취소를 누르면 다이얼로그 종료
        btn_cancel.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mDialog.dismiss();
            }
        });
        
        mDialog.show();
        adapter.notifyDataSetChanged();
    }

    //자동추가 버튼 클릭시 리스트가 자동으로 추가되도록 하는 이벤트
    public void onAutoInsert(View view) {
        for (int i=0; i<10; i++) {
            dataList.add(new ItemData(cat[i], "TITLE : "+(i+1),
                    String.format("리사이클러뷰 %02d", (i+1))));
        }
        adapter.notifyDataSetChanged();
    }
}

2. MyRecyclerAdapter.java

package com.example.myrecyclerviewex;

import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.OvalShape;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextClock;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;

import java.util.ArrayList;

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

    public interface MyRecyclerViewClickListener {
        void onItemClicked(int position);
        void onItemLongClicked(int position);
        void onTitleClicked(int position);
        void onContentClicked(int position);
        void onImageViewClicked(int position);
    }
    private MyRecyclerViewClickListener mListener;

    public void setOnClickListener(MyRecyclerViewClickListener listener){
        this.mListener = listener;
    }

    private ArrayList<ItemData> itemData;
    public MyRecyclerAdapter(ArrayList<ItemData> itemData) {
        this.itemData = itemData;
    }
    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.list_item, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull final ViewHolder holder, int position) {
        ItemData item = itemData.get(position);
        holder.title.setText(item.getTitle());
        holder.content.setText(item.getContent());
        holder.imageView.setImageResource(item.getImage());

        if (mListener != null) {
            final int pos = position;
            holder.itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mListener.onItemClicked(pos);
                }
            });
            holder.title.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mListener.onTitleClicked(pos);
                }
            });
            holder.content.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mListener.onContentClicked(pos);
                }
            });
            holder.imageView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mListener.onImageViewClicked(pos);
                }
            });
            holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View v) {
                    mListener.onItemLongClicked(holder.getAdapterPosition());
                    return true;
                }
            });
        }
    }

    @Override
    public int getItemCount() {
        return itemData.size();
    }
    
    public class ViewHolder extends RecyclerView.ViewHolder {
        TextView title, content;
        ImageView imageView;
        public ViewHolder(@NonNull View itemView) {
            super(itemView);
            title = itemView.findViewById(R.id.txt_title);
            content = itemView.findViewById(R.id.txt_content);
            imageView = itemView.findViewById(R.id.imageView);

            imageView.setBackground(new ShapeDrawable(new OvalShape()));
            imageView.setClipToOutline(true);
        }
    }

    public void remove (int position){
        try {
            itemData.remove(position);
            notifyDataSetChanged();;
        } catch (IndexOutOfBoundsException e) {
            e.printStackTrace();
        }
    }
}

3. ItemData.java

package com.example.myrecyclerviewex;

public class ItemData {
    int image;
    String title;
    String content;

    public ItemData(int image, String title, String content) {
        this.image = image;
        this.title = title;
        this.content = content;
    }

    public int getImage() {
        return image;
    }

    public void setImage(int image) {
        this.image = image;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getContent() {
        return content;
    }

    public void setContent(String content) {
        this.content = content;
    }
}