Anda di halaman 1dari 4

OnClickListener pada Recyclerview

Modul ini merupakan kelanjutan dari modul Recyclerview.

OnClickListener pada salah satu elemen pada Recyclerview

1. Sebuah studi kasus diambil dari hasil modul Recyclerview sebelumnya. Pada tampilan
Recyclerview diatas, salah satu elemen, yaitu bagian gambarnya, dapat diclick dan akan
memberikan respon sesuai dengan yang diprogram. Dalam kasus ini, respon yang diberikan
adalah menghapus item dalam arraylist.
2. Inti dari aktifitas yang harus dilakukan adalah memberikan OnClickListener pada elemen
gambar tersebut.
3. OnClickListener pada sebuah recyclerview diberikan didalam adapter Recyclerview.
4. Dari Contoh di modul Recyclerview, adapter diberikan pada file “ExampleAdapter.java”.
5. Perhatikan Fungsi OnBindViewHolder
@Override
//i menunjukan index / posisi item dalam arraylist
public void onBindViewHolder(@NonNull ExampleViewHolder exampleViewHolder, int i) {
ExampleItem currentItem = mExampleList.get(i);

exampleViewHolder.mImageView.setImageResource(currentItem.getmImageResource());
exampleViewHolder.mTextView1.setText(currentItem.getmText1());
exampleViewHolder.mTextView2.setText(currentItem.getmText2());
}

Terdapat tiga variabel pada Recyclerview viewholder dimana mImageView merupakan


variabel yang digunakan untuk menampilkan gambar icon. OnClickListener akan diberikan
pada variable ini.
@Override
//i menunjukan index / posisi item dalam arraylist
public void onBindViewHolder(@NonNull ExampleViewHolder exampleViewHolder, int i) {
ExampleItem currentItem = mExampleList.get(i);

exampleViewHolder.mImageView.setImageResource(currentItem.getmImageResource());

exampleViewHolder.mImageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mExampleList.remove(i);
notifyItemRemoved(i);
notifyItemRangeChanged(i, getItemCount());

}
});

exampleViewHolder.mTextView1.setText(currentItem.getmText1());
exampleViewHolder.mTextView2.setText(currentItem.getmText2());
}

OnClickListener pada seluruh Recyclerview

1. Karena Onclick diletakan pada Recyclerviewnya, maka diperlukan id dari recyclerview


tersebut. Yang ditampilkan oleh Recyclerview pada modul ini adalah sebuah cardview,
sehingga sebuah id perlu diberikan pada layout cardview. Pada studi kasus modul file layout
cardview adalah my_item.xml
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/cv_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardCornerRadius="10dp">
Sebagai contoh, berikan cv_main sebagai id dari Cardview.

2. Buka file adapter “ExampleAdapter.java”. Perlu ditambahkan sebuah variabel baru yang
bertugas sebagai pointer dari sebuah Cardview pada Class Viewholder.
public static class ExampleViewHolder extends RecyclerView.ViewHolder{
public ImageView mImageView;
public TextView mTextView1;
public TextView mTextView2;
public CardView cvMain;

public ExampleViewHolder(@NonNull View itemView) {


super(itemView);
mImageView = itemView.findViewById(R.id.imageView);
mTextView1 = itemView.findViewById(R.id.textView);
mTextView2 = itemView.findViewById(R.id.textView2);
cvMain = itemView.findViewById(R.id.cv_main);
}
}

3. Studi kasus kali OnClickListener akan memberikan respon berpindah halaman, sehingga pada
OnClickListener akan menggunakan Intent method. Dihalaman (Activity) selanjutnya akan
ditampilkan text dari CardViewer. Tetap pada file adapter, tambahkan OnClickListener pada
Cardview pada method OnBindViewHolder
public void onBindViewHolder(@NonNull ExampleViewHolder exampleViewHolder, final
int i) {
final ExampleItem currentItem = mExampleList.get(i);

exampleViewHolder.mImageView.setImageResource(currentItem.getmImageResource());
exampleViewHolder.mImageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(v.getContext(), "Clicked : "+i,
Toast.LENGTH_SHORT).show();
}
});

exampleViewHolder.mTextView1.setText(currentItem.getmText1());
exampleViewHolder.mTextView2.setText(currentItem.getmText2());

exampleViewHolder.cvMain.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(v.getContext(),Second_Activity.class);
intent.putExtra("text1",currentItem.getmText1());
intent.putExtra("text2",currentItem.getmText2());
v.getContext().startActivity(intent);
}
});

4. Siapkan Activity kedua (pada contoh diatas adalah Second_Activity).

Second_Activity.java
package com.example.modul7_1;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;

import org.w3c.dom.Text;

public class Second_Activity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_second);
TextView t3 = (TextView)findViewById(R.id.textView3);
TextView t4 = (TextView)findViewById(R.id.textView4);

String text1 = getIntent().getExtras().getString("text1");


String text2 = getIntent().getExtras().getString("text2");
t3.setText(text1);
t4.setText(text2);
}
}
activity_second.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=".Second_Activity">

<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="152dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<TextView
android:id="@+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="88dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView3" />
</android.support.constraint.ConstraintLayout>

Anda mungkin juga menyukai