Zoom In and Zoom Out animations are used to enlarge and reduce the size of a view in Android applications respectively. These types of animations are often used by developers to provide a dynamic nature to the applications. Users also feel the changes happening in the application by watching these kinds of animations.
XML Attributes of Scale Tag
The characteristics of Zoom In and Zoom Out animations are defined in the XML files by using scale tag.
|android:duration||Used to define the duration of the animation in millisecond|
|android:fromXScale||Used to set initial size of the view in X-axis|
|android:fromYScale||Used to set initial size of the view in Y-axis|
|android:pivotX||To define the X coordinate of the point about which the object is being zoom in/out|
|android:pivotY||To define the Y coordinate of the point about which the object is being zoom in/out|
|android:toXScale||Used to set final size of the view in X-axis|
|android:toYScale||Used to set final size of the view in Y-axis|
How to Add Zoom In/Out Animation in Android
The following example demonstrates the steps involved in implementing Zoom In and Zoom Out animation to an image file. An image file will be added in the activity using ImageView.
Note: Following steps are performed on Android Studio version 4.0
Step 1: Create new project
- Click on File, then New => New Project.
- Select language as Kotlin.
- Select the minimum SDK as per your need.
Step 2: Modify activity_main.xml file
Step 3: Define XML file for Zoom In and Zoom Out animation of the image
Create a new directory in the res folder of the application through right-click on res => New => Android Resource Directory. Select Resource Type as anim and Directory name should also be anim. In this directory create 2 Animation Resource File namely zoom_in and zoom_out. These 2 files are the XML file which holds the details of the animation. Below is the code for both the file.
android:fillAfterattribute under set tag is used to fix the final size of the image file until any other animation happens.
Step 4: Modify MainActivity.kt file
Below is the code for
MainActivity.kt file to load and start the animation on the ImageView widget according to the button clicked by the user.
Step 5: Modify strings.xml file
All the strings which are used in the activity are listed in this file.
Output: Run on Emulator
- How to implement Swipe Down to Refresh in Android using Android Studio
- Android Fade In/Out in Kotlin
- How to implement View Shaker in Android
- How to implement Picture in Picture (PIP) in Android?
- How to implement Options Menu in Android
- How to implement Dark (Night) mode in Android app
- How to implement a TabLayout in Android using ViewPager and Fragments
- Implement customized TimePicker in Android using SnapTimePicker
- Implement reverse AnimatedVectorDrawables using MorphView in Android
- How to Implement Press Back Again to Exit in Android?
- Android | AdMob Banner Ads for Android Studio
- Android | Android Application File Structure
- Android | AdMob Interstitial Ads for Android Studio
- Android | How to Create/Start a New Project in Android Studio?
- Android | Running your first Android app
- Android | How to add Radio Buttons in an Android Application?
- Android | How to Request permissions in Android Application?
- Difference between Android 1.1 and Android 4.0.1
- Difference between Android 1.1 and Android 2.3.4
- Difference between Android 1.0 and Android 1.1
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.