Android: Background drawable not rotating when rotating ToggleButton

Question

I am currently working with a set of ToggleButtons with multiple state background resources, and rotation animation. Everything is working fine, until a toggle button is pressed, where this is happening:

When the button is focused, it get repaint, but on the original state, as it was on rotation 0.
When the button is released, it tries to repaint the new background with the true value background, but then the image width is cropped since is using the original toggle button height as width.
When the button is again focused, it happens the same issue as 1).
When the button is released, it get repaint correctly.

By far I now that the problem is that the original drawables are not rotated, hence this behavior. My current solution is to have three different Toggle buttons for each rotation to use (90°, 0°, -90°), animate and hide the current button, and then show the new button (using the same drawables and rotate them with XML tags), but I think is kind of cumbersome...

Here is the XML used for the 90° animation:

<rotate
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:interpolator="@android:anim/linear_interpolator"
  android:fromDegrees="0"
  android:toDegrees="90"
  android:pivotX="50%"
  android:pivotY="50%"
  android:duration="250"
  android:fillAfter="true"
  android:fillEnabled="true" >
</rotate>

The XML for the ToggleButton background:

<?xml version="1.0" encoding="utf-8"?>  
<selector xmlns:android="http://schemas.android.com/apk/res/android">  
 <item android:drawable="@drawable/record_button_on_pressed" 
    android:state_checked="true" android:state_pressed="true"/> 
 <item android:drawable="@drawable/record_button_pressed" android:state_checked="true" 
    android:state_focused="false"/> 
 <item android:drawable="@drawable/record_button_on_press" 
    android:state_checked="false" android:state_pressed="true"/> 
 <item android:drawable="@drawable/record_button" android:state_checked="false"
    android:state_focused="false"/>
</selector>

And the code used to rotate the view:

RotateAnimation rotate = (AnimationUtils.loadAnimation(this, 
    R.anim.rotation90deg);
startStopRecording.startAnimation(rotate);

Hope you guys can help me.

can you show how you're doing the rotation? if you rotate the button then the drawable should also be rotated. — Eluvatar
The drawable is correctly rotated, but when a focus or a state change is performed the view is shown wrong. Also added the corresponding code on the original question. — vicmns

vicmns vicmns · Accepted Answer · 2013-10-05T17:29:16

it appears that I was using the wrong approach. Pre 3.0 animations does not animate the current view, but it creates a Bitmap of such view and animate it; so in the end, the converted view is just an Image, ergo the behavior I was getting.

Anyways, by using android animator, I am capable of rotating and keeping the buttons rotated (the actual view) so the buttons (when pressed) are painted correctly. A little drawback is that you have to drop all pre 3.0 android devices. But, if you really need to gave support to such version, you can use the NineOldAndroid project.

Android: Background drawable not rotating when rotating ToggleButton

1 Answers