Search code examples
androidanimationtransformationscalingtransition

How to animate, scale and transforme Views at same time in Android?


i want to achieve this and i have read the articles about the Scaling,Translation and animation but i don't how to do this i have tried to create two views and then trying to resize the both view both but in vain.

here is my View

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:id="@+id/parent"
android:weightSum="10"
tools:context="com.devandro.loginsignup.LandingPage">

<RelativeLayout
    android:id="@+id/loginFrame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_toRightOf="@+id/signUpFrame"
    android:background="@color/colorAccent"
    android:minWidth="80dp"
    android:onClick="viewLogin">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="30sp"
        android:rotation="0"
        android:text="Login"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />
</RelativeLayout>

<RelativeLayout
    android:id="@+id/signUpFrame"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_toLeftOf="@id/signUpFrame"
    android:background="@color/colorPrimary"
    android:minWidth="80dp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_marginBottom="30sp"
        android:gravity="center"
        android:onClick="viewSignup"
        android:rotation="270"
        android:text="Signup"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

</RelativeLayout>

  • Should i have to use Fragments instead of Views?
  • How to achieve the translation of text Views LogIn and SignUp?
  • How to animation of the Views like this?

Solution

  • I think the best approach is to use Scenes, but it requires Android 4.4.2 (API level 19) or higher. Just change Layout's weight property or try to use PercentRelativeLayout. You need to create 2 layouts (Scenes) and switch between them, and you don't have to handle all animations stuff manually.

    Also here's a library for Android Transitions API backward compatibility: Transitions Everywhere (if your project's min SDK is lower than 19).