Introduction

In this article, we are going to create a TN Image View in Android using Android Studio. It is a type of library that makes the images touchable and movable. By using this, we can move the image with a simple touch.
Step 1
Create a new project in Android Studio.
Android
Give a name to the project and click "Next".
Android
Select the "Phone and Tablet" option and click "Next".
Android
Select an empty activity and click "Next".
Android
At last, give the activity name and click on "Finish".
Android
Step 2
Next, copy the source image in .png format.
Android
Locate app>>res>>drawable folder and paste the copied image into the drawable folder.
Android
Check whether it is pasted correctly.
Android
Step 3
Locate the Gradle Scripts>>Build.Gradle 1.
Android
And, type the following dependency in your app's build.gradle.
Android
Code copy is here:
  1. maven { url 'https://jitpack.io' }
Step 4
Locate the Gradle Scripts>>Build.Gradle 2.
Android
Type the following dependency in your app's build.gradle.
Android
The code copy is here.
  1. implementation 'com.github.AmeerHamzaaa:TNImageView-Android:0.1.2'
Step 5
Next, go to app >> res >> layout >> activity_main.xml. Select activity page.
Android
Just type the code as following.
Android
The code copy is here.
  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. tools:context="com.example.hari.tnimageview.MainActivity">
  9. <ImageView
  10. android:id="@+id/tony"
  11. android:layout_width="180dp"
  12. android:layout_height="180dp"
  13. android:layout_alignParentEnd="true"
  14. android:layout_centerVertical="true"
  15. android:layout_marginEnd="92dp"
  16. android:scaleType="centerInside"
  17. android:src="@drawable/tony" />
  21. </RelativeLayout>
Step 6
Next, go to app >> java>>Mainactivity.java. Select Mainactivity page.
Android
Just type the code as follows.
Android
The code copy is here.
  1. package com.example.hari.tnimageview;
  3. import android.support.v7.app.AppCompatActivity;
  4. import android.os.Bundle;
  5. import android.widget.ImageView;
  7. import us.technerd.tnimageview.TNImageView;
  9. public class MainActivity extends AppCompatActivity {
  11. @Override
  12. protected void onCreate(Bundle savedInstanceState) {
  13. super.onCreate(savedInstanceState);
  14. setContentView(R.layout.activity_main);
  16. ImageView tony = (ImageView) findViewById(R.id.tony);
  18. TNImageView tnImage = new TNImageView();
  20. tnImage.makeRotatableScalable(tony);
  23. tnImage.bringToFrontOnTouch(true);;
  24. }
  25. }
Step 7
Verify the preview.
After the code is applied, the preview will appear like this.
Android
Step 8
Next, go to Android Studio and deploy the application. Select an Emulator or your Android mobile with USB debugging enabled. Give it a few seconds to make installations and set permissions.
Android
Run the application in your desired emulator (Shift + F10).
Android
Explanation of source code
The source code used in the activitymain.xml file will insert the image into the app and give the movement control to this image.

Summary

We created a new app named TN Image View and placed the image in the drawable folder. After that, we have inserted the Gradle dependencies into the build Gradle to get TN image view and verified the deployed output.