Shared element2 (#1012)

FadeIn ContentView and TopBar when pushing shared element screen

If the screen is pushed with `animated: false` then only TopBar is
animated in. This is a compromise until we expose means to control the
transition of each element on the screen.

android/app/src/main/java/com/reactnativenavigation/screens/FragmentScreen.java

@@ -31,6 +31,11 @@ public class FragmentScreen extends Screen {
         super(activity, screenParams, leftButtonOnClickListener);
     }
 
+    @Override
+    public ContentView getContentView() {
+        return contentView;
+    }
+
     @Override
     protected void createContent() {
         content = new FrameLayout(getContext());

android/app/src/main/java/com/reactnativenavigation/screens/Screen.java

@@ -25,6 +25,7 @@ import com.reactnativenavigation.params.StyleParams;
 import com.reactnativenavigation.params.TitleBarButtonParams;
 import com.reactnativenavigation.params.TitleBarLeftButtonParams;
 import com.reactnativenavigation.utils.ViewUtils;
+import com.reactnativenavigation.views.ContentView;
 import com.reactnativenavigation.views.LeftButtonOnClickListener;
 import com.reactnativenavigation.views.TopBar;
 import com.reactnativenavigation.views.sharedElementTransition.SharedElementTransition;
@@ -95,6 +96,12 @@ public abstract class Screen extends RelativeLayout implements Subscriber {
 
     protected abstract void createContent();
 
+    public abstract ContentView getContentView();
+
+    public TopBar getTopBar() {
+        return topBar;
+    }
+
     private void createTitleBar() {
         addTitleBarButtons();
         topBar.setTitle(screenParams.title);

android/app/src/main/java/com/reactnativenavigation/screens/ScreenAnimator.java

@@ -13,6 +13,9 @@ import com.reactnativenavigation.NavigationApplication;
 import com.reactnativenavigation.utils.ViewUtils;
 import com.reactnativenavigation.views.sharedElementTransition.SharedElementsAnimator;
 
+import java.util.ArrayList;
+import java.util.List;
+
 import javax.annotation.Nullable;
 
 class ScreenAnimator {
@@ -99,11 +102,41 @@ class ScreenAnimator {
     }
 
     void showWithSharedElementsTransitions(Runnable onAnimationEnd) {
+        hideContentViewAndTopBar();
         screen.setVisibility(View.VISIBLE);
-        new SharedElementsAnimator(this.screen.sharedElements).show(onAnimationEnd);
+        new SharedElementsAnimator(this.screen.sharedElements).show(new Runnable() {
+            @Override
+            public void run() {
+                animateContentViewAndTopBar(1, 280);
+            }
+        }, onAnimationEnd);
+    }
+
+    private void hideContentViewAndTopBar() {
+        if (screen.screenParams.animateScreenTransitions) {
+            screen.getContentView().setAlpha(0);
+        }
+        screen.getTopBar().setAlpha(0);
     }
 
     void hideWithSharedElementsTransition(Runnable onAnimationEnd) {
-        new SharedElementsAnimator(screen.sharedElements).hide(onAnimationEnd);
+        new SharedElementsAnimator(screen.sharedElements).hide(new Runnable() {
+            @Override
+            public void run() {
+                animateContentViewAndTopBar(0, 200);
+            }
+        }, onAnimationEnd);
+    }
+
+    private void animateContentViewAndTopBar(int alpha, int duration) {
+        List<Animator> animators = new ArrayList<>();
+        if (screen.screenParams.animateScreenTransitions) {
+            animators.add(ObjectAnimator.ofFloat(screen.getContentView(), View.ALPHA, alpha));
+        }
+        animators.add(ObjectAnimator.ofFloat(screen.getTopBar(), View.ALPHA, alpha));
+        AnimatorSet set = new AnimatorSet();
+        set.playTogether(animators);
+        set.setDuration(duration);
+        set.start();
     }
 }

android/app/src/main/java/com/reactnativenavigation/screens/ScreenStack.java

@@ -103,7 +103,6 @@ public class ScreenStack {
             if (nextScreen.screenParams.sharedElementsTransitions.isEmpty()) {
                 pushScreenToVisibleStack(layoutParams, nextScreen, previousScreen);
             } else {
-//                pushScreenToVisibleStack(layoutParams, nextScreen, previousScreen);
                 pushScreenToVisibleStackWithSharedElementTransition(layoutParams, nextScreen, previousScreen);
             }
         } else {

android/app/src/main/java/com/reactnativenavigation/screens/SingleScreen.java

@@ -22,6 +22,11 @@ public class SingleScreen extends Screen {
         addView(contentView, 0, createLayoutParams());
     }
 
+    @Override
+    public ContentView getContentView() {
+        return contentView;
+    }
+
     protected LayoutParams createLayoutParams() {
         LayoutParams params = new LayoutParams(MATCH_PARENT, MATCH_PARENT);
         if (screenParams.styleParams.drawScreenBelowTopBar) {

android/app/src/main/java/com/reactnativenavigation/screens/ViewPagerScreen.java

@@ -39,6 +39,11 @@ public class ViewPagerScreen extends Screen {
         getScreenParams().fabParams = fabParams;
     }
 
+    @Override
+    public ContentView getContentView() {
+        return contentViews.get(viewPager.getCurrentItem());
+    }
+
     @Override
     protected void createContent() {
         TopTabs topTabs = topBar.initTabs();

android/app/src/main/java/com/reactnativenavigation/views/sharedElementTransition/SharedElementsAnimator.java

@@ -14,12 +14,12 @@ public class SharedElementsAnimator {
         this.sharedElements = sharedElements;
     }
 
-    public void show(final Runnable onAnimationEnd) {
+    public void show(final Runnable onAnimationStart, final Runnable onAnimationEnd) {
         sharedElements.hideToElements();
         sharedElements.performWhenChildViewsAreDrawn(new Runnable()  {
             @Override
             public void run() {
-                final AnimatorSet animatorSet = createAnimatorSet();
+                final AnimatorSet animatorSet = createShowAnimators();
                 sharedElements.attachChildViewsToScreen();
                 sharedElements.showToElements(new Runnable() {
                     @Override
@@ -30,10 +30,15 @@ public class SharedElementsAnimator {
                 });
             }
 
-            private AnimatorSet createAnimatorSet() {
+            private AnimatorSet createShowAnimators() {
                 final AnimatorSet animatorSet = new AnimatorSet();
                 animatorSet.playTogether(createTransitionAnimators());
                 animatorSet.addListener(new AnimatorListenerAdapter() {
+                    @Override
+                    public void onAnimationStart(Animator animation) {
+                        onAnimationStart.run();
+                    }
+
                     @Override
                     public void onAnimationEnd(Animator animation) {
                         sharedElements.onShowAnimationEnd();
@@ -60,10 +65,15 @@ public class SharedElementsAnimator {
         });
     }
 
-    public void hide(final Runnable onAnimationEnd) {
+    public void hide(final Runnable onAnimationStart, final Runnable onAnimationEnd) {
         AnimatorSet animatorSet = new AnimatorSet();
         animatorSet.playTogether(createHideTransitionAnimators());
         animatorSet.addListener(new AnimatorListenerAdapter() {
+            @Override
+            public void onAnimationStart(Animator animation) {
+                onAnimationStart.run();
+            }
+
             @Override
             public void onAnimationEnd(Animator animation) {
                 sharedElements.showToElements();