Animation in images

Asked

Viewed 185 times

5

Is there any way to make an image rotate by, say, 90 degrees when clicked on? I want that when clicking on the image, it takes a turn, like a clock pointer for example.

3 answers

4


Only animate().rotation(angle).start() within the method setOnClickListener of your button would already solve the problem. So, just set a value for the variable angle, which would refer to the desired angle. See:

int angle = 90;
imageView.animate().rotation(angle).start();

1

Use the method View##Setrotation() of the component itself Imageview.

imageView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {                  
        imageView.setRotation(90);
    }
});

The 90 can be any value, and if you want to add a rotation, ie take the current rotation of the view and apply one more value, just take the rotation with getRotation and add your value.

imageView.setRotation(imageView.getRotation() + valor);

If its rotation is 90, the new rotation will be 180 and so on.

Obs: As the author of the post said, this method only applies a rotation on the image, it does not cause there to be an animation in it.


To rotate the image with an animation, you can use the Linearinterpolator

imageView.animate().rotationBy(90).setDuration(300).setInterpolator(new LinearInterpolator()).start();

Where:

  • rotationBy(): is the target rotation of the view, or with which rotation it will stay at the end of the duration.
  • setDuration(): as the name says, it is the duration that the rotation will have.
  • setInterpolator(): is basically how the animation will behave.

You can use other attributes, such as withStartAction, as its name says, when the animation starts, it allows you to apply an action in the view, for example, apply an animation in another view or in the view itself.

imageView.animate().rotationBy(90).withStartAction(new Runnable(){
    public void run(){
       imageView.setRotation(90);
    }
}).setDuration(300).setInterpolator(new LinearInterpolator());
  • That way the image will just spin, without any animation.

  • Ah, vdd, I’ll add something else. I got it wrong. D

  • @Iamluc but so have no animation that is what you are asking in the question.

  • 1

    Thank you! I edited the question! :)

1

1st solution (simple)

In the method onClick from your image, add the following code:

imageView.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View v) {
        imageView.animate().rotation(90).start();
    }
});

2nd solution (more options)

Create the file button_rotate.xml in the briefcase anim within your project:

<?xml version="1.0" encoding="utf-8"?>   
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/animation"
    android:duration="1000"
    android:fromDegrees="0"
    android:interpolator="@android:anim/linear_interpolator"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="90" />

Now create the animation in your Java class, more precisely, within the method onClick of your image:

/* Pega a sua ImageView*/
ImageView iv = (ImageView) view.findViewById(R.id.your_image_view);

/* Cria a animação */
Animation rotation = AnimationUtils.loadAnimation(context, R.anim.animation);
rotation.setRepeatCount(Animation.INFINITE);

/* Inicia a animação */
iv.startAnimation(rotation);

To stop the animation:

iv.clearAnimation();

Translated and adapted from: Rotate image

Browser other questions tagged

You are not signed in. Login or sign up in order to post.