How to Rotate an Image to a Certain Angle in Android?
Last Updated :
02 Feb, 2022
In Android, ImageView is used to display images. Images can be of any type and can be fetched locally or from a network. Images are displayed without any operations in the ImageView. However, images can be rotated to a certain angle and displayed in ImageView. So in this article, we will show you how you could rotate an image programmatically to an angle and display it in the ImageView in Android. Follow the below steps once the IDE is ready.
Step by Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. We demonstrated the application in Kotlin, so make sure you select Kotlin as the primary language while creating a New Project.
Step 2: Adding an image in res > drawable folder
Copy the image to the drawable folder in the resources folder as shown below.
Step 3: Working with the activity_main.xml file
Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. Add an ImageView to display the image, an EditText to input degrees (integer) to rotate and a Button to execute the rotation.
XML
<? xml version = "1.0" encoding = "utf-8" ?>
< RelativeLayout
android:layout_width = "match_parent"
android:layout_height = "match_parent"
tools:context = ".MainActivity" >
< ImageView
android:id = "@+id/image_view_1"
android:layout_width = "300sp"
android:layout_height = "300sp"
android:layout_centerHorizontal = "true"
android:layout_marginTop = "50sp"
android:src = "@drawable/img" />
< EditText
android:id = "@+id/edit_text_1"
android:layout_width = "50sp"
android:layout_height = "60sp"
android:inputType = "number"
android:layout_centerHorizontal = "true"
android:layout_below = "@id/image_view_1"
android:layout_marginTop = "100sp" />
< Button
android:id = "@+id/button_1"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:layout_centerHorizontal = "true"
android:layout_below = "@id/edit_text_1"
android:layout_marginTop = "20sp"
android:text = "rotate" />
</ RelativeLayout >
|
Step 4: Working with the MainActivity.kt file
Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.
Kotlin
package org.geeksforgeeks.programmaticallyrotateiv
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.EditText
import android.widget.ImageView
import android.widget.Toast
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super .onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val mImageView = findViewById<ImageView>(R.id.image_view_1)
val mEditText = findViewById<EditText>(R.id.edit_text_1)
val mButton = findViewById<Button>(R.id.button_1)
mButton.setOnClickListener {
if (mEditText.text.isNotEmpty()){
val mAngleRotate = (mEditText.text.toString() + "f" ).toFloat()
mImageView.rotation = mAngleRotate
} else {
Toast.makeText(applicationContext, "Field cannot be empty" , Toast.LENGTH_SHORT).show()
}
}
}
}
|
Output:
You can see that the rotated image is displayed.
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...