Lompat ke konten Lompat ke sidebar Lompat ke footer

Membuat Listview Dengan Json Link Android Studio Java

Hasilnya : 



 *Artikeln ini Sebagai Pengingat Saya Pribadi

Implementasi 

implementation 'com.android.volley:volley:1.2.1'
implementation 'com.squareup.picasso:picasso:2.71828'

Json Yang Ada Pada Link

"0" => Array (
        "gambar" => "https://ranairucreation.000webhostapp.com/manga/Goblin%20Slayer/judul.jpg",
        "judul" => "Goblin Slayer",
        "link" => "steavehop.com",
        "favorite" => "https://ranairucreation.000webhostapp.com/manga/Goblin%20Slayer/judul.jpg",
        "deskripsi" => "Desk : -"
    ),
    "1" => Array (
        "gambar" => "https://ranairucreation.000webhostapp.com/manga/Material%20Peak/judul.jpg",
        "judul" => "Material Peak",
        "link" => "kasurisport.com.com",
        "favorite" => "https://ranairucreation.000webhostapp.com/manga/Material%20Peak/judul.jpg",
        "deskripsi" => "Desk : -"
    ),
    "2" => Array (
        "gambar" => "https://ranairucreation.000webhostapp.com/manga/Max%20Level%20Returner/judul.jpg",
        "judul" => "Max Level Returner",
        "link" => "awikwok.com",
        "favorite" => "https://ranairucreation.000webhostapp.com/manga/Max%20Level%20Returner/judul.jpg",
        "deskripsi" => "Desk : -"
    ),
    "3"

 Tambahkan DI manifest

<!--permissions for INTERNET-->
<uses-permission android:name="android.permission.INTERNET"/>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<!--progress bar for loading indicator-->
<ProgressBar
android:id="@+id/idPB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />

<!--recycler view to display our data-->
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/idRVCourses"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" />

</RelativeLayout>

 Buat Java CourseModal.java


public class CourseModal {

// variables for our course
// name and description.
private String courseName;
private String courseimg;
private String courseMode;
private String courseTracks;

// creating constructor for our variables.
public CourseModal(String courseName, String courseimg, String courseMode, String courseTracks) {
this.courseName = courseName;
this.courseimg = courseimg;
this.courseMode = courseMode;
this.courseTracks = courseTracks;
}

// creating getter and setter methods.
public String getCourseName() {
return courseName;
}

public void setCourseName(String courseName) {
this.courseName = courseName;
}

public String getCourseimg() {
return courseimg;
}

public void setCourseimg(String courseimg) {
this.courseimg = courseimg;
}

public String getCourseMode() {
return courseMode;
}

public void setCourseMode(String courseMode) {
this.courseMode = courseMode;
}

public String getCourseTracks() {
return courseTracks;
}

public void setCourseTracks(String courseTracks) {
this.courseTracks = courseTracks;
}
}

 Buat Layout Baru course_rv_item.xml
<?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_margin="8dp"
android:elevation="8dp"
app:cardCornerRadius="8dp">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">

<!--ImageView to display our course image-->
<ImageView
android:id="@+id/idIVCourse"
android:layout_width="140dp"
android:layout_height="140dp"
android:layout_margin="5dp" />

<!--text view for our course name-->

<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">

<TextView
android:id="@+id/idTVCourseName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:padding="5dp"
android:text="Course Name "
android:textColor="@color/black"
android:textSize="18sp"
android:textStyle="bold" />


<!--text view for our batch name-->
<TextView
android:id="@+id/idTVBatch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dp"
android:text="Batch"
android:textColor="@color/black" />

<!--text view to display course tracks-->
<TextView
android:id="@+id/idTVTracks"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dp"
android:text="Tracks"
android:textColor="@color/black" />

<Button
android:layout_width="wrap_content"
android:text="Baca"
android:id="@+id/idBaca"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>

</androidx.cardview.widget.CardView>

 Buat CourseAdapter.java


import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;

import com.squareup.picasso.Picasso;

import java.util.ArrayList;

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

// creating a variable for array list and context.
private ArrayList<CourseModal> courseModalArrayList;
private Context context;

// creating a constructor for our variables.
public CourseAdapter(ArrayList<CourseModal> courseModalArrayList, Context context) {
this.courseModalArrayList = courseModalArrayList;
this.context = context;
}

@NonNull
@Override
public CourseAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
// below line is to inflate our layout.
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.course_rv_item, parent, false);
return new ViewHolder(view);
}

@Override
public void onBindViewHolder(@NonNull CourseAdapter.ViewHolder holder, int position) {
// setting data to our views of recycler view.
CourseModal modal = courseModalArrayList.get(position);
holder.courseNameTV.setText(modal.getCourseName());
holder.courseTracksTV.setText(modal.getCourseTracks());
holder.courseModeTV.setText(modal.getCourseMode());
Picasso.get().load(modal.getCourseimg()).into(holder.courseIV);
}

@Override
public int getItemCount() {
// returning the size of array list.
return courseModalArrayList.size();
}

public class ViewHolder extends RecyclerView.ViewHolder {
// creating variables for our views.
private TextView courseNameTV, courseModeTV, courseTracksTV;
private ImageView courseIV;

public ViewHolder(@NonNull View itemView) {
super(itemView);

// initializing our views with their ids.
courseNameTV = itemView.findViewById(R.id.idTVCourseName);
courseModeTV = itemView.findViewById(R.id.idTVBatch);
courseTracksTV = itemView.findViewById(R.id.idTVTracks);
courseIV = itemView.findViewById(R.id.idIVCourse);
}
}
}

 Di MainActivity.java 

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

import android.os.Bundle;
import android.view.View;
import android.widget.ProgressBar;
import android.widget.Toast;

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;

import com.android.volley.Request;
import com.android.volley.RequestQueue;
import com.android.volley.Response;
import com.android.volley.VolleyError;
import com.android.volley.toolbox.JsonArrayRequest;
import com.android.volley.toolbox.Volley;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

// creating variables for
// our ui components.
private RecyclerView courseRV;

// variable for our adapter
// class and array list
private CourseAdapter adapter;
private ArrayList<CourseModal> courseModalArrayList;

// below line is the variable for url from
// where we will be querying our data.
String url = "https://ranairucreation.000webhostapp.com/data.json";
private ProgressBar progressBar;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

// initializing our variables.
courseRV = findViewById(R.id.idRVCourses);
progressBar = findViewById(R.id.idPB);

// below line we are creating a new array list
courseModalArrayList = new ArrayList<>();
getData();

// calling method to
// build recycler view.
buildRecyclerView();
}

private void getData() {
// creating a new variable for our request queue
RequestQueue queue = Volley.newRequestQueue(MainActivity.this);
// in this case the data we are getting is in the form
// of array so we are making a json array request.
// below is the line where we are making an json array
// request and then extracting data from each json object.
JsonArrayRequest jsonArrayRequest = new JsonArrayRequest(Request.Method.GET, url, null, new Response.Listener<JSONArray>() {
@Override
public void onResponse(JSONArray response) {
progressBar.setVisibility(View.GONE);
courseRV.setVisibility(View.VISIBLE);
for (int i = 0; i < response.length(); i++) {
// creating a new json object and
// getting each object from our json array.
try {
// we are getting each json object.
JSONObject responseObj = response.getJSONObject(i);

// now we get our response from API in json object format.
// in below line we are extracting a string with
// its key value from our json object.
// similarly we are extracting all the strings from our json object.
String courseName = responseObj.getString("judul");
String courseTracks = responseObj.getString("deskripsi");
String courseMode = responseObj.getString("link");
String courseImageURL = responseObj.getString("gambar");
courseModalArrayList.add(new CourseModal(courseName, courseImageURL, courseMode, courseTracks));
buildRecyclerView();
} catch (JSONException e) {
e.printStackTrace();
}
}
}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError error) {
Toast.makeText(MainActivity.this, "Fail to get the data..", Toast.LENGTH_SHORT).show();
}
});
queue.add(jsonArrayRequest);
}

private void buildRecyclerView() {

// initializing our adapter class.
adapter = new CourseAdapter(courseModalArrayList, MainActivity.this);

// adding layout manager
// to our recycler view.
LinearLayoutManager manager = new LinearLayoutManager(this);
courseRV.setHasFixedSize(true);

// setting layout manager
// to our recycler view.
courseRV.setLayoutManager(manager);

// setting adapter to
// our recycler view.
courseRV.setAdapter(adapter);
}
}