Membuat List Data dengan RecyclerView dan Activity Detail

• Create Project , dengan Empty Activity.

• Isi Name : My Distro , Package name : com.fahram.mydistro, dan Language : Java

• Buatlah 3 class dengan cara klik kanan pada package name, kemudian new, Kemudian pilih “Java Class”
  • Distro
  • DistroAdapter
  • DistroData
• Edit Class Distro Berikan attribute sesuai kebutuhan, pada project ini kita pakai 3 attribute : name, info, logo

public class Distro {
    private String name;
    private String info;
    private int logo;
}

• Siapkan contructor  dan getter , dengan cara klik kanan pada code Distro pilih generate, pilih Costructor kemudian pilih semua attribute. Ulangi klik kanan pada code Distro pilih generate, pilih Getter  kemudian pilih semua attribute. sehingga menjadi seperti berikut :

public class Distro {
    private String name;
    private String info;
    private int logo;

    public Distro(String name, String info, int logo) {
        this.name = name;
        this.info = info;
        this.logo = logo;
    }

    public String getName() {
        return name;
    }

    public String getInfo() {
        return info;
    }

    public int getLogo() {
        return logo;
    }
}

• Kemudian kita implementasi Parcelable pada class Distro

import android.os.Parcelable;

public class Distro implements Parcelable {

• Klik Pada lampu merah untuk mengimplementasikan method secara otomatis

• Klik Pada lampu merah lagi untuk mengimplemtasikan method secara otomatis

• Sehingga Class Distro Menjadi Seperti ini.

package com.fahram.mydistro;

import android.os.Parcel;
import android.os.Parcelable;

public class Distro implements Parcelable {
    private String name;
    private String info;
    private int logo;

    public Distro(String name, String info, int logo) {
        this.name = name;
        this.info = info;
        this.logo = logo;
    }

    protected Distro(Parcel in) {
        name = in.readString();
        info = in.readString();
        logo = in.readInt();
    }

    public static final Creator<Distro> CREATOR = new Creator<Distro>() {
        @Override
        public Distro createFromParcel(Parcel in) {
            return new Distro(in);
        }

        @Override
        public Distro[] newArray(int size) {
            return new Distro[size];
        }
    };

    public String getName() {
        return name;
    }

    public String getInfo() {
        return info;
    }

    public int getLogo() {
        return logo;
    }

    @Override
    public int describeContents() {
        return 0;
    }

    @Override
    public void writeToParcel(Parcel dest, int flags) {
        dest.writeString(name);
        dest.writeString(info);
        dest.writeInt(logo);
    }
}

• Siapkan data berupa text untuk name, info dan gambar untuk logo. Kemudian masukkan ke dalam class DistroData (Data yang saya gunakan dari DistroWatch.com), seperti di bawah ini :

package com.fahram.mydistro;

import java.util.ArrayList;
import java.util.List;

public class DistroData {
    private static String[] names = {
            "Manjaro Linux",
            "Linux Mint",
            "Pop!_OS",
    };
    private static String[] infos = {
            "Manjaro Linux is a fast, user-friendly, desktop-oriented operating system based on Arch Linux.",
            "Linux Mint is an Ubuntu-based distribution whose goal is to provide a classic desktop experience with many convenient",
            "Pop!_OS is an Ubuntu-based Linux distribution featuring a custom GNOME desktop. ",
    };
    private static int[] logos = {
            R.drawable.manjaro,
            R.drawable.mint,
            R.drawable.popos,
    };
    public static List<Distro> getDatas() {
        ArrayList<Distro> distros = new ArrayList<>();
        for (int i = 0; i < names.length; i++) {
            Distro distro = new Distro(names[i], infos[i], logos[i]);
            distros.add(distro);
        }
        return distros;
    }
}

• Pastikan kalian sudah menyalin gambar ke folder res -> drawable seperti ini :

• Sebelum lanjut ke Class DistroAdapter, kita harus siapkan layout untuk menampung data list. Klik kanan pada layout, kemudian pilih New, kemudian pilih Layout Resource File

• Isi File name dengan nama : item_distro Kemudian klik OK

• Buka tab Code pada layout item_distro.xml, edit menjadi seperti berikut

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 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:layout_marginLeft="16dp"
    android:layout_marginTop="8dp"
    android:layout_marginRight="16dp"
    android:layout_marginBottom="8dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/iv_logo"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_marginStart="8dp"
            android:layout_marginLeft="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:contentDescription="Distro Logo"
            android:src="@drawable/ic_launcher_background"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/tv_name"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginEnd="16dp"
            android:layout_marginRight="16dp"
            android:lines="2"
            android:text="Distro Name"
            android:textStyle="bold"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toEndOf="@+id/iv_logo"
            app:layout_constraintTop_toTopOf="@+id/iv_logo" />

        <TextView
            android:id="@+id/tv_info"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginTop="8dp"
            android:layout_marginEnd="16dp"
            android:layout_marginRight="16dp"
            android:lines="2"
            android:text="Distro Info"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@+id/iv_logo"
            app:layout_constraintTop_toBottomOf="@+id/tv_name" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>

• Kemudian edit file activity_main.xml. ganti TextView dengan RecyclerView

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_data"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

• Kembali ke class DistroAdapter kita tambahkan inner class ViewHolder dengan mengekstend class RecyclerView.ViewHolder

public class DistroAdapter {

    public class ViewHolder extends RecyclerView.ViewHolder {
        TextView tvName, tvInfo;
        ImageView ivLogo;
        public ViewHolder(@NonNull View itemView) {
            super(itemView);
            tvName = itemView.findViewById(R.id.tv_name);
            tvInfo = itemView.findViewById(R.id.tv_info);
            ivLogo = itemView.findViewById(R.id.iv_logo);
        }
    }
}

• Tambahkan attribute dan constructor

public class DistroAdapter {
    private ArrayList<Distro> distros ;

    public DistroAdapter(ArrayList<Distro> distros) {
        this.distros = distros;
    }
....

• Kemudian extend class DistroAdapter dengan RecyclerView.Adapter<DistroAdapter.ViewHolder>

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

• kemudian implementasikan semua method yang dibutuhkan

• Lengkapi ketiga method tersebut seperti berikut

    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_distro, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
        Distro distro = distros.get(position);
        holder.tvName.setText(distro.getInfo());
        holder.tvInfo.setText(distro.getInfo());
        holder.ivLogo.setImageResource(distro.getLogo());
    }

    @Override
    public int getItemCount() {
        return distros.size();
    }

• Kemudian kita lanjut pada class MainActivity.java Pada method onCreate kita daftarkan RecyclerView dan Adapter yang sudah kita buat, sehingga menjadi seperti berikut

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        RecyclerView recyclerView = findViewById(R.id.rv_data);
        recyclerView.setHasFixedSize(true);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        ArrayList<Distro> distros = new ArrayList<>();
        distros.addAll(DistroData.getDatas());
        DistroAdapter distroAdapter = new DistroAdapter(distros);
        recyclerView.setAdapter(distroAdapter);
    }

Sampai di sini kita sudah bisa menjalankan aplikasi List Data Distro,

untuk DetailActivity kita lanjutkan di materi berikutnya.