RecyclerView’de MultiSelection (Çoklu Seçim) Kullanma

Arayüze sahip yazılımsal projelerde,  projenin  en az backend yazılımının iyi olması  kadar kullanıcısını doğru tanıyan, onların istek ve beklentileri öngörerek bunu kullanıcı arayüz ekranlarına doğru ve işlevsel bir tasarım olarak aktarmak da çok önemlidir.

Bu makalemde ise RecyclerView arayüz elemanına eklenen, listeme alanında bir ya da birden fazla  item’ı seçme imkanı sağlayan MultiSelect (çoklu seçim) özelliğini nasıl kullanabileceğimizi uygulayarak anlatacağım. 

Örneğimizi uyguladığımızda aşağıdaki gibi bir ekran görüntüsünü elde edeceğiz.

Dilerseniz, makaleyi inceledikten sonra örneğin tüm kodlarına sayfanın sonunda bulunan linkden ulaşabilirsiniz.

RecyclerView nedir?

Bu widget ,ListView in farklı bir versiyonudur. ListView arayüz elemanından daha esnek bir yapıya sahiptir.Ayrıca, hem horizontal (yatay) hem de vertical (dikey) olarak konumlanan bir layout yapısına sahiptir. ListView yapısından farklı olarak, RecyclerView, verilerin konumlanmasını yönetebilmek için, LayoutManager yapısına ihtiyaç duymaktadır.

Birkaç adımda RecyclerView widget’ın MultiSelect özelliğini uygulamamızda  nasıl kullanacağımızı görelim.

1-Gerekli Kütüphanelerin Eklenmesi

Android Studio Ide ile oluşturduğum projemin app dizinin altındaki build.gradle dosyasını açıyoruz. Dependencies kod bloklarının arasına aşağıdaki kodları yerleştirerek Android destek kütüphanesi ve RecyclerView widget kütüphanesini yüklüyoruz.

implementation 'com.android.support:recyclerview-v7:28.0.0'
implementation 'com.android.support:appcompat-v7:28.0.0'

2-Arayüz Kodlaması

Custom Listview kullanımında olduğu gibi, burada da 2 tane xml dosyasında kodlarımız bulunmalıdır.

İlk olarak, listelenecek item’larda gösterilecek arayüz elemanlarının yerleştirileceği xml dosyasını oluşturmalıyız.

item_row.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="#FFF"
android:clickable="true"
android:orientation="vertical">
<TextView
android:id="@+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:textColor="@color/black"
android:textSize="15dp"
tools:text="TextView" />
</LinearLayout>

Diğer xml dosyamıza da RecyclerView widget’ını yerleştirmemiz gerekmektedir.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="match_parent"
android:background="#EEE">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>

3-Java kodlama ile işlevsellik oluşturma

Listelenecek yazıların gösterilmesini ve list item’larının seçilip, seçilmediği durumlarını, diğer sınıflarda kullanmak adına Model adında bir sınıf oluşturdum.

public class Model {
private String text;
private boolean isSelected = false;
public Model(String text) {
this.text = text;
}
public String getText() {
return text;
}
public void setSelected(boolean selected) {
isSelected = selected;
}
public boolean isSelected() {
return isSelected;
}
}

RecyclerView yapısında Layout Manager ımız ile verilerimiz arasında köprü kuran Adapter sınıfı oluşturmamız gerekir.Nasıl bir ListView için custom adapter yaratıp istediğimiz verileri ListView mizde gösteriyorsak, RecyclerView yapısı içinde aynı mantıkla bir Adapter oluşturmamız gerekir. Benim oluşturduğum Adapter sınıfının ismi RecyclerViewAdapter’dır. Kodları aşağıda bulunmaktadır.

import android.graphics.Color;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import java.util.List;
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.MyViewHolder> {
private List<Model> mModelList;
public RecyclerViewAdapter(List<Model> modelList) {
mModelList = modelList;
}
//Listelenecek item’larda gösterilecek arayüz elemanlarının yerleştirileceği xml dosyasını tanımladık
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_row, parent, false);
return new MyViewHolder(view);
}
//Aşağıda MyViewHolder arayüz elemanlarını tanımlamıştık.Burda ise textView'e tıkladığında seçili hale gelmesini sağladık
@Override
public void onBindViewHolder(final MyViewHolder holder, int position) {
final Model model = mModelList.get(position);
holder.textView.setText(model.getText());
holder.view.setBackgroundColor(model.isSelected() ? Color.CYAN : Color.WHITE);
holder.textView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
model.setSelected(!model.isSelected());
holder.view.setBackgroundColor(model.isSelected() ? Color.CYAN : Color.WHITE);
}
});
}
@Override
public int getItemCount() {
return mModelList == null ? 0 : mModelList.size();
}
//Listelemede olacak arayüz elemanlarının tanımlanmasının yapılması
public class MyViewHolder extends RecyclerView.ViewHolder {
private View view;
private TextView textView;
private MyViewHolder(View itemView) {
super(itemView);
view = itemView;
textView = (TextView) itemView.findViewById(R.id.text_view);
}
}
}

Son olarak  ana sınıfımızda RecyclerView arayüz elemanını tanımlayıp,yukarıda yazdığım sınıfları da çağırmamız gerekir. Bu işlemleri de  MainActivity sınıfımızda yaptık.

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.*;
import java.util.*;
public class MainActivity extends AppCompatActivity {
private List<Model> mModelList;
private RecyclerView mRecyclerView;
private RecyclerView.Adapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Arayüz elemanlarının tanımlanması ve listelenecek verilerin RecyclerViewAdapter aktarılması
mRecyclerView = (RecyclerView) findViewById(R.id.recycler_view);
mAdapter = new RecyclerViewAdapter(getListData());
LinearLayoutManager manager = new LinearLayoutManager(MainActivity.this);
mRecyclerView.setHasFixedSize(true);
mRecyclerView.setLayoutManager(manager);
mRecyclerView.setAdapter(mAdapter);
}
//Listencek verilerin List sınıfı vasıtasıyla eklenmesi
private List<Model> getListData() {
mModelList = new ArrayList<>();
for (int i = 1; i <= 25; i++) {
mModelList.add(new Model("Yazı " + i));
}
return mModelList;
}
}

Son olarak ufak bir not: Bu yukarıda anlattığım projemin kodlarını indirmek isterseniz; yapmanız gereken tek şey aşağıya koyduğum KODLARI İNDİR resmine tıklamak.

download