Introduction

This article demonstrates the Android application interface with Azure computer vision API. It demonstrates image analysis.

What is Computer Vision API?

Computer vision is concerned with the automatic extraction, analysis, and understanding of useful information from a single image. It is also called cognitive. Computer Vision algorithms can analyze the content of an image in different ways, Computer Vision can find all the faces in an image.
Example
Android Application Interface with Azure ComputerVision API
Step 1
Create a new project in Android Studio from File >> Project and fill in all the necessary details. Next, go to Gradle Scripts >> build.gradle (Module: app).S elect build.gradle. The app Gradle compiles the code, and then build types will appear. Just replace that with the following code.
Usage
Make sure you've added maven central to the list.
  1. allprojects {
  2. repositories {
  3. maven { url 'https://jitpack.io' }
  4. }
  5. }
App gradle compile code
  1. dependencies {
  2. implementation 'com.github.eddydn:EDMTDevCognitiveVision:1.3'
  3. }
Change the SdkVersion is minimum level 21.
  1. defaultConfig {
  2. applicationId "io.github.saravanan_selvaraju.azurevision"
  3. minSdkVersion 21 // Minimum Level 21 SDK Version
  4. targetSdkVersion 28
  5. versionCode 1
  6. versionName "1.0"
  7. testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
  8. }
Step 2
Next, go to app >> res >> drawable, select the drawable directory then paste the given image.
Android Application Interface with Azure ComputerVision API
Next, go to app >> res >> layout >> activity_main.xml. Select the activity_main xml file then replacing the following code.
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. xmlns:app="http://schemas.android.com/apk/res-auto"
  4. xmlns:tools="http://schemas.android.com/tools"
  5. android:layout_width="match_parent"
  6. android:layout_height="match_parent"
  7. android:padding="20dp"
  8. tools:context=".MainActivity">
  9. <ImageView
  10. android:id="@+id/image_view"
  11. android:layout_width="match_parent"
  12. android:layout_height="match_parent" />
  13. <Button
  14. android:id="@+id/btn_process"
  15. android:text="Analyze"
  16. android:layout_alignParentBottom="true"
  17. android:layout_width="match_parent"
  18. android:layout_height="wrap_content" />
  19. <TextView
  20. android:id="@+id/txt_result"
  21. android:layout_above="@+id/btn_process"
  22. android:text="Description..."
  23. android:textAlignment="center"
  24. android:layout_width="wrap_content"
  25. android:layout_height="wrap_content" />
  26. </RelativeLayout>
Preview
Android Application Interface with Azure ComputerVision API
Step 3
Next, go to the Azure portal (https://portal.azure.com) create resource >> AI + Machine Learning >> Computer Vision. Select the computer vision and fill in all the necessary details then click the create button.
Android Application Interface with Azure ComputerVision API
After that get the computer vision API_KEY and API_LINK then click the key hyperlink and keys 1 and 2 appear.
Android Application Interface with Azure ComputerVision API
Copy the anyone Azure_Vision key (Key 1 or Key 2).
Android Application Interface with Azure ComputerVision API
Step 4
Next, go to app >>Java >> package name. Select MainActivity.java. The Java code will appear.
Android Application Interface with Azure ComputerVision API
When an asynchronous task is executed, the task goes through 4 steps,
  • onPreExecute(), invoked on the UI thread before the task is executed. This step is normally used to set up the task, for instance by showing a progress bar in the user interface.
  • doInBackground(Params...), invoked on the background thread immediately after onPreExecute() finishes executing. This step is used to perform background computation that can take a long time. The parameters of the asynchronous task are passed to this step. The result of the computation must be returned by this step and will be passed back to the last step. This step can also use publishProgress(Progress...) to publish one or more units of progress. These values are published on the UI thread, in the onProgressUpdate(Progress...) step.
  • onProgressUpdate(Progress...), invoked on the UI thread after a call to publishProgress(Progress...). The timing of the execution is undefined. This method is used to display any form of progress in the user interface while the background computation is still executing. For instance, it can be used to animate a progress bar or show logs in a text field.
  • onPostExecute(Result), invoked on the UI thread after the background computation finishes. The result of the background computation is passed to this step as a parameter.
    Android Application Interface with Azure ComputerVision API
MainActivity.java
  1. package io.github.saravanan_selvaraju.azurevision;
  2. import android.app.ProgressDialog;
  3. import android.graphics.Bitmap;
  4. import android.graphics.BitmapFactory;
  5. import android.os.AsyncTask;
  6. import android.support.v7.app.AppCompatActivity;
  7. import android.os.Bundle;
  8. import android.text.TextUtils;
  9. import android.view.View;
  10. import android.widget.Button;
  11. import android.widget.ImageView;
  12. import android.widget.TextView;
  13. import android.widget.Toast;
  14. import com.google.gson.Gson;
  15. import org.w3c.dom.Text;
  16. import java.io.ByteArrayInputStream;
  17. import java.io.ByteArrayOutputStream;
  18. import java.io.IOException;
  19. import java.io.InputStream;
  20. import edmt.dev.edmtdevcognitivevision.Contract.AnalysisInDomainResult;
  21. import edmt.dev.edmtdevcognitivevision.Contract.AnalysisResult;
  22. import edmt.dev.edmtdevcognitivevision.Contract.Caption;
  23. import edmt.dev.edmtdevcognitivevision.Rest.VisionServiceException;
  24. import edmt.dev.edmtdevcognitivevision.VisionServiceClient;
  25. import edmt.dev.edmtdevcognitivevision.VisionServiceRestClient;
  26. public class MainActivity extends AppCompatActivity {
  27. ImageView imageView;
  28. Button btnProcess;
  29. TextView txtResult;
  30. private final String API_KEY = "b3a1dd91af344f07b2a318507d93c9dc";
  31. private final String API_LINK = "https://eastus.api.cognitive.microsoft.com/vision/v1.0";
  32. VisionServiceClient visionServiceClient = new VisionServiceRestClient(API_KEY,API_LINK);
  33. @Override
  34. protected void onCreate(Bundle savedInstanceState) {
  35. super.onCreate(savedInstanceState);
  36. setContentView(R.layout.activity_main);
  37. imageView = (ImageView)findViewById(R.id.image_view);
  38. btnProcess = (Button) findViewById(R.id.btn_process);
  39. txtResult = (TextView)findViewById(R.id.txt_result);
  40. final Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.smile);
  41. imageView.setImageBitmap(bitmap);
  42. btnProcess.setOnClickListener(new View.OnClickListener() {
  43. @Override
  44. public void onClick(View view) {
  45. ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
  46. bitmap.compress(Bitmap.CompressFormat.JPEG, 100,outputStream);
  47. final ByteArrayInputStream inputStream = new ByteArrayInputStream(outputStream.toByteArray());
  48. AsyncTask<InputStream,String,String> visionTask = new AsyncTask<InputStream, String, String>() {
  49. ProgressDialog progressDialog = new ProgressDialog(MainActivity.this);
  50. @Override
  51. protected void onPreExecute() {
  52. progressDialog.show();
  53. }
  54. @Override
  55. protected String doInBackground(InputStream... inputStreams) {
  56. try
  57. {
  58. publishProgress("Reconizing...");
  59. String[] features = {"Description"};
  60. String[] details = {};
  61. AnalysisResult result = visionServiceClient.analyzeImage(inputStreams[0],features,details);
  62. String jsonResult = new Gson().toJson(result);
  63. return jsonResult;
  64. } catch (IOException e) {
  65. e.printStackTrace();
  66. } catch (VisionServiceException e) {
  67. e.printStackTrace();
  68. }
  69. return "";
  70. }
  71. @Override
  72. protected void onPostExecute(String s){
  73. if(TextUtils.isEmpty(s)){
  74. Toast.makeText(MainActivity.this,"API Return Empty Result",Toast.LENGTH_SHORT).show();
  75. }
  76. else {
  77. progressDialog.dismiss();
  78. AnalysisResult result = new Gson().fromJson(s, AnalysisResult.class);
  79. StringBuilder result_Text = new StringBuilder();
  80. for (Caption caption : result.description.captions)
  81. result_Text.append(caption.text);
  82. txtResult.setText(result_Text.toString());
  83. }
  84. }
  85. @Override
  86. protected void onProgressUpdate(String... values){
  87. progressDialog.setMessage(values[0]);
  88. }
  89. };
  90. visionTask.execute(inputStream);
  91. }
  92. });
  93. }
  94. }
Step 5
Next, go to app >> manifests >> AndroidManifest.XML. Add internet permission to the AndroidManifest.XML file.
  1. <uses-permission android:name="android.permission.INTERNET"></uses-permission>
  2. <application
  3. android:usesCleartextTraffic="true" //clear textTraffic is must
  4. </application>
Step 6
Next, go to Android Studio and deploy the application. Select Emulator or your Android Device with USB debugging enabled. Give it a few seconds to make installations and set permissions.
Run the application in your desired emulator (Shift + F10).
Android Application Interface with Azure ComputerVision API
When I click the analyze button to get the output for "a dinosaur with its mouth open"
Finally, we have successfully created a Computer Vision Android application. Later we will discuss more Android applications.