RecycleView Java Dengan Rest API – Setelah sebelumnya saya membagikan tutorial tentang RecycleView Kotlin Dengan Rest API, kali ini akan sedikit berbeda yaitu kita akan menggunakan RecycleView di Android Studio dengan bahasa Java
Sebenarnya langkah-langkah pembuatan RecycleView Java dan Kotlin tidaklah jauh berbeda, hanya pada syntaxnya saja yang berbeda
Jika diartikel sebelumnya ada 8 langkah pembuatan RecycleView menggunakan Rest API (Kotlin), maka di Java pun sama
Mari kita simak baik-baik langkah demi langkah berikut :
Cara Buat RecycleView Java Dengan Rest API
Pertama, Buat Project baru Empty Activity dengan nama RecycleView Java -> Language pilih Java-> Minimum SDK API 21 -> Lalu klik Finish
Kedua, tambahkan Library berikut ke build.gradle (Module: app)
implementation 'androidx.recyclerview:recyclerview:1.1.0' implementation 'com.github.bumptech.glide:glide:4.9.0' implementation 'com.amitshekhar.android:android-networking:1.0.2'
catatan :
Kita menggunakan library ‘com.github.bumptech.glide:glide:4.9.0’ untuk menampilkan gambar dari URL dan ‘com.amitshekhar.android:android-networking:1.0.2’ untuk dapat mengakses REST API.
Ketiga, tambahkan permission berikut ke AndroidManifest.xml untuk dapat mengakses internet
<uses-permission android:name="android.permission.INTERNET"/>
Keempat, edit file activity_main.xml lalu tambahkan recycleview dan progressBar (optional), hasil akhirnya seperti berikut :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
tools:context=".MainActivity">
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"/>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recycleView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
Kelima, buat layout baru untuk tampilan recycle view nya, dengan cara klik kanan layout -> New -> Layout Resource File -> Beri nama news_row_item -> OK.
Sama seperti sebelumnya, disini saya akan menampilkan 3 buah View, yaitu ImageView, dan 2 TextView. ImageView untuk menampilkan gambar, dan 2 TextView masing-masing untuk menampilkan Author dan Judul berita
Ubah news_row_item.xml seperti berikut :
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/itemImageView"
android:layout_width="74dp"
android:layout_height="74dp"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:contentDescription="gambar"
android:scaleType="centerCrop"
android:src="@drawable/ic_launcher_background"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/newsTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:paddingLeft="8dp"
android:lineSpacingExtra="4sp"
android:text="Deskripsi"
android:textAlignment="viewStart"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toEndOf="@+id/itemImageView"
app:layout_constraintTop_toBottomOf="@+id/newsAuthor"
app:layout_constraintVertical_bias="0.279" />
<TextView
android:id="@+id/newsAuthor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Judul"
android:textSize="14sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.501"
app:layout_constraintStart_toEndOf="@+id/itemImageView"
app:layout_constraintTop_toTopOf="parent" />
<View
android:id="@+id/view"
android:layout_width="match_parent"
android:layout_height="1dp"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Nah, bisa kalian lihat. Proses pembuatan RecycleView Java sampai dengan langkah kelima, sama saja dengan pembuatan RecycleView Kotlin. Untuk langkah yang selanjutnya akan sedikit berbeda, coba perhatikan baik-baik
Keenam, buat kelas model untuk menampung datanya, caranya dengan Klik Kanan di Directory JAVA / Package Name kalian -> New -> Java Class -> beri nama News dan pilih Class -> lalu enter
Perhatikan pembuatan kelas model berikut. Ikuti langkah demi langkah. Masukan kode berikut ke News.java
public class News {
private String title;
private String description;
private String photo;
}
Pembuatan kelas model belum selesai, kalian harus menambahkan Getter and Setter dengan Klik kanan pada workspace, pilih Generate (Alt+Insert) → Pilih Getter and Setter. Lihat gambar berikut :
Hasil akhir News.java akan seperti berikut
public class News {
private String title;
private String description;
private String photo;
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public String getPhoto() {
return photo;
}
public void setPhoto(String photo) {
this.photo = photo;
}
}
Ketujuh, buat adapter untuk RecycleView nya, caranya sama Klik Kanan di Directory JAVA / Package Name kalian -> New -> Java Class -> beri nama NewsAdapter dan pilih Class -> lalu enter
Kalau ada RecycleView pasti ada adapter. Supaya kalian lebih paham, saya jabarkan satu persatu pembuatan Adapter RecycleView nya, pertama lengkapi NewsAdapter.java seperti berikut:
public class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.NewsViewHolder> {
}
Maka akan ada garis merah dan NewsViewHolder juga akan merah. Kita resolve satu-persatu. Pertama adalah kita tekan alt+enter / klik tombol merah pada NewsViewHolder dan pilih Create class NewsViewHolder, kemudian pilih NewsAdapter karena kita akan membuat sebuah inner class
Maka akan menjadi seperti ini
public class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.NewsViewHolder> {
public class NewsViewHolder {
}
}
Masih ada garis merah, arahkan kursor ke teks class NewsAdapter, kita coba lakukan lagi alt+enter / klik tombol merah dan pilih implement methods
Kemudian pilihlah ketiga method dari RecycleView.Adapter lalu OK
Maka NewsAdapter.java akan menjadi seperti ini
public class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.NewsViewHolder> {
@NonNull
@Override
public NewsViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
return null;
}
@Override
public void onBindViewHolder(@NonNull NewsViewHolder holder, int position) {
}
@Override
public int getItemCount() {
return 0;
}
public class NewsViewHolder {
}
}
Jika kalian lihat masih ada garis merah, hal ini karena NewsViewHolder seharusnya inherit ke RecycleView.ViewHolder, kita lakukan lagi seperti tadi, klik alt+enter pilih Make ‘NewsViewHolder’ extend ‘androidx…..’
Masih ada error juga kita lakukan lagi alt+enter / klik tombol merah dan pilih Create constructor matching super.
Maka hasilnya akan seperti berikut:
public class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.NewsViewHolder> {
.
.
.
public class NewsViewHolder extends RecyclerView.ViewHolder {
public NewsViewHolder(@NonNull View itemView) {
super(itemView);
}
}
}
Selanjutnya lengkapi kelas NewsAdapter.java dari turunan RecycleView.Adapter seperti berikut :
public class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.NewsViewHolder> {
private ArrayList<News> mData = new ArrayList<>();
private OnItemClickCallback onItemClickCallback;
public void setOnItemClickCallback(OnItemClickCallback onItemClickCallback) {
this.onItemClickCallback = onItemClickCallback;
}
public void setData(ArrayList<News> items) {
mData.clear();
mData.addAll(items);
notifyDataSetChanged();
}
@NonNull
@Override
public NewsViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View mView = LayoutInflater.from(parent.getContext()).inflate(R.layout.news_row_item, parent, false);
return new NewsViewHolder(mView);
}
@Override
public void onBindViewHolder(@NonNull final NewsViewHolder holder, int position) {
holder.bind(mData.get(position));
holder.itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
onItemClickCallback.onItemClicked(mData.get(holder.getAdapterPosition()));
}
});
}
@Override
public int getItemCount() {
return mData.size();
}
class NewsViewHolder extends RecyclerView.ViewHolder {
TextView textViewAuthor;
TextView textViewJudul;
ImageView imageViewPhoto;
public NewsViewHolder(@NonNull View itemView) {
super(itemView);
textViewAuthor = itemView.findViewById(R.id.newsAuthor);
textViewJudul = itemView.findViewById(R.id.newsTitle);
imageViewPhoto = itemView.findViewById(R.id.itemImageView);
}
void bind(News news) {
Glide.with(itemView.getContext())
.load(news.getPhoto())
.apply(new RequestOptions().override(55, 55))
.into(imageViewPhoto);
textViewAuthor.setText(news.getAuthor());
textViewJudul.setText(news.getJudul());
}
}
public interface OnItemClickCallback {
void onItemClicked(News data);
}
}
Sejauh ini kita sudah selesai membuat Adapter untuk RecycleView nya, lanjut ketahap berikutnya
Kedelapan, kita setting di MainActivity.java
Setelah membuat adapter, selanjutnya kita inisialisasikan RecycleView.Adapter di class MainActivity.java seperti berikut
public class MainActivity extends AppCompatActivity {
private NewsAdapter adapter;
private ProgressBar progressBar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
progressBar = findViewById(R.id.progressBar);
RecyclerView recyclerView = findViewById(R.id.recycleView);
recyclerView.setLayoutManager(new LinearLayoutManager(this));
adapter = new NewsAdapter();
adapter.notifyDataSetChanged();
recyclerView.setAdapter(adapter);
showLoading(true);
getNews();
}
private void getNews() {
final ArrayList<News> listNews = new ArrayList<>();
String baseUrl = "http://newsapi.org/v2/top-headlines?country=id&category=technology&apiKey=YOURAPIKEY";
AndroidNetworking.get(baseUrl)
.setPriority(Priority.MEDIUM)
.build()
.getAsJSONObject(new JSONObjectRequestListener() {
@Override
public void onResponse(JSONObject response) {
Log.e("_kotlinResponse", response.toString());
try {
JSONArray jsonArray = response.getJSONArray("articles");
for (int i = 0; i < jsonArray.length(); i++) {
JSONObject news = jsonArray.getJSONObject(i);
News itemNews = new News();
itemNews.setTitle(news.getString("author"));
itemNews.setDescription(news.getString("description"));
itemNews.setPhoto(news.getString("urlToImage"));
listNews.add(itemNews);
}
adapter.setData(listNews);
showLoading(false);
} catch (JSONException e) {
e.printStackTrace();
}
}
@Override
public void onError(ANError anError) {
Log.d("onFailure", anError.getMessage());
}
});
}
private void showLoading(Boolean state) {
if (state) {
progressBar.setVisibility(View.VISIBLE);
} else {
progressBar.setVisibility(View.GONE);
}
}
}
Terakhir, silahkan run project kalian dan hasilnya kurang lebih seperti berikut :
Bagaimana ? Cukup membuat kalian bingung bukan ? Hehe..
Itulah step by step pembuatan RecycleView Java dengan memanfaatkan Rest API, kalian bisa membandingkan dengan artikel sebelumnya di RecycleView Kotlin Dengan Rest API mana yang lebih mudah
Seperti janji saya di artikel sebelumnya, untuk selanjutnya akan saya tambahkan ItemClickSupport pada RecyclerView supaya dapat menampilkan data yang kita klik
Sekian dulu tutorial tentang Penggunaan RecycleView menggunakan Rest API di Java, semoga bermanfaat. Untuk yang butuh source codenya dapat download dibawah ini.
Happy Coding !