Implement Retrofit Library on Android Part 1 : Consume GitHub API
utopian-io·@enyason·
0.000 HBDImplement Retrofit Library on Android Part 1 : Consume GitHub API
<html>
<p>https://i.imgur.com/gCr9r3I.png</p>
<p><strong>Repository:</strong> https://github.com/square/retrofit</p>
<p><strong>What will I Learn?</strong></p>
<p>In this tutorial, you will learn the following:</p>
<ul>
<li>Implement the retrofit library in making network request</li>
<li>Create an Android client for HTTP requests against the GitHub API.</li>
<li>Consume the GitHub API and get required data (User repositories).</li>
<li>Display results based on s query in a List</li>
<li>Sort the search result of user repository</li>
<li>Use of Custom Array Array Adapters</li>
</ul>
<p><br></p>
<p><strong>Requirements</strong></p>
<p>To successfully complete this tutorial, you will need the following:</p>
<ul>
<li>A laptop with any operating system such as Windows OS, Mac OSX and Linux</li>
<li>Android Studio Installed <a href="https://developer.android.com/studio/">AndroidStudio</a></li>
<li>Internet access</li>
<li>Knowledge of Java programming and Android Studio IDE</li>
<li>Android Device or Emulator for Testing</li>
</ul>
<p><br></p>
<p><strong>Difficulty</strong></p>
<ul>
<li>Intermediate</li>
</ul>
<p><br></p>
<p><strong>Tutorial Content</strong></p>
<p>Retrofit is <em>A type-safe REST client for Android and Java, </em>according to the official page <a href="http://square.github.io/retrofit">Retrofit </a>Retrofit makes use of annotations to describe HTTP requests, URL parameter replacement and query parameter support is integrated by default. In later tutorials we’ll look at some of the other cool features of retrofit in more detail.</p>
<p><br></p>
<p><strong>Step 1 : Set Up Your Android Project</strong></p>
<p>To begin this tutorial, lets first a new project with the android studio IDE</p>
<p><strong>Step 2 : Define gradle dependency</strong></p>
<ul>
<li>Set Retrofit as a dependency for your project. Define Retrofit and its dependencies in your <code>build.gradle.</code></li>
</ul>
<pre><code>dependencies { <br>
<br>
// Retrofit <br>
compile 'com.squareup.retrofit2:retrofit:2.4.0'<br>
<br>
compile 'com.squareup.retrofit2:converter-gson:2.4.0'<br>
<br>
}</code></pre>
<p><br></p>
<p><img src="https://cdn.steemitimages.com/DQmXuJTyN6vX1QkWEm2A7sMhWwBQ3rN8NtQDbGShBamsuCp/rect3501.png" width="786" height="597"/></p>
<ul>
<li>Run the command to build your code, the build system will download and provide the library for your project.</li>
</ul>
<p><img src="https://i.imgur.com/t34bHir.png"/></p>
<p><strong>Step 3 : Set Android’s Network Permission</strong></p>
<p>Retrofit makes an internet request to an API (GitHub) which is running in a server. Making such request from an android application, requires the Internet Permission . This permission is defined within the AndroidManifest.xml file.</p>
<pre><code><uses-permission android:name="android.permission.INTERNET" /> </code></pre>
<p><strong>Step 4 : And ListView to the activity_main.xml file</strong></p>
<pre><code><em><?</em><strong>xml version="1.0" encoding="utf-8"</strong><em>?></em><br>
<<strong>RelativeLayout</strong><br>
<strong> xmlns:android="http://schemas.android.com/apk/res/android"</strong><br>
<strong> xmlns:app="http://schemas.android.com/apk/res-auto"</strong><br>
<strong> xmlns:tools="http://schemas.android.com/tools"</strong><br>
<strong> android:layout_width="match_parent"</strong><br>
<strong> android:layout_height="match_parent"</strong><br>
<strong> tools:context="com.nexdev.enyason.retrofitgithub.MainActivity"</strong>><br>
<<strong>ListView</strong><br>
<strong> android:id="@+id/repo_list"</strong><br>
<strong> android:layout_width="match_parent"</strong><br>
<strong> android:layout_height="match_parent"</strong>/><br>
<br>
<<strong>ProgressBar</strong><br>
<strong> android:layout_centerInParent="true"</strong><br>
<strong> android:layout_width="wrap_content"</strong><br>
<strong> android:layout_height="wrap_content"</strong><br>
<strong> android:id="@+id/pb_main"</strong>/><br>
</<strong>RelativeLayout</strong>></code></pre>
<p><img src="https://i.imgur.com/kJMRp5G.png"/></p>
<p><br></p>
<p><strong>Step 5 : Create a Row Item Layout</strong></p>
<p>Each item from the response is display using this layout</p>
<p><img src="https://i.imgur.com/JS5o7N5.png"/></p>
<p><br></p>
<p><br></p>
<p><strong>Step 6 : Create a Custom ArrayAdapter</strong></p>
<p>This custom array adapter is to help populate the listview with data. Having a custom adapter makes customization easy for us.We can have a complicated row view and use java Objects as our list Type.</p>
<p><img src="https://i.imgur.com/VdICPqm.png"/></p>
<p><br></p>
<p><strong>Step 7 :Describe API Endpoints</strong></p>
<p><strong> </strong></p>
<p>Before we can start making requests, we need to describe the API endpoints we want to interact with. In this tutorial we’ll just describe a simple GitHub endpoint. First, you have to create an interface and define required methods.</p>
<ul>
<li>Create and Object Model using POJO i.e Plain Olde Java Object</li>
</ul>
<pre><code><strong>public class </strong>GitHubRepo {<br>
<br>
String <strong>name</strong>;<br>
<strong>public </strong>String getName() {<br>
<strong>return name</strong>;<br>
}}</code></pre>
<p><img src="https://i.imgur.com/Ts3bgqo.png"/></p>
<ul>
<li><strong>Create an interface to define a GitHub User</strong><br>
The following code defines the GitHubUser and a method repoForUser to request the list of repositories for a given user. The @GET annotation declares that this request uses the HTTP @GET method. The code snippet also illustrates the usage of Retrofit’s path parameter replacement functionality. In the defined method the {user} path will be replaced with the given variable values when calling the repoForUser method.</li>
</ul>
<pre><code><strong>public interface </strong>GitHubUser {<br>
@GET(<strong>"/users/{user}/repos"</strong>)<br>
Call<List<GitHubRepo>> repoForUser(@Path(<strong>"user"</strong>) String user);<br>
<br>
}<br>
</code></pre>
<p><img src="https://cdn.steemitimages.com/DQmTL4RqUo3z68iJeZihjchFMdwfHmoPPCw4DBr1iUrRMKE/r2.png" width="1366" height="768"/></p>
<p><br></p>
<p><br></p>
<p><br></p>
<p><strong>Step 8 : Create Retrofit REST Client from the Retrofit Class</strong></p>
<p>After describing the API interface and the object model, it’s time to prepare an actual request. To do this, we use Retrofit class. After that we use a builder to set some general options for all requests, i.e. the base URL or the converter.</p>
<pre><code><em>// set up retrofit builder object</em><br>
<br>
Retrofit.Builder builder = <strong>new </strong>Retrofit.Builder()<br>
.baseUrl(<strong>"https://api.github.com"</strong>)<br>
.addConverterFactory(GsonConverterFactory.<em>create</em>());</code></pre>
<pre><code><br>
<em>//create retrofit object</em><br>
<br>
Retrofit retrofit = builder.build();</code></pre>
<pre><code><br>
<em>//instance of our github user</em><br>
<br>
<br>
GitHubUser gitHubUser = retrofit.create(GitHubUser.<strong>class</strong>);</code></pre>
<p><br></p>
<p><strong>Step 9 : Do the Actual Network Request </strong></p>
<p>Here you also use your user object. However, here you don’t pass your callback as the last parameter. You use the client to get a call object. Once you’ve invoked .enqueue on the created call object the request will be made by Retrofit. This request is done asynchronously in order not to block the UI Thread.</p>
<pre><code> @Override<br>
<strong>public void </strong>onResponse(Call<List<GitHubRepo>> call, Response<List<GitHubRepo>> response) {<br>
<br>
<br>
<strong>progressBar</strong>.setVisibility(View.<em><strong>INVISIBLE</strong></em>);<br>
<em><br>
<br>
// return the response to a list object</em><br>
<br>
<br>
<em> </em>List<GitHubRepo> list = response.body();<br>
<br>
<em> </em>MyArrayAdapter arrayAdapter = <strong>new </strong>MyArrayAdapter(MainActivity.<strong>this</strong>,list); <br>
<br>
<em>// setup the adapter</em><br>
<br>
<em> </em><strong>repoListView</strong>.setAdapter(arrayAdapter); <em>// attach adapter to list view</em><br>
<em> </em>}</code></pre>
<pre><code><br>
@Override<br>
<br>
<strong>public void </strong>onFailure(Call<List<GitHubRepo>> call, Throwable t) {<br>
<br>
<br>
<br>
<strong>progressBar</strong>.setVisibility(View.<em><strong>INVISIBLE</strong></em>);<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
}<br>
<br>
<br>
<br>
<br>
<br>
});</code></pre>
<p><br></p>
<p><br></p>
<p><strong>Application Demo</strong></p>
<p>https://youtu.be/a-khKD7G7tk</p>
<p><strong>Proof of Work Done</strong></p>
<p>The source code for this tutorial is found here <a href="https://github.com/enyason/RetrofitGitHub">gitHub<br>
</a></p>
</html>