Saya tahu bahwa RecyclerView
telah menggantikan fungsi tua ListView
dan GridView
. Saya mencari sebuah contoh yang sangat dasar yang menunjukkan minimal grid setup menggunakan RecyclerView
. Saya tidak mencari panjang tutorial gaya penjelasan, hanya sedikit contoh. Saya membayangkan sederhana grid yang meniru tua GridView akan terdiri dari beberapa fitur berikut:
Bagi mereka yang sudah akrab dengan pengaturan RecyclerView
untuk membuat daftar, kabar baiknya adalah bahwa membuat grid adalah sebagian besar sama. Anda hanya menggunakan GridLayoutManager
bukan LinearLayoutManager
ketika anda mengatur RecyclerView
up.
recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
Jika anda membutuhkan bantuan lebih dari itu, maka simak contoh berikut.
Berikut adalah sedikit contoh yang akan terlihat seperti gambar di bawah ini.
Mulai dengan kosong kegiatan. Anda akan melakukan tugas-tugas berikut untuk menambah RecyclerView
grid. Semua yang perlu anda lakukan adalah copy dan paste kode di setiap bagian. Kemudian anda dapat menyesuaikannya sesuai dengan kebutuhan anda.
Pastikan berikut dependensi dalam aplikasi anda gradle.membangun
file:
compile 'com.android.support:appcompat-v7:27.1.1'
compile 'com.android.support:recyclerview-v7:27.1.1'
Anda dapat memperbarui nomor versi untuk apa pun yang terkini.
Tambahkan RecyclerView
untuk xml layout.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/rvNumbers"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
Setiap sel dalam RecyclerView
grid hanya akan memiliki satu TextView
. Membuat layout baru resource file.
recyclerview_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:padding="5dp"
android:layout_width="50dp"
android:layout_height="50dp">
<TextView
android:id="@+id/info_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="@color/colorAccent"/>
</LinearLayout>
The RecyclerView
membutuhkan sebuah adaptor untuk mengisi dilihat di masing-masing cell dengan data anda. Buat sebuah file java.
MyRecyclerViewAdapter.java
public class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.ViewHolder> {
private String[] mData;
private LayoutInflater mInflater;
private ItemClickListener mClickListener;
// data is passed into the constructor
MyRecyclerViewAdapter(Context context, String[] data) {
this.mInflater = LayoutInflater.from(context);
this.mData = data;
}
// inflates the cell layout from xml when needed
@Override
@NonNull
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = mInflater.inflate(R.layout.recyclerview_item, parent, false);
return new ViewHolder(view);
}
// binds the data to the TextView in each cell
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
holder.myTextView.setText(mData[position]);
}
// total number of cells
@Override
public int getItemCount() {
return mData.length;
}
// stores and recycles views as they are scrolled off screen
public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
TextView myTextView;
ViewHolder(View itemView) {
super(itemView);
myTextView = itemView.findViewById(R.id.info_text);
itemView.setOnClickListener(this);
}
@Override
public void onClick(View view) {
if (mClickListener != null) mClickListener.onItemClick(view, getAdapterPosition());
}
}
// convenience method for getting data at click position
String getItem(int id) {
return mData[id];
}
// allows clicks events to be caught
void setClickListener(ItemClickListener itemClickListener) {
this.mClickListener = itemClickListener;
}
// parent activity will implement this method to respond to click events
public interface ItemClickListener {
void onItemClick(View view, int position);
}
}
Catatan
GridView
dan merupakan kebutuhan umum. Anda dapat menghapus kode ini jika anda don't membutuhkannya.Tambahkan kode berikut untuk aktivitas utama anda.
MainActivity.java
public class MainActivity extends AppCompatActivity implements MyRecyclerViewAdapter.ItemClickListener {
MyRecyclerViewAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// data to populate the RecyclerView with
String[] data = {"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"};
// set up the RecyclerView
RecyclerView recyclerView = findViewById(R.id.rvNumbers);
int numberOfColumns = 6;
recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
adapter = new MyRecyclerViewAdapter(this, data);
adapter.setClickListener(this);
recyclerView.setAdapter(adapter);
}
@Override
public void onItemClick(View view, int position) {
Log.i("TAG", "You clicked number " + adapter.getItem(position) + ", which is at cell position " + position);
}
}
Catatan
ItemClickListener
yang kita definisikan di adaptor. Hal ini memungkinkan kita untuk menangani sel klik acara di onItemClick
.Yang's ini. Anda harus mampu untuk menjalankan proyek anda sekarang dan mendapatkan sesuatu yang mirip dengan gambar di atas.
Sudut-sudut membulat
Auto-pas kolom
Meskipun saya suka dan menghargai Suragch's jawaban, saya ingin meninggalkan catatan karena saya menemukan bahwa coding Adaptor (MyRecyclerViewAdapter
) untuk menentukan dan mengekspos Pendengar metode onItemClick
isn't cara terbaik untuk melakukannya, karena tidak menggunakan kelas enkapsulasi dengan benar. Jadi saran saya adalah untuk membiarkan Adaptor menangani Mendengarkan operasi semata-mata (yang's tujuan-nya!) dan memisahkan mereka dari Aktivitas yang menggunakan Adaptor ** (MainActivity
). Jadi, ini adalah bagaimana saya akan membuat class Adapter:
MyRecyclerViewAdapter.java
public class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.ViewHolder> {
private String[] mData = new String[0];
private LayoutInflater mInflater;
// Data is passed into the constructor
public MyRecyclerViewAdapter(Context context, String[] data) {
this.mInflater = LayoutInflater.from(context);
this.mData = data;
}
// Inflates the cell layout from xml when needed
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = mInflater.inflate(R.layout.recyclerview_item, parent, false);
ViewHolder viewHolder = new ViewHolder(view);
return viewHolder;
}
// Binds the data to the textview in each cell
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
String animal = mData[position];
holder.myTextView.setText(animal);
}
// Total number of cells
@Override
public int getItemCount() {
return mData.length;
}
// Stores and recycles views as they are scrolled off screen
public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
public TextView myTextView;
public ViewHolder(View itemView) {
super(itemView);
myTextView = (TextView) itemView.findViewById(R.id.info_text);
itemView.setOnClickListener(this);
}
@Override
public void onClick(View view) {
onItemClick(view, getAdapterPosition());
}
}
// Convenience method for getting data at click position
public String getItem(int id) {
return mData[id];
}
// Method that executes your code for the action received
public void onItemClick(View view, int position) {
Log.i("TAG", "You clicked number " + getItem(position).toString() + ", which is at cell position " + position);
}
}
Harap dicatat onItemClick
metode yang sekarang didefinisikan dalam MyRecyclerViewAdapter
itu adalah tempat di mana anda ingin kode anda tugas untuk kegiatan/tindakan yang diterima.
Hanya ada perubahan kecil yang harus dilakukan dalam rangka untuk menyelesaikan transformasi: Kegiatan doesn't perlu menerapkan MyRecyclerViewAdapter.ItemClickListener
lagi, karena sekarang yang dilakukan sepenuhnya oleh Adaptor. Hal ini kemudian akan menjadi akhir modifikasi:
MainActivity.java
public class MainActivity extends AppCompatActivity {
MyRecyclerViewAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// data to populate the RecyclerView with
String[] data = {"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"};
// set up the RecyclerView
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.rvNumbers);
int numberOfColumns = 6;
recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
adapter = new MyRecyclerViewAdapter(this, data);
adapter.setClickListener(this);
recyclerView.setAdapter(adapter);
}
}
Yo Harus Mengatur recyclerview layoutmanager untuk Gridlayout Mode , Untuk Melakukan hal Ini Hanya mengubah kode anda ketika anda Ingin Mengatur RecyclerView LayoutManager :
Catatan : mengganti Jumlah Kolom Yang anda inginkan dengan ###MEMBANTU###
recyclerView.setLayoutManager(baru GridLayoutManager(getActivity(),###MEMBANTU###));