Flip Your Views (Image, Button,Text, etc.)
Flipping a view makes a nice effect on your game or app. Sometimes it’s a bit hard to find a good implementation on the internet that explains exactly what you want.
But today I will show you how to make the two views flip together. It will explain you how to flip a view when user clicks on it. Follow the steps below:
Step1:) Create an android project in your android IDE.
Step2:) Create a layout with the views you wanted to flip it could be any view such as a text view, an image viewer or a whole layout.
Write following code into the layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/mainlayout" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:orientation="vertical" > <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Flip This View" android:textSize="28dp" android:textStyle="bold" /> <Button android:id="@+id/buttonflip" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Flip Button View" /> <ImageView android:id="@+id/image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_launcher" /> </LinearLayout>
Step3:) Write following code into your main activity file:
package com.example.flipviewexample;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.animation.ObjectAnimator;
import android.os.Bundle;
public class MainActivity extends ActionBarActivity {
LinearLayout mainLayout;
TextView textTitle;
Button buttonFlip;
ImageView image;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mainLayout = (LinearLayout)findViewById(R.id.mainlayout);
mainLayout.setOnClickListener(MyOnClickListener);
textTitle = (TextView)findViewById(R.id.title);
textTitle.setOnClickListener(MyOnClickListener);
buttonFlip = (Button)findViewById(R.id.buttonflip);
buttonFlip.setOnClickListener(MyOnClickListener);
image = (ImageView)findViewById(R.id.image);
image.setOnClickListener(MyOnClickListener);
}
OnClickListener MyOnClickListener = new OnClickListener(){
@Override
public void onClick(View v) {
flipIt(v);
}
};
private void flipIt(final View viewToFlip) {
ObjectAnimator flip = ObjectAnimator.ofFloat(viewToFlip, "rotationX", 0f, 360f);
flip.setDuration(3000);
flip.start();
}
}
We have used ObjectAnimator to flip the views. Typically the ObjectAnimator class is used to modify the attributes of an object.
Step4:) Run for the output below:
Related Posts
Top 10 Android App Development Trends | 2020 Guide
5 Best Resources to Get Started with Android Nougat
Android Studio Introduction
Services – An Android Component
Applying MediaCodec On An Open Source Android Audio Player
5 Most Used Android Testing Frameworks
Android Language Highlights A Developers Perspective
Android KitKat Development