Android Spinner Example to Load JSON Using Retrofit

Let us create Android Spinner Example to Load JSON Using Retrofit in this article.

In this tutorial, we will populate android spinner from MySQL database using retrofit and JSON data.

To set the spinner value from JSON using retrofit, we will have to call one web service.

Retrofit will help us to make http call to web service with very fewer lines of code.

We will get the JSON response in string value and we will parse this JSON using scalar library.

Result of this example

Watch the below video which shows the final output of this android spinner retrofit example tutorial.

Step 1. Permission Works

Before everything, make a new project in android studio.

When we want to fetch JSON data from remote server, we need to use internet.

For this purpose add the below line in AndroidManifest.xml file.

  • Internet permission is regular one, which is not much sensitive in terms of privacy of the user.
  • Hence, we do not need to ask for runtime internet permission.

Now in your build.gradle(Module: app) file, add the below couple of lines.

  • First line will fetch necessary classes to use retrofit in this project.
  • Second line will help us to convert the JSON response into the string format.

Step 2. Drawable file Plus Image

In our spinner, we will use customize dropdown icon.

For this we need one image of dropdown arrow which you can download by clicking the below link

Download arrow Image

  • Add this image to the res->drawable directory.

Now time to create one XML file in the same directory. Give it a name spinner.xml

Write down the below source code in  spinner.xml file

  • Above file will draw the border to our spinner.
  • The color of the borders will be pink (colorAccent from the colors.xml)

You can change the color of the borders using the below line

  • You can also change the size or width of the border using the above line.

To change the corner radius of the border, you can use below line

  • Increase the above value to get more width of the border.

To set the custom dropdown icon, you need to use the below code lines

  • Using gravity, you can set the place where you want to put dropdown arrow. I have put it at center and right.
  • Use src to give reference to the arrow image.

Step 3. Perfect Interface

To write the URL of the web service, we need to make one interface in this example.

Prepare a new JAVA class and call it SpinnerInterface.java

Code structure for SpinnerInterface.java is as the following

  • A string variable holds the URL of the JSON data.
  • @GET annotation have the name of the file which will give us JSON response.
  • A method getJSONString() will be called from Main class to make the http call.

Step 4. Making Model For Spinner

Create a new class and set the name as SpinnerModel.java

Code snippet for SpinnerModel.java file is as per the following lines

  • Our JSON response will provide us information like player’s country, name , city and image URL.
  • Thus, this model class includes the separate getter and setter methods for all these types of information.

Step 5. Ending the Spinner

We have reached at the last step of this tutorial. When you have created a new project, you should have two auto generated files : activity_main.xml and MainActivity.java

In the activity_main.xml, write down the below code lines

  • This file have two UI widgets. One is Text View and other one is Spinner.
  • Text View is showing that “Spinner is populated from retrofit json data.”
  • Spinner have background properties to make it more attractive.

Now code snippet for MainActivity.java is looking like the following source codes

Going Deep

Let us show the above source code in details.

  • In the onCreate() method, there is a method named fetchJSON()

Code structure for fetchJSON() methods is like the following

  • Compiler will first create the object of the Retrofit class.
  • With this object, one method called .baseUrl() is attached which will give the URL to retrofit.
  • After this, compiler will create the object of the SpinnerInterface class. This object will help us to call getJSONString() method.
  • Till now retrofit have make the http call to the web server and when it get the JSON response in string format, it will call onResponse() method.
  • Under onResponse() method, string variable jsonresponse will hold the full JSON data. Then compiler will call spinJSON() method.

Before we understand the spinJSON() method, checkout the JSON reponse below

Code structure for spinJSON() method is as per the below

  • First of all, compiler will check the value of the field “status”. If it is “true” then compiler will create an arraylist with the objects of the SpinnerModel class.
  • Then it will parse one json array associated with the field “data”.
  • After this, compiler will iterate one for loop. During this for loop, it will use setter methods if SpinnerModel class to maintain the data structure.
  • Then compiler will create one array adapter and it will attach it with the spinner.

Download Source Code for android spinner example to load json using retrofit

Download Spinner_JSON_Retrofit Source Code

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 *