Merge pull request #2 from JonasWanke/feat/allow-non-opaque-backgrounds

Support non-opaque AppBar background colors
JonasWanke · May 27, 2020 · f4b10db · f4b10db
2 parents c503778 + 44f80a8
commit f4b10db
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 30 deletions.
diff --git a/lib/src/app_bar/bottom.dart b/lib/src/app_bar/bottom.dart
@@ -52,50 +52,48 @@ class AnimatedBottom extends AnimatedAppBarPart implements PreferredSizeWidget {
     final childStart = hasParent ? 0.5 : 0;
     return SizedBox(
       height: preferredHeight,
-      child: Stack(
-        children: <Widget>[
-          if (hasParent && t < parentEnd)
-            Positioned.fill(top: null, child: parent.appBar.bottom),
-          if (hasChild && t > childStart)
-            Positioned.fill(top: null, child: child.appBar.bottom),
-          Positioned.fill(
-            child: DecoratedBox(
-              decoration: BoxDecoration(
-                gradient: _buildScrimGradient(
-                  hasParent: hasParent,
-                  hasChild: hasChild,
-                ),
-              ),
-            ),
-          ),
-        ],
+      child: ShaderMask(
+        shaderCallback: (rect) => _buildScrimShader(
+          rect,
+          hasParent: hasParent,
+          hasChild: hasChild,
+        ),
+        blendMode: BlendMode.dstOut,
+        child: Stack(
+          children: <Widget>[
+            if (hasParent && t < parentEnd)
+              Positioned.fill(top: null, child: parent.appBar.bottom),
+            if (hasChild && t > childStart)
+              Positioned.fill(top: null, child: child.appBar.bottom),
+          ],
+        ),
       ),
     );
   }
 
-  Gradient _buildScrimGradient({
+  Shader _buildScrimShader(
+    Rect rect, {
     @required bool hasParent,
     @required bool hasChild,
   }) {
     final triangleT = math.min(t, 1 - t) * 2;
-    final backgroundColor = state.backgroundColor;
 
     return LinearGradient(
       begin: Alignment.topCenter,
       end: Alignment.bottomCenter,
       colors: [
         if (hasParent && hasChild)
-          backgroundColor.withOpacity(triangleT)
+          Colors.white.withOpacity(triangleT)
         else if (hasParent)
-          backgroundColor.withOpacity(t)
+          Colors.white.withOpacity(t)
         else if (hasChild)
-          backgroundColor.withOpacity(1 - t),
-        backgroundColor.withAlpha(0),
+          Colors.white.withOpacity(1 - t),
+        Colors.white.withAlpha(0),
       ],
       stops: [
         if (hasParent && hasChild) triangleT else 0.0,
         1,
       ],
-    );
+    ).createShader(rect);
   }
 }
diff --git a/lib/src/app_bar/state.dart b/lib/src/app_bar/state.dart
@@ -20,12 +20,8 @@ class MorphingState {
   final EndState child;
   final double t;
 
-  Color get backgroundColor {
-    assert(parent.backgroundColor.isOpaque);
-    assert(child.backgroundColor.isOpaque);
-
-    return Color.lerp(parent.backgroundColor, child.backgroundColor, t);
-  }
+  Color get backgroundColor =>
+      Color.lerp(parent.backgroundColor, child.backgroundColor, t);
 }
 
 @immutable