Rotating a view in a 2D plane
To rotate a view, we'll create a animation object from a xml file.
First, create a anim folder in /res directory.
Then right-click on the /res directory then navigate to new -> Animation resource file.
Name it view_rotate2d.xml.
Now paste the following code into the xml file:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:fromDegrees="0"
android:toDegrees="-360"
android:toYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2000" />
</set>
You now can use this file to perform rotate animation on the views to create a more presentable and dynamic application.
To apply this animation on the Views, AnimationUtils class is used like this:
Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_rotate2d);
view.startAnimation(rotateAnimation);
This will trigger the animation and view will be rotated along with the properties mentioned in view_rotate2D.xml file.
Rotating a view in a 3D plane
To rotate a view in 3D plane , we'll use ObjectAnimator class.
We'll create a ObjectAnimator object for rotation in xml file.
First, create a animator folder in /res directory.
Then right-click on the /res directory then navigate to new -> Animator resource file.
Name it view_rotate3D.xml.
Now paste the following code into the xml file:
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="rotationY"
android:duration="1000"
android:valueFrom="0"
android:valueTo="360"
android:valueType="floatType"/>
Now you can use ObjectAnimator on the view using AnimatorInflater class.
Paste the following code to create a 3D animaton effect on the view:
Animation rotateAnim = AnimationUtils.loadAnimation(this, R.anim.view_rotate3d);
view.startAnimation(rotateAnim);
This is the simple example for rotation animation. You can also create Animation and Animator object at the runtime and define the properties there.
You can also add more properties on both animations to perform an effect as per your requirement.
0 Comment(s)