Fadeout translucent drawable when collapsing (#788)

* Fadeout translucent drawable when collapsing

* Change default scrim color to none
* Fade out translucent when collapsingToolBarCollapsedColor is not defined

android/app/src/main/java/com/reactnativenavigation/params/parsers/CollapsingTopBarParamsParser.java

@@ -1,6 +1,5 @@
 package com.reactnativenavigation.params.parsers;
 
-import android.graphics.Color;
 import android.os.Bundle;
 
 import com.reactnativenavigation.params.CollapsingTopBarParams;
@@ -33,7 +32,7 @@ class CollapsingTopBarParamsParser extends Parser {
         result.imageUri = params.getString("collapsingToolBarImage", null);
         result.reactViewId = params.getString("collapsingToolBarComponent", null);
         result.expendOnTopTabChange = params.getBoolean("expendCollapsingToolBarOnTopTabChange");
-        result.scrimColor = getColor(params, "collapsingToolBarCollapsedColor", new StyleParams.Color(Color.WHITE));
+        result.scrimColor = getColor(params, "collapsingToolBarCollapsedColor", new StyleParams.Color());
         result.showTitleWhenCollapsed = hasReactView;
         result.collapseBehaviour = getCollapseBehaviour();
         return result;

android/app/src/main/java/com/reactnativenavigation/views/TitleBar.java

@@ -88,7 +88,7 @@ public class TitleBar extends Toolbar {
 
     protected void setTranslucent(StyleParams params) {
         if (params.topBarTranslucent) {
-            setBackground(new TranslucentTitleBarBackground());
+            setBackground(new TranslucentDrawable());
         }
     }
 

android/app/src/main/java/com/reactnativenavigation/views/TranslucentAndSolidTitleBarBackground.java → android/app/src/main/java/com/reactnativenavigation/views/TitleBarBackground.java

@@ -6,15 +6,20 @@ import android.graphics.drawable.TransitionDrawable;
 
 import com.reactnativenavigation.params.StyleParams;
 
-public class TranslucentAndSolidTitleBarBackground extends TransitionDrawable {
+public class TitleBarBackground extends TransitionDrawable {
     private static final int DURATION = 200;
+
     private enum DrawableType {Translucent, Solid}
 
     private DrawableType displayedDrawable = DrawableType.Translucent;
 
-    public TranslucentAndSolidTitleBarBackground(StyleParams.Color color) {
+    TitleBarBackground(Drawable... drawables) {
+        super(drawables);
+    }
+
+    public TitleBarBackground(StyleParams.Color color) {
         super(new Drawable[] {
-                new TranslucentTitleBarBackground(),
+                new TranslucentDrawable(),
                 new ColorDrawable(color.getColor())
         });
     }

android/app/src/main/java/com/reactnativenavigation/views/TranslucentDrawable.java

@@ -0,0 +1,36 @@
+package com.reactnativenavigation.views;
+
+import android.graphics.Color;
+import android.graphics.LinearGradient;
+import android.graphics.Shader;
+import android.graphics.drawable.PaintDrawable;
+import android.graphics.drawable.ShapeDrawable;
+import android.graphics.drawable.shapes.RectShape;
+
+class TranslucentDrawable extends PaintDrawable {
+
+    TranslucentDrawable() {
+        setShape(new RectShape());
+        createShader();
+    }
+
+    private void createShader() {
+        ShapeDrawable.ShaderFactory sf = new ShapeDrawable.ShaderFactory() {
+            @Override
+            public Shader resize(int width, int height) {
+                double angleInRadians = Math.toRadians(90);
+
+                int x1 = (int) (Math.cos(angleInRadians) * width);
+                int y1 = (int) (Math.sin(angleInRadians) * height);
+                int[] colors = new int[]{Color.argb(90, 0, 0, 0), Color.argb(15, 0, 0, 0), Color.TRANSPARENT};
+                float[] positions = {0, 0.78f, 1};
+                LinearGradient lg = new LinearGradient(0, 0, x1, y1,
+                        colors,
+                        positions,
+                        Shader.TileMode.REPEAT);
+                return lg;
+            }
+        };
+        setShaderFactory(sf);
+    }
+}

android/app/src/main/java/com/reactnativenavigation/views/TranslucentTitleBarBackground.java

@@ -1,36 +1,11 @@
 package com.reactnativenavigation.views;
 
 import android.graphics.Color;
-import android.graphics.LinearGradient;
-import android.graphics.Shader;
-import android.graphics.drawable.PaintDrawable;
-import android.graphics.drawable.ShapeDrawable;
-import android.graphics.drawable.shapes.RectShape;
+import android.graphics.drawable.ColorDrawable;
 
-class TranslucentTitleBarBackground extends PaintDrawable {
-
-    TranslucentTitleBarBackground() {
-        setShape(new RectShape());
-        createShader();
-    }
-
-    private void createShader() {
-        ShapeDrawable.ShaderFactory sf = new ShapeDrawable.ShaderFactory() {
-            @Override
-            public Shader resize(int width, int height) {
-                double angleInRadians = Math.toRadians(90);
-
-                int x1 = (int) (Math.cos(angleInRadians) * width);
-                int y1 = (int) (Math.sin(angleInRadians) * height);
-                int[] colors = new int[]{Color.argb(90, 0, 0, 0), Color.argb(15, 0, 0, 0), Color.TRANSPARENT};
-                float[] positions = {0, 0.78f, 1};
-                LinearGradient lg = new LinearGradient(0, 0, x1, y1,
-                        colors,
-                        positions,
-                        Shader.TileMode.REPEAT);
-                return lg;
-            }
-        };
-        setShaderFactory(sf);
+public class TranslucentTitleBarBackground extends TitleBarBackground {
+    public TranslucentTitleBarBackground() {
+        super(new TranslucentDrawable(), new ColorDrawable(Color.TRANSPARENT));
+        setCrossFadeEnabled(true);
     }
 }

android/app/src/main/java/com/reactnativenavigation/views/collapsingToolbar/CollapsingTitleBar.java

@@ -1,7 +1,6 @@
 package com.reactnativenavigation.views.collapsingToolbar;
 
 import android.content.Context;
-import android.support.annotation.Nullable;
 import android.view.MotionEvent;
 import android.view.View;
 
@@ -9,14 +8,15 @@ import com.reactnativenavigation.params.CollapsingTopBarParams;
 import com.reactnativenavigation.params.StyleParams;
 import com.reactnativenavigation.utils.ViewUtils;
 import com.reactnativenavigation.views.TitleBar;
-import com.reactnativenavigation.views.TranslucentAndSolidTitleBarBackground;
+import com.reactnativenavigation.views.TitleBarBackground;
+import com.reactnativenavigation.views.TranslucentTitleBarBackground;
 
 public class CollapsingTitleBar extends TitleBar implements View.OnTouchListener {
     private CollapsingTextView title;
     private int collapsedHeight;
     private final ScrollListener scrollListener;
     private final CollapsingTopBarParams params;
-    private @Nullable TranslucentAndSolidTitleBarBackground titleBarBackground;
+    private TitleBarBackground titleBarBackground;
 
     public CollapsingTitleBar(Context context, int collapsedHeight, ScrollListener scrollListener, CollapsingTopBarParams params) {
         super(context);
@@ -45,17 +45,13 @@ public class CollapsingTitleBar extends TitleBar implements View.OnTouchListener
     @Override
     public void hideTitle() {
         super.hideTitle();
-        if (titleBarBackground != null) {
-            titleBarBackground.showTranslucentBackground();
-        }
+        titleBarBackground.showTranslucentBackground();
     }
 
     @Override
     public void showTitle() {
         super.showTitle();
-        if (titleBarBackground != null) {
-            titleBarBackground.showSolidBackground();
-        }
+        titleBarBackground.showSolidBackground();
     }
 
     private void addCollapsingTitle() {
@@ -92,12 +88,14 @@ public class CollapsingTitleBar extends TitleBar implements View.OnTouchListener
 
     @Override
     protected void setBackground(StyleParams params) {
-        if (hasTranslucentAndSolidBackground(params)) {
-            titleBarBackground = new TranslucentAndSolidTitleBarBackground(params.collapsingTopBarParams.scrimColor);
-            setBackground(titleBarBackground);
-        } else {
-            setTranslucent(params);
-        }
+        titleBarBackground = createBackground(params);
+        setBackground(titleBarBackground);
+    }
+
+    private TitleBarBackground createBackground(StyleParams params) {
+        return hasTranslucentAndSolidBackground(params) ?
+            new TitleBarBackground(params.collapsingTopBarParams.scrimColor) :
+            new TranslucentTitleBarBackground();
     }
 
     private boolean hasTranslucentAndSolidBackground(StyleParams params) {