Skip to content

Commit 86710ba

Browse files
committed
inset_shadow: Implement start/end shadows, not just top/bottom
1 parent bcb5fc5 commit 86710ba

File tree

2 files changed

+50
-5
lines changed

2 files changed

+50
-5
lines changed

lib/widgets/inset_shadow.dart

Lines changed: 19 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ class InsetShadowBox extends StatelessWidget {
1717
super.key,
1818
this.top = 0,
1919
this.bottom = 0,
20+
this.start = 0,
21+
this.end = 0,
2022
required this.color,
2123
required this.child,
2224
});
@@ -31,7 +33,17 @@ class InsetShadowBox extends StatelessWidget {
3133
/// This does not pad the child widget.
3234
final double bottom;
3335

34-
/// The shadow color to fade into transparency from the top and bottom borders.
36+
/// The distance that the shadow from the child's start edge grows endwards.
37+
///
38+
/// This does not pad the child widget.
39+
final double start;
40+
41+
/// The distance that the shadow from the child's end edge grows startwards.
42+
///
43+
/// This does not pad the child widget.
44+
final double end;
45+
46+
/// The shadow color to fade into transparency from the edges, inward.
3547
final Color color;
3648

3749
final Widget child;
@@ -50,10 +62,14 @@ class InsetShadowBox extends StatelessWidget {
5062
fit: StackFit.passthrough,
5163
children: [
5264
child,
53-
Positioned(top: 0, height: top, left: 0, right: 0,
65+
if (top != 0) Positioned(top: 0, height: top, left: 0, right: 0,
5466
child: DecoratedBox(decoration: _shadowFrom(Alignment.topCenter))),
55-
Positioned(bottom: 0, height: bottom, left: 0, right: 0,
67+
if (bottom != 0) Positioned(bottom: 0, height: bottom, left: 0, right: 0,
5668
child: DecoratedBox(decoration: _shadowFrom(Alignment.bottomCenter))),
69+
if (start != 0) PositionedDirectional(start: 0, width: start, top: 0, bottom: 0,
70+
child: DecoratedBox(decoration: _shadowFrom(AlignmentDirectional.centerStart))),
71+
if (end != 0) PositionedDirectional(end: 0, width: end, top: 0, bottom: 0,
72+
child: DecoratedBox(decoration: _shadowFrom(AlignmentDirectional.centerEnd))),
5773
]);
5874
}
5975
}

test/widgets/inset_shadow_test.dart

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ void main() {
1616
// to ease the check on [Rect] later.
1717
alignment: Alignment.topLeft,
1818
child: SizedBox(width: 20, height: 20,
19-
child: InsetShadowBox(top: 7, bottom: 3,
19+
child: InsetShadowBox(top: 7, bottom: 3, start: 5, end: 6,
2020
color: Colors.red,
2121
child: SizedBox.shrink())))));
2222

@@ -42,7 +42,7 @@ void main() {
4242
};
4343
}
4444

45-
testWidgets('render shadow correctly', (tester) async {
45+
testWidgets('render shadow correctly: top/bottom', (tester) async {
4646
await tester.pumpWidget(const Directionality(
4747
textDirection: TextDirection.ltr,
4848
child: Center(
@@ -61,4 +61,33 @@ void main() {
6161
..something(paintGradient(rect: const Rect.fromLTRB(0, 100-7, 100, 100)))
6262
) as Matcher);
6363
});
64+
65+
final textDirectionVariant =
66+
ValueVariant<TextDirection>({TextDirection.ltr, TextDirection.rtl});
67+
68+
testWidgets('render shadow correctly: start/end', (tester) async {
69+
final textDirection = textDirectionVariant.currentValue!;
70+
await tester.pumpWidget(Directionality(
71+
textDirection: textDirection,
72+
child: Center(
73+
// This would be forced to fill up the screen
74+
// if not wrapped in a widget like [Center].
75+
child: SizedBox(width: 100, height: 100,
76+
child: InsetShadowBox(start: 3, end: 7,
77+
color: Colors.red,
78+
child: SizedBox(width: 30, height: 30))))));
79+
80+
final box = tester.renderObject(find.byType(InsetShadowBox));
81+
check(box).legacyMatcher(
82+
// The coordinate system of these [Rect]'s is relative to the parent
83+
// of the [Gradient] from [InsetShadowBox], not the entire [FlutterView].
84+
switch (textDirection) {
85+
TextDirection.ltr => paints
86+
..something(paintGradient(rect: Rect.fromLTRB(0, 0, 0+3, 100)))
87+
..something(paintGradient(rect: Rect.fromLTRB(100-7, 0, 100, 100))),
88+
TextDirection.rtl => paints
89+
..something(paintGradient(rect: Rect.fromLTRB(100-3, 0, 100, 100)))
90+
..something(paintGradient(rect: Rect.fromLTRB(0, 0, 0+7, 100))),
91+
} as Matcher);
92+
}, variant: textDirectionVariant);
6493
}

0 commit comments

Comments
 (0)