RecyclerView, SearchView with Retrofit 2

In this tutorial we are going create a demoapplication that uses retrofit2 to parse and display data in a recyclerview.
We are going to PHP particually “PDO” to fetch and return JSON array of data from our MySQL.
Using retrofit we shall consume that JSON data and display it in a recyclerview.
The recyclerview will contain card, image,text and material search to search through recyclerview items.
The url below contain JSON datawhich we are going to fetch using retrofit.
https://larntech.net/api/fruits/

  • What do we expect to achieve
  • android retrofit recyclerview onitemclick open new activity

    API to our data

  • I have all ready created an API that respond JSON data.
  • Api can be found at.
  • https://larntech.net/api/fruits

  • The response looks the one below.
  • Above data is what we shall populate recyclerview with
  • Creating a New Project

  • Open your android studio click File => New Project and give it a name in this tutorial it’s named as AndroidRetrofit.
  • Click next select Empty Activity => Finish.
  • Adding Dependencies

  • Open build.gradle and the following dependencies.
  • To Perform network calls
  • To pass JSON data
  • To load image from URL add the following depedancy
  • All dependancies
  • Retrofit 2 with Recyclerview dependancy

    Adding RecyclerView, Cardview and Design

  • RecyclerView will display images and text from the server.
  • In this case our image will be fruit image and text will be name of the fruit
  • Cardview will hold the image and text.
  • Click File => Project Structure => app => Dependencies => + => Library Dependency.
  • Search for recyclerview and add it
  • Repeat the same step to add cardview and design.
  • Adding RecyclerView to project

    Adding Search Icon

  • Click the link below to download search icon, Unzip, copy and paste in drawable folder.
  • Download Search Icon

    Adding internet permission

  • Add the following permission in your manifest file
  • Adding theme

  • Open style.xml file located under values.
  • Add theme NoActionBar, AppBarOverlay,PopupOverlay
  • Create Recyclerview in Activity_main.xml

  • Copy and Paste the code below in your activity_main.xml file .
  • Create Resource Layout file to hold Recyclerview data

  • Right click on layout => New => Layout Resource File and name it row_data.xml
  • Copy and Paste the code below.
  • Create model class

  • Right click File => new => java class and name it Fruits.java.
  • This class is responsible for POJO functions.
  • copy and paste the code below.
  • Creating Api interface

  • This class contains base_url, request type and parameter.
  • Creating Adapter

  • Adapter class links data source RecyclerView.
  • Create a new java class and call it FruitAdapter.
  • Copy and paste the code below.
  • Open MainActivity class copy and paste the code below.

  • Copy and Paste the code below
  • Create activity to display clicked item

  • Right click on Layout => New => Activity => Empty Activity => name it in this case i have named it activity_item_display.
  • Open your activity_item_display, Copy and Paste the code below.
  • Receiving and displaying clicked items

  • We are going to use intents to send and receive clicked item.
  • To send data between activities through intent we use.
  • Open your ItemDisplayActivity, Copy and Paste the code below for receiving and displaying clicked item.
  • That all now let’s run our app and see the output .

    android retrofit recyclerview onitemclick open new activity



One Comment