Rotate an ImageButton on Android

1

In the header of my NavigationView I created a ImageButton that when you click on it, change the menu that appears in NavigationView . This task works perfectly, but I want that when you press this ImageButton , the image that you have inside, turn 90º and when you press again, return to the original position. All this with an animation.

The final result would be the following:

I tried to create it in the following way, but there is no way to make it work.

A small point to note is that I think the problem arises when introducing the animation within event onClick() , because outside of that event, it works perfectly.

nav_header.xml : It is the header of NavigationView .

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="180dp"
    android:background="@color/colorPrimary"
    android:gravity="bottom"
    android:orientation="vertical"
    android:padding="16dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

        <TextView
            android:id="@+id/admin"
            android:gravity="center_vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="5dp"
            android:textSize="16sp"
            android:text="Administración"
            android:textColor="@android:color/white"
            android:textStyle="bold"
            android:layout_weight="1"/>

        <ImageButton
            android:layout_width="match_parent"
            android:layout_gravity="bottom"
            android:layout_height="30dp"
            android:id="@+id/select_menu"
            android:src="@drawable/arrow_bottom"
            android:layout_weight="5"
            android:background="@color/colorPrimary"/>

</LinearLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity {

private DrawerLayout drawerLayout;
private NavigationView navView;
private View header;
private ImageButton selectMenu;
private TextView admin;
private Animation left_90, bottom_90;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    navView = (NavigationView) findViewById(R.id.nav_view);
    left_90 = AnimationUtils.loadAnimation(this, R.anim.rotate_90left);
    bottom_90 = AnimationUtils.loadAnimation(this, R.anim.rotate_90bottom);

    if (navView != null) {
        header = navView.getHeaderView(0);
        selectMenu = (ImageButton) header.findViewById(R.id.select_menu);
        admin = (TextView) header.findViewById(R.id.admin);
        selectMenu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (admin.getText().equals("Administración")){
                    v.startAnimation(left_90);
                    navView.getMenu().clear();
                    navView.inflateMenu(R.menu.nav_menu_admin);
                    admin.setText("Volver");
                } else if (admin.getText().equals("Volver")) {
                    v.startAnimation(bottom_90);
                    navView.getMenu().clear();
                    navView.inflateMenu(R.menu.nav_menu_study);
                    admin.setText("Administración");
                }
            }
        });
        selectItemNavigationView(navView);
        selectItem(navView.getMenu().getItem(0));
    }

}
}

rotate_90left.xml : This file will apply the effect of 90º of rotation towards the clockwise:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <rotate
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="90"
        android:duration="1000"/>
</set>

rotate_90bottom.xml : This file will apply the effect of 90º of rotation towards the anti-clockwise direction:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <rotate
        android:fromDegrees="90"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="0"
        android:duration="1000"/>
</set>
    
asked by Vicky Vicent 31.05.2016 в 18:45
source

2 answers

2

Well look, in my personal case I no longer use animations from XML because from version 4.X you can use the ViewPropertyAnimator. An example of rotation with this property is the following:

View.animate().rotation(90).setDuration(2000);

Where "view" would be the ImageButton you want to rotate.

    
answered by 31.05.2016 / 19:02
source
0

Within onClick()

usa:

selectMenu.startAnimation(left_90);

and

selectMenu.startAnimation(bottom_90);

that is:

 selectMenu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (admin.getText().equals("Administración")){
                    selectMenu.startAnimation(left_90);
                    navView.getMenu().clear();
                    navView.inflateMenu(R.menu.nav_menu_admin);
                    admin.setText("Volver");
                } else if (admin.getText().equals("Volver")) {
                    selectMenu.startAnimation(bottom_90);
                    navView.getMenu().clear();
                    navView.inflateMenu(R.menu.nav_menu_study);
                    admin.setText("Administración");
                }
            }
        });
    
answered by 31.05.2016 в 19:07