Bläddra i källkod

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.
Guy Carmeli 7 år sedan
förälder
incheckning
b8b0e0bad6

+ 5
- 0
android/app/src/main/java/com/reactnativenavigation/screens/FragmentScreen.java Visa fil

@@ -31,6 +31,11 @@ public class FragmentScreen extends Screen {
31 31
         super(activity, screenParams, leftButtonOnClickListener);
32 32
     }
33 33
 
34
+    @Override
35
+    public ContentView getContentView() {
36
+        return contentView;
37
+    }
38
+
34 39
     @Override
35 40
     protected void createContent() {
36 41
         content = new FrameLayout(getContext());

+ 7
- 0
android/app/src/main/java/com/reactnativenavigation/screens/Screen.java Visa fil

@@ -25,6 +25,7 @@ import com.reactnativenavigation.params.StyleParams;
25 25
 import com.reactnativenavigation.params.TitleBarButtonParams;
26 26
 import com.reactnativenavigation.params.TitleBarLeftButtonParams;
27 27
 import com.reactnativenavigation.utils.ViewUtils;
28
+import com.reactnativenavigation.views.ContentView;
28 29
 import com.reactnativenavigation.views.LeftButtonOnClickListener;
29 30
 import com.reactnativenavigation.views.TopBar;
30 31
 import com.reactnativenavigation.views.sharedElementTransition.SharedElementTransition;
@@ -95,6 +96,12 @@ public abstract class Screen extends RelativeLayout implements Subscriber {
95 96
 
96 97
     protected abstract void createContent();
97 98
 
99
+    public abstract ContentView getContentView();
100
+
101
+    public TopBar getTopBar() {
102
+        return topBar;
103
+    }
104
+
98 105
     private void createTitleBar() {
99 106
         addTitleBarButtons();
100 107
         topBar.setTitle(screenParams.title);

+ 35
- 2
android/app/src/main/java/com/reactnativenavigation/screens/ScreenAnimator.java Visa fil

@@ -13,6 +13,9 @@ import com.reactnativenavigation.NavigationApplication;
13 13
 import com.reactnativenavigation.utils.ViewUtils;
14 14
 import com.reactnativenavigation.views.sharedElementTransition.SharedElementsAnimator;
15 15
 
16
+import java.util.ArrayList;
17
+import java.util.List;
18
+
16 19
 import javax.annotation.Nullable;
17 20
 
18 21
 class ScreenAnimator {
@@ -99,11 +102,41 @@ class ScreenAnimator {
99 102
     }
100 103
 
101 104
     void showWithSharedElementsTransitions(Runnable onAnimationEnd) {
105
+        hideContentViewAndTopBar();
102 106
         screen.setVisibility(View.VISIBLE);
103
-        new SharedElementsAnimator(this.screen.sharedElements).show(onAnimationEnd);
107
+        new SharedElementsAnimator(this.screen.sharedElements).show(new Runnable() {
108
+            @Override
109
+            public void run() {
110
+                animateContentViewAndTopBar(1, 280);
111
+            }
112
+        }, onAnimationEnd);
113
+    }
114
+
115
+    private void hideContentViewAndTopBar() {
116
+        if (screen.screenParams.animateScreenTransitions) {
117
+            screen.getContentView().setAlpha(0);
118
+        }
119
+        screen.getTopBar().setAlpha(0);
104 120
     }
105 121
 
106 122
     void hideWithSharedElementsTransition(Runnable onAnimationEnd) {
107
-        new SharedElementsAnimator(screen.sharedElements).hide(onAnimationEnd);
123
+        new SharedElementsAnimator(screen.sharedElements).hide(new Runnable() {
124
+            @Override
125
+            public void run() {
126
+                animateContentViewAndTopBar(0, 200);
127
+            }
128
+        }, onAnimationEnd);
129
+    }
130
+
131
+    private void animateContentViewAndTopBar(int alpha, int duration) {
132
+        List<Animator> animators = new ArrayList<>();
133
+        if (screen.screenParams.animateScreenTransitions) {
134
+            animators.add(ObjectAnimator.ofFloat(screen.getContentView(), View.ALPHA, alpha));
135
+        }
136
+        animators.add(ObjectAnimator.ofFloat(screen.getTopBar(), View.ALPHA, alpha));
137
+        AnimatorSet set = new AnimatorSet();
138
+        set.playTogether(animators);
139
+        set.setDuration(duration);
140
+        set.start();
108 141
     }
109 142
 }

+ 0
- 1
android/app/src/main/java/com/reactnativenavigation/screens/ScreenStack.java Visa fil

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

+ 5
- 0
android/app/src/main/java/com/reactnativenavigation/screens/SingleScreen.java Visa fil

@@ -22,6 +22,11 @@ public class SingleScreen extends Screen {
22 22
         addView(contentView, 0, createLayoutParams());
23 23
     }
24 24
 
25
+    @Override
26
+    public ContentView getContentView() {
27
+        return contentView;
28
+    }
29
+
25 30
     protected LayoutParams createLayoutParams() {
26 31
         LayoutParams params = new LayoutParams(MATCH_PARENT, MATCH_PARENT);
27 32
         if (screenParams.styleParams.drawScreenBelowTopBar) {

+ 5
- 0
android/app/src/main/java/com/reactnativenavigation/screens/ViewPagerScreen.java Visa fil

@@ -39,6 +39,11 @@ public class ViewPagerScreen extends Screen {
39 39
         getScreenParams().fabParams = fabParams;
40 40
     }
41 41
 
42
+    @Override
43
+    public ContentView getContentView() {
44
+        return contentViews.get(viewPager.getCurrentItem());
45
+    }
46
+
42 47
     @Override
43 48
     protected void createContent() {
44 49
         TopTabs topTabs = topBar.initTabs();

+ 14
- 4
android/app/src/main/java/com/reactnativenavigation/views/sharedElementTransition/SharedElementsAnimator.java Visa fil

@@ -14,12 +14,12 @@ public class SharedElementsAnimator {
14 14
         this.sharedElements = sharedElements;
15 15
     }
16 16
 
17
-    public void show(final Runnable onAnimationEnd) {
17
+    public void show(final Runnable onAnimationStart, final Runnable onAnimationEnd) {
18 18
         sharedElements.hideToElements();
19 19
         sharedElements.performWhenChildViewsAreDrawn(new Runnable()  {
20 20
             @Override
21 21
             public void run() {
22
-                final AnimatorSet animatorSet = createAnimatorSet();
22
+                final AnimatorSet animatorSet = createShowAnimators();
23 23
                 sharedElements.attachChildViewsToScreen();
24 24
                 sharedElements.showToElements(new Runnable() {
25 25
                     @Override
@@ -30,10 +30,15 @@ public class SharedElementsAnimator {
30 30
                 });
31 31
             }
32 32
 
33
-            private AnimatorSet createAnimatorSet() {
33
+            private AnimatorSet createShowAnimators() {
34 34
                 final AnimatorSet animatorSet = new AnimatorSet();
35 35
                 animatorSet.playTogether(createTransitionAnimators());
36 36
                 animatorSet.addListener(new AnimatorListenerAdapter() {
37
+                    @Override
38
+                    public void onAnimationStart(Animator animation) {
39
+                        onAnimationStart.run();
40
+                    }
41
+
37 42
                     @Override
38 43
                     public void onAnimationEnd(Animator animation) {
39 44
                         sharedElements.onShowAnimationEnd();
@@ -60,10 +65,15 @@ public class SharedElementsAnimator {
60 65
         });
61 66
     }
62 67
 
63
-    public void hide(final Runnable onAnimationEnd) {
68
+    public void hide(final Runnable onAnimationStart, final Runnable onAnimationEnd) {
64 69
         AnimatorSet animatorSet = new AnimatorSet();
65 70
         animatorSet.playTogether(createHideTransitionAnimators());
66 71
         animatorSet.addListener(new AnimatorListenerAdapter() {
72
+            @Override
73
+            public void onAnimationStart(Animator animation) {
74
+                onAnimationStart.run();
75
+            }
76
+
67 77
             @Override
68 78
             public void onAnimationEnd(Animator animation) {
69 79
                 sharedElements.showToElements();