Add splashBorderRadius to TabBar (#97204)
This commit is contained in:
parent
ac52901c14
commit
6aed693c4c
@ -644,6 +644,7 @@ class TabBar extends StatefulWidget implements PreferredSizeWidget {
|
|||||||
this.onTap,
|
this.onTap,
|
||||||
this.physics,
|
this.physics,
|
||||||
this.splashFactory,
|
this.splashFactory,
|
||||||
|
this.splashBorderRadius,
|
||||||
}) : assert(tabs != null),
|
}) : assert(tabs != null),
|
||||||
assert(isScrollable != null),
|
assert(isScrollable != null),
|
||||||
assert(dragStartBehavior != null),
|
assert(dragStartBehavior != null),
|
||||||
@ -720,6 +721,11 @@ class TabBar extends StatefulWidget implements PreferredSizeWidget {
|
|||||||
/// occupied by the tab in the tab bar. If [indicatorSize] is
|
/// occupied by the tab in the tab bar. If [indicatorSize] is
|
||||||
/// [TabBarIndicatorSize.label], then the tab's bounds are only as wide as
|
/// [TabBarIndicatorSize.label], then the tab's bounds are only as wide as
|
||||||
/// the tab widget itself.
|
/// the tab widget itself.
|
||||||
|
///
|
||||||
|
/// See also:
|
||||||
|
///
|
||||||
|
/// * [splashBorderRadius], which defines the clipping radius of the splash
|
||||||
|
/// and is generally used with [BoxDecoration.borderRadius].
|
||||||
final Decoration? indicator;
|
final Decoration? indicator;
|
||||||
|
|
||||||
/// Whether this tab bar should automatically adjust the [indicatorColor].
|
/// Whether this tab bar should automatically adjust the [indicatorColor].
|
||||||
@ -849,6 +855,22 @@ class TabBar extends StatefulWidget implements PreferredSizeWidget {
|
|||||||
/// ```
|
/// ```
|
||||||
final InteractiveInkFeatureFactory? splashFactory;
|
final InteractiveInkFeatureFactory? splashFactory;
|
||||||
|
|
||||||
|
/// Defines the clipping radius of splashes that extend outside the bounds of the tab.
|
||||||
|
///
|
||||||
|
/// This can be useful to match the [BoxDecoration.borderRadius] provided as [indicator].
|
||||||
|
/// ```dart
|
||||||
|
/// TabBar(
|
||||||
|
/// indicator: BoxDecoration(
|
||||||
|
/// borderRadius: BorderRadius.circular(40),
|
||||||
|
/// ),
|
||||||
|
/// splashBorderRadius: BorderRadius.circular(40),
|
||||||
|
/// ...
|
||||||
|
/// )
|
||||||
|
/// ```
|
||||||
|
///
|
||||||
|
/// If this property is null, it is interpreted as [BorderRadius.zero].
|
||||||
|
final BorderRadius? splashBorderRadius;
|
||||||
|
|
||||||
/// A size whose height depends on if the tabs have both icons and text.
|
/// A size whose height depends on if the tabs have both icons and text.
|
||||||
///
|
///
|
||||||
/// [AppBar] uses this size to compute its own preferred size.
|
/// [AppBar] uses this size to compute its own preferred size.
|
||||||
@ -1206,6 +1228,7 @@ class _TabBarState extends State<TabBar> {
|
|||||||
enableFeedback: widget.enableFeedback ?? true,
|
enableFeedback: widget.enableFeedback ?? true,
|
||||||
overlayColor: widget.overlayColor ?? tabBarTheme.overlayColor,
|
overlayColor: widget.overlayColor ?? tabBarTheme.overlayColor,
|
||||||
splashFactory: widget.splashFactory ?? tabBarTheme.splashFactory,
|
splashFactory: widget.splashFactory ?? tabBarTheme.splashFactory,
|
||||||
|
borderRadius: widget.splashBorderRadius,
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: EdgeInsets.only(bottom: widget.indicatorWeight),
|
padding: EdgeInsets.only(bottom: widget.indicatorWeight),
|
||||||
child: Stack(
|
child: Stack(
|
||||||
|
@ -4378,6 +4378,50 @@ void main() {
|
|||||||
expect(tester.widget<InkWell>(find.byType(InkWell)).splashFactory, splashFactory);
|
expect(tester.widget<InkWell>(find.byType(InkWell)).splashFactory, splashFactory);
|
||||||
expect(tester.widget<InkWell>(find.byType(InkWell)).overlayColor, overlayColor);
|
expect(tester.widget<InkWell>(find.byType(InkWell)).overlayColor, overlayColor);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
testWidgets('splashBorderRadius is passed to InkWell.borderRadius', (WidgetTester tester) async {
|
||||||
|
const Color hoverColor = Color(0xfff44336);
|
||||||
|
const double radius = 20;
|
||||||
|
await tester.pumpWidget(
|
||||||
|
boilerplate(
|
||||||
|
child: DefaultTabController(
|
||||||
|
length: 1,
|
||||||
|
child: TabBar(
|
||||||
|
overlayColor: MaterialStateProperty.resolveWith<Color>(
|
||||||
|
(Set<MaterialState> states) {
|
||||||
|
if (states.contains(MaterialState.hovered)) {
|
||||||
|
return hoverColor;
|
||||||
|
}
|
||||||
|
return Colors.black54;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
splashBorderRadius: BorderRadius.circular(radius),
|
||||||
|
tabs: const <Widget>[
|
||||||
|
Tab(
|
||||||
|
child: Text(''),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
await tester.pumpAndSettle();
|
||||||
|
final TestGesture gesture = await tester.createGesture(kind: PointerDeviceKind.mouse, pointer: 1);
|
||||||
|
await gesture.moveTo(tester.getCenter(find.byType(Tab)));
|
||||||
|
await tester.pumpAndSettle();
|
||||||
|
final RenderObject object = tester.allRenderObjects.firstWhere((RenderObject element) => element.runtimeType.toString() == '_RenderInkFeatures');
|
||||||
|
expect(
|
||||||
|
object,
|
||||||
|
paints..rrect(
|
||||||
|
color: hoverColor,
|
||||||
|
rrect: RRect.fromRectAndRadius(
|
||||||
|
tester.getRect(find.byType(InkWell)),
|
||||||
|
const Radius.circular(radius)
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
gesture.removePointer();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
class KeepAliveInk extends StatefulWidget {
|
class KeepAliveInk extends StatefulWidget {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user