Added appeal and unnappear effect on the second layout

saulmm · Oct 17, 2014 · 901d62c · 901d62c
1 parent a74b19e
commit 901d62c
Show file tree

Hide file tree

Showing 12 changed files with 254 additions and 84 deletions.
diff --git a/app/src/main/java/com/saulmm/material/AnimListener.java b/app/src/main/java/com/saulmm/material/AnimListener.java
@@ -0,0 +1,25 @@
+package com.saulmm.material;
+
+import android.animation.Animator;
+
+public class AnimListener implements Animator.AnimatorListener {
+    @Override
+    public void onAnimationStart(Animator animator) {
+
+    }
+
+    @Override
+    public void onAnimationEnd(Animator animator) {
+
+    }
+
+    @Override
+    public void onAnimationCancel(Animator animator) {
+
+    }
+
+    @Override
+    public void onAnimationRepeat(Animator animator) {
+
+    }
+}
diff --git a/app/src/main/java/com/saulmm/material/MyActivity.java b/app/src/main/java/com/saulmm/material/MyActivity.java
@@ -3,26 +3,12 @@
 import android.app.Activity;
 import android.app.ActivityOptions;
 import android.content.Intent;
-import android.graphics.Outline;
 import android.os.Bundle;
-import android.transition.CircularPropagation;
-import android.transition.Explode;
-import android.transition.Scene;
-import android.transition.Slide;
-import android.transition.TransitionManager;
 import android.util.Pair;
-import android.view.Menu;
 import android.view.View;
-import android.widget.FrameLayout;
-import android.widget.Toast;
-
-import com.saulmm.material.R;
-
 
 public class MyActivity extends Activity {
 
-    private FrameLayout frameContainer;
-    private View holderView;
     private View fabButton;
 
     @Override
@@ -31,22 +17,13 @@ protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_my);
 
-        Utils.configureWindowEnterExitTransition(getWindow());;
+        // Set explode animation when enter and exit the activity
+        Utils.configureWindowEnterExitTransition(getWindow());
 
         // Fab Button
-        int fabSize = getResources().getDimensionPixelSize(R.dimen.fab_size);
-        Outline fabOutLine = new Outline();
-        fabOutLine.setOval(0, 0, fabSize, fabSize);
-
-        // Fragment container
-        frameContainer = (FrameLayout) findViewById(R.id.container);
-
-        holderView = findViewById(R.id.holder_view);
-
-        // FabView
         fabButton = findViewById(R.id.fab_button);
         fabButton.setOnClickListener(fabClickListener);
-        fabButton.setOutline(fabOutLine);
+        Utils.configureFab(fabButton);
     }
 
 
@@ -55,7 +32,11 @@ protected void onCreate(Bundle savedInstanceState) {
         public void onClick(View view) {
 
         Intent i  = new Intent (MyActivity.this, MyActivity2.class);
-        startActivity(i);
+
+        ActivityOptions transitionActivityOptions = ActivityOptions.makeSceneTransitionAnimation(MyActivity.this,
+                Pair.create(fabButton, "fab"));
+
+        startActivity(i, transitionActivityOptions.toBundle());
         }
     };
 }
diff --git a/app/src/main/java/com/saulmm/material/MyActivity2.java b/app/src/main/java/com/saulmm/material/MyActivity2.java
@@ -1,5 +1,7 @@
 package com.saulmm.material;
 
+import android.animation.Animator;
+import android.animation.LayoutTransition;
 import android.app.Activity;
 import android.app.Fragment;
 import android.graphics.Outline;
@@ -9,39 +11,86 @@
 import android.transition.Explode;
 import android.transition.Scene;
 import android.transition.Slide;
+import android.transition.Transition;
 import android.transition.TransitionManager;
 import android.view.Menu;
 import android.view.MenuItem;
+import android.view.View;
+import android.view.ViewGroup;
+import android.view.ViewPropertyAnimator;
 import android.widget.FrameLayout;
+import android.widget.LinearLayout;
 
 import com.saulmm.material.R;
 
 public class MyActivity2 extends Activity {
 
-    private FrameLayout frameContainer;
+    private static final int NUM_VIEWS = 5;
+    private static final int SCALE_ITEM_ANIMATION_DELAY = 30;
+    private LinearLayout rowContainer;
 
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
+
         setContentView(R.layout.activity_my2);
 
-        // Fab Button
-        int fabSize = getResources().getDimensionPixelSize(R.dimen.fab_size);
-        Outline fabOutLine = new Outline();
+        rowContainer = (LinearLayout) findViewById(R.id.row_container2);
 
         Utils.configureWindowEnterExitTransition(getWindow());
 
-        fabOutLine.setOval(0, 0, fabSize, fabSize);
+        getWindow().getEnterTransition().addListener(new Transition.TransitionListener() {
+            @Override
+            public void onTransitionStart(Transition transition) {}
+
+            @Override
+            public void onTransitionCancel(Transition transition) {}
+
+            @Override
+            public void onTransitionPause(Transition transition) {}
+
+            @Override
+            public void onTransitionResume(Transition transition) {}
+
+            @Override
+            public void onTransitionEnd(Transition transition) {
+                getWindow().getEnterTransition().removeListener(this);
+
+                for (int i = 0; i < rowContainer.getChildCount(); i++) {
+
+                    View rowView = rowContainer.getChildAt(i);
+                    rowView.animate().setStartDelay(i * SCALE_ITEM_ANIMATION_DELAY)
+                            .scaleX(1).scaleY(1);
+                }
+            }
+        });
     }
 
     @Override
-    protected void onResume() {
+    public void onBackPressed() {
+
+        for (int i = 0; i < rowContainer.getChildCount(); i++) {
+
+            View rowView = rowContainer.getChildAt(i);
+            ViewPropertyAnimator propertyAnimator = rowView.animate().setStartDelay(i * SCALE_ITEM_ANIMATION_DELAY)
+                .scaleX(0).scaleY(0);
+
+            propertyAnimator.setListener(new Animator.AnimatorListener() {
+                @Override
+                public void onAnimationStart(Animator animator) {}
+
+                @Override
+                public void onAnimationEnd(Animator animator) {
 
-        super.onResume();
+                    finishAfterTransition();
+                }
 
-        frameContainer = (FrameLayout) findViewById(R.id.container);
+                @Override
+                public void onAnimationCancel(Animator animator) {}
 
-        Scene scene1 = Scene.getSceneForLayout(frameContainer, R.layout.activity_my_activity2, this);
-        TransitionManager.go(scene1, new Explode());
+                @Override
+                public void onAnimationRepeat(Animator animator) {}
+            });
+        }
     }
 }
diff --git a/app/src/main/java/com/saulmm/material/Utils.java b/app/src/main/java/com/saulmm/material/Utils.java
@@ -1,24 +1,29 @@
 package com.saulmm.material;
 
-import android.transition.CircularPropagation;
+import android.graphics.Outline;
 import android.transition.Explode;
+import android.transition.Slide;
+import android.view.View;
 import android.view.Window;
+import android.view.animation.PathInterpolator;
 
-/**
- * Created by saulmm on 16/10/14.
- */
 public class Utils {
 
     public static void configureWindowEnterExitTransition (Window w) {
 
         Explode ex = new Explode();
+        ex.setInterpolator(new PathInterpolator(0.4f, 0, 1, 1));
+        w.setExitTransition(ex);
+        w.setEnterTransition(ex);
+    }
 
-        CircularPropagation c = new CircularPropagation();
-        c.setPropagationSpeed(2f);
+    public static void configureFab (View fabButton) {
 
-        ex.setPropagation(c);
+        int fabSize = fabButton.getContext().getResources()
+            .getDimensionPixelSize(R.dimen.fab_size);
 
-        w.setExitTransition(ex);
-        w.setEnterTransition(ex);
+        Outline fabOutLine = new Outline();
+        fabOutLine.setOval(0, 0, fabSize, fabSize);
+        fabButton.setOutline(fabOutLine);
     }
 }
diff --git a/app/src/main/res/layout/activity_hierarchical_timing.xml b/app/src/main/res/layout/activity_hierarchical_timing.xml
@@ -0,0 +1,97 @@
+<LinearLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
+              android:paddingRight="@dimen/activity_horizontal_margin"
+              android:paddingTop="@dimen/activity_vertical_margin"
+              android:paddingBottom="@dimen/activity_vertical_margin"
+              android:orientation="vertical"
+              tools:context="emmaguy.l.timing.HierarchicalTimingActivity">
+
+    <LinearLayout
+        android:id="@+id/row_container"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:gravity="center"
+        android:orientation="vertical">
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_1"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_2"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_3"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_4"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_5"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_6"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_7"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+        <View
+            android:layout_width="match_parent"
+            android:layout_marginTop="5dp"
+            android:layout_height="64dp"
+            android:id="@+id/view_8"
+            android:scaleX="0"
+            android:scaleY="0"
+            android:background="@color/accent"/>
+
+    </LinearLayout>
+
+</LinearLayout>