[Android Studio] RecyclerView와 Adapter를 사용해 리스트를 화면에 표시하기

📝RecyclerView와 Adapter를 사용해 리스트를 화면에 표시하기

RecyclerView는 여러개의 데이터를 목록으로 처리할때 사용한다

 

우선 하나의 행에 대한 화면개발을 먼저 한다 (파일명 contact_row, element LinearLayout로 파일 생성해줬다)

 

전화번호 목록을 만들거라서 아래 이미지처럼 화면을 구성해줬다

 

화면을 구성한 다음 에스큐엘라이트로 데이터베이스를 만들어 연락처를 저장할 수 있게 만들어주고

(https://coding-jisu.tistory.com/258)

java 앱파일에 adapter 패키지를 만들어 ContactAdapter 클래스를 만들어 아래 코드를 입력해줬다

 

순서
1. 클래스는 RecyclerView.Adapter를 상속받는다
2. 상속받은 클래스가 abstract이므로 unimplemented method 오버라이드한다
3. 클래스 안에 ViewHolder 클래스를 만들고 (이 클래스는 row.xml 화면에 있는 뷰를 연결시키는 클래스다)
RecyclerView.ViewHolder를 상속 받는다
4. ViewHolder 클래스에서 생성자를 만들고 생성자에서 뷰를 연결시키는 코드를 작성하고 클릭 이벤트도 작성한다
5. 어댑터 클래스의 멤버변수와 생성자를 만들어준다
6. RecyclerView.Adapter의 데이터 타입을 적어준다 (만든 ViewHolder를 <>안에 적는다)
7. 다른 함수(onCreateViewHolder, onBindViewHolder)에 에러가 뜨면 만든 ViewHolder로 바꿔준다
8. 오버라이드 함수 3개를 전부 구현해준다

 

// 1. RecyclerView.Adapter를 상속받는다

// 2. 상속받은 클래스가 abstract이므로 unimplemented method 오버라이드한다

// 6. RecyclerView.Adapter의 데이터 타입을 적어준다 (만든 ViewHolder를 <>안에 적는다)

// 7. 함수에 빨간색 에러가 뜨면 만든 ViewHolder로 바꿔준다 (onCreateViewHolder, onBindViewHolder)
public class ContactAdapter extends RecyclerView.Adapter<ContactAdapter.ViewHolder> {

    // 5. 어댑터 클래스의 멤버변수와 생성자를 만들어준다
    Context context;
    List<Contact> contactList;

    public ContactAdapter(Context context, List<Contact> contactList) {
        this.context = context;
        this.contactList = contactList;
    }

    // 8. 오버라이드 함수 3개를 전부 구현해주면 끝
    @NonNull
    @Override
    public ContactAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        // xml파일을 연결하는 작업(파일명(contact_row)과 클래스명(ContactAdapter)만 바꿔서 사용하면 된다)
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.contact_row, parent, false);
        return new ContactAdapter.ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ContactAdapter.ViewHolder holder, int position) {
        // 뷰에 데이터를 셋팅한다
        Contact contact = contactList.get(position);
        holder.txtName.setText(contact.name);
        holder.txtPhone.setText(contact.phone);
    }

    @Override
    public int getItemCount() {
        // 전체 데이터의 갯수를 적어준다
        return contactList.size();
    }
    // 3. 클래스 안에 ViewHolder 클래스를 만든다 (이 클래스는 row.xml 화면에 있는 뷰를 연결시키는 클래스다)
    // RecyclerView.ViewHolder를 상속 받는다

    // 4. 생성자를 만들고 생성자에서 뷰를 연결시키는 코드를 작성하고 클릭 이벤트도 작성한다
    public class ViewHolder extends RecyclerView.ViewHolder {

        TextView txtName;
        TextView txtPhone;
        ImageView imgDelete;

        public ViewHolder(@NonNull View itemView) {
            super(itemView);

            txtName = itemView.findViewById(R.id.txtName);
            txtPhone = itemView.findViewById(R.id.txtPhone);
            imgDelete = itemView.findViewById(R.id.imgDelete);
            
            // 카드뷰를 클릭했을때의 이벤트
            cardView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    // 인텐트에 유저가 어떤 행을 눌렀는지 파악하여 누른 정보를 담아서 넘긴다
                    int index = getAdapterPosition();
                    Contact contact = contactList.get(index);

                    // 수정 액티비티를 띄운다
                    Intent intent = new Intent(context, EditActivity.class);
                    intent.putExtra("contact", contact);
                    context.startActivity(intent);
        }
    }
}

 

위 코드를 작성하고 리사이클러뷰를 구현할 메인 액티비티로 돌아와 화면에 연결하고 표시해주는 코드를 작성

public class MainActivity extends AppCompatActivity {

    Button btnAdd;

    // 리사이클러뷰 사용할때 RecyclerView, Adapter, ArrayList를 쌍으로 적기
    RecyclerView recyclerView;
    ContactAdapter adapter;
    ArrayList<Contact> contactList;

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

        // 화면 연결
        btnAdd = findViewById(R.id.btnAdd);
        // 리사이클러뷰를 화면에 연결하고 쌍으로 같이 다니는 코드도 작성해준다
        recyclerView = findViewById(R.id.recyclerView);
        recyclerView.setHasFixedSize(true);
        recyclerView.setLayoutManager(new LinearLayoutManager(MainActivity.this));

        // 버튼 셋팅
        btnAdd.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent intent = new Intent(MainActivity.this, AddActivity.class);
                startActivity(intent);
            }
        });

        // DB에서 데이터를 가져와서 리사이클러뷰에 표시하기
        DatabaseHandler db = new DatabaseHandler(MainActivity.this);
        contactList = db.getAllContacts();
        db.close();

        // 어댑터 만들기
        adapter = new ContactAdapter(MainActivity.this, contactList);
        // 어댑터를 리사이클러뷰에 셋팅
        recyclerView.setAdapter(adapter);
    }
}

 

결과 ↓