Android RecyclerView Retrofit | Parse JSON Display RecyclerView Retrofit

This post is about Android RecyclerView Retrofit Tutorial With Example.

Android JSON parsing and display with recyclerview using retrofit is today’s topic.

In this tutorial, we will retrieve JSON data from MySQL database and then we will set this data in Recycler View.

Retrofit library is useful to make http calls seamlessly and it also saves time.

If we make http call with android’s in built classes then this task can be a little tricky.

Following is Output

Step 1. Gradle and Permission Tasks

Create a new project in the android studio. Select Empty activity during the process of making a new project.

Now in the AndroidManifest.xml file, add the following line

  • Above line will enable our app to use the internet so that we can fetch JSON data from web server or MySQL database.
  • Now we need to use five different libraries in this project.

Write down the following coding lines in build.gradle(Module: app) file

  • First coding line will fetch the required classes to use the retrofit library.
  • Second line will enable us to use the scalars library. This library will help us to convert the JSON response into the string format.
  • Third one will allow us to use Picasso library which will load the images from the URL for us.
  • Fourth line is for recycler view.
  • And last one is for card view because recycler view and card view are not added to the default UI widgets (like text view, edittext, list view etc.) in the android system.

Step 2. Required Interface

Create a new JAVA class. Give it a name like RecyclerInterface.java and add the following source code in it

  • A string variable JSONURL holds the URL of the json file in the string format.
  • Name of the PHP file is not included in the string variable but it is present in the @GET annotation.
  • Then a method is defined as the getString() which has the return type as Call<String>.

Step 3. Model For Retrofit

Make a new JAVA class and call it as ModelRecycler.java

Source code for ModelRecycler.java class is as the following

  • Our JSON data has certain types of information such as player’s name, country, city and URL of the image.
  • Model class have getter and setter methods for all these information types.
  • Such type of model class helps us to maintain proper data structure while interacting with the RecyclerView.

Step 4. Layout File for RecyclerView

Create a new layout file under res->layout directory.

Name of this file should be retro_item.xml

Source code for this file is as per the below

  • I have written one image view and three text views in this file.
  • Picasso will fetch will image in this image view while text views will hold the information like country, name and city.
  • All the rows of the recyclerview will get their look and feel from this layout file.

Step 5. Adapter For Retrofit RecyclerView

Time to write the adapter file to populate our recycler view.

Create a new JAVA class and set it’s name as RetrofitAdapter.java

Following is the code structure for RetrofitAdapter.java  class

  • First of all, look at the second parameter of the constructor. It has arraylist with the objects of the ModelRecycler class.
  • This arraylist will work as the data source in this adapter.
  • Now read the onBindViewHolder() method. Compiler will fill the information using this method.
  • First line inside onBindViewHolder() method will load the image from URL using Picasso library.
  • Second, third and fourth lines will set the information like name, country and city respectively in the text views.

Step 6. Main Activity files

At last but not least, we need to change the writings for main files.

In your activity_main.xml file, add the below code lines

  • One text view and a recycler view is present in the main layout file.
  • Text view has constant value and it is saying like “Recyclerview has JSON data which is fetched with retrofit.”

Now in the MainActivity.java file, you should add the following code snippet

Main Activity Roots

Inside onCreate() method, compiler will call fetchJSON() method.

Coding lines for fetchJSON() method is as the following

  • First task is to create the object of the Retrofit class. Here, .baseUrl() contains the URL to which we will make the http call.
  • Then compiler will create the object of the RecyclerInterface class which we have made during the step 2.
  • After that, compiler will make the call object and using it, it will execute the .enqueue() method.
  • Until now, retrofit have make the http call to the URL. When server gives the response, compiler will call onResponse() method.
  • Here we will get our JSON response in string format. Then compiler will call writeRecycler() method.

Before we read writeRecycler() method, let us first check the JSON STRUCTURE

Now following is the code for writeRecycler() method

  • First of all, compiler will check the status field from JSON. If it has value as true then it will parse one JSONArray.
  • Field named “data” holds the json array and compiler will parse it in object of the ArrayList<ModelRecycler>.
  • Then compiler will run one for loop.
  • During the every iteration of for loop, system set the information using various setter methods of the ModelRecycler class.
  • After the completion of the for loop, compiler create the object of the RetrofitAdapter class and will bind it with the recycler view.

Download Source Code For Android RecyclerView Retrofit

Download Source Code For Json_Recycler_Retrofit

Hardik Parsania

I am mobile app developer. I am always passionate about solving complex and real world problems.I have developed many apps with great interest and superior logical skills.

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *