mirror of
https://github.com/flutter/flutter.git
synced 2025-06-03 00:51:18 +00:00
Fix M3 Drawer
default shape in RTL (#118185)
This commit is contained in:
parent
51c2af56c9
commit
0d91c0343b
@ -10,10 +10,11 @@ class DrawerTemplate extends TokenTemplate {
|
|||||||
@override
|
@override
|
||||||
String generate() => '''
|
String generate() => '''
|
||||||
class _${blockName}DefaultsM3 extends DrawerThemeData {
|
class _${blockName}DefaultsM3 extends DrawerThemeData {
|
||||||
const _${blockName}DefaultsM3(this.context)
|
_${blockName}DefaultsM3(this.context)
|
||||||
: super(elevation: ${elevation("md.comp.navigation-drawer.modal.container")});
|
: super(elevation: ${elevation("md.comp.navigation-drawer.modal.container")});
|
||||||
|
|
||||||
final BuildContext context;
|
final BuildContext context;
|
||||||
|
late final TextDirection direction = Directionality.of(context);
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Color? get backgroundColor => ${componentColor("md.comp.navigation-drawer.container")};
|
Color? get backgroundColor => ${componentColor("md.comp.navigation-drawer.container")};
|
||||||
@ -24,18 +25,22 @@ class _${blockName}DefaultsM3 extends DrawerThemeData {
|
|||||||
@override
|
@override
|
||||||
Color? get shadowColor => ${colorOrTransparent("md.comp.navigation-drawer.container.shadow-color")};
|
Color? get shadowColor => ${colorOrTransparent("md.comp.navigation-drawer.container.shadow-color")};
|
||||||
|
|
||||||
// This don't appear to be tokens for this value, but it is
|
// There isn't currently a token for this value, but it is shown in the spec,
|
||||||
// shown in the spec.
|
// so hard coding here for now.
|
||||||
@override
|
@override
|
||||||
ShapeBorder? get shape => const RoundedRectangleBorder(
|
ShapeBorder? get shape => RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.horizontal(right: Radius.circular(16.0)),
|
borderRadius: const BorderRadiusDirectional.horizontal(
|
||||||
|
end: Radius.circular(16.0),
|
||||||
|
).resolve(direction),
|
||||||
);
|
);
|
||||||
|
|
||||||
// This don't appear to be tokens for this value, but it is
|
// There isn't currently a token for this value, but it is shown in the spec,
|
||||||
// shown in the spec.
|
// so hard coding here for now.
|
||||||
@override
|
@override
|
||||||
ShapeBorder? get endShape => const RoundedRectangleBorder(
|
ShapeBorder? get endShape => RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.horizontal(left: Radius.circular(16.0)),
|
borderRadius: const BorderRadiusDirectional.horizontal(
|
||||||
|
start: Radius.circular(16.0),
|
||||||
|
).resolve(direction),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
''';
|
''';
|
||||||
|
@ -830,10 +830,11 @@ class _DrawerDefaultsM2 extends DrawerThemeData {
|
|||||||
// Token database version: v0_150
|
// Token database version: v0_150
|
||||||
|
|
||||||
class _DrawerDefaultsM3 extends DrawerThemeData {
|
class _DrawerDefaultsM3 extends DrawerThemeData {
|
||||||
const _DrawerDefaultsM3(this.context)
|
_DrawerDefaultsM3(this.context)
|
||||||
: super(elevation: 1.0);
|
: super(elevation: 1.0);
|
||||||
|
|
||||||
final BuildContext context;
|
final BuildContext context;
|
||||||
|
late final TextDirection direction = Directionality.of(context);
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Color? get backgroundColor => Theme.of(context).colorScheme.surface;
|
Color? get backgroundColor => Theme.of(context).colorScheme.surface;
|
||||||
@ -844,18 +845,22 @@ class _DrawerDefaultsM3 extends DrawerThemeData {
|
|||||||
@override
|
@override
|
||||||
Color? get shadowColor => Colors.transparent;
|
Color? get shadowColor => Colors.transparent;
|
||||||
|
|
||||||
// This don't appear to be tokens for this value, but it is
|
// There isn't currently a token for this value, but it is shown in the spec,
|
||||||
// shown in the spec.
|
// so hard coding here for now.
|
||||||
@override
|
@override
|
||||||
ShapeBorder? get shape => const RoundedRectangleBorder(
|
ShapeBorder? get shape => RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.horizontal(right: Radius.circular(16.0)),
|
borderRadius: const BorderRadiusDirectional.horizontal(
|
||||||
|
end: Radius.circular(16.0),
|
||||||
|
).resolve(direction),
|
||||||
);
|
);
|
||||||
|
|
||||||
// This don't appear to be tokens for this value, but it is
|
// There isn't currently a token for this value, but it is shown in the spec,
|
||||||
// shown in the spec.
|
// so hard coding here for now.
|
||||||
@override
|
@override
|
||||||
ShapeBorder? get endShape => const RoundedRectangleBorder(
|
ShapeBorder? get endShape => RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.horizontal(left: Radius.circular(16.0)),
|
borderRadius: const BorderRadiusDirectional.horizontal(
|
||||||
|
start: Radius.circular(16.0),
|
||||||
|
).resolve(direction),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -567,4 +567,170 @@ void main() {
|
|||||||
final RenderBox box = tester.renderObject(find.byType(Drawer));
|
final RenderBox box = tester.renderObject(find.byType(Drawer));
|
||||||
expect(box.size.width, equals(smallWidth));
|
expect(box.size.width, equals(smallWidth));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
testWidgets('Drawer default shape (ltr)', (WidgetTester tester) async {
|
||||||
|
await tester.pumpWidget(
|
||||||
|
MaterialApp(
|
||||||
|
theme: ThemeData(useMaterial3: true),
|
||||||
|
home: const Directionality(
|
||||||
|
textDirection: TextDirection.ltr,
|
||||||
|
child: Scaffold(
|
||||||
|
drawer: Drawer(),
|
||||||
|
endDrawer: Drawer(),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
|
final Finder drawerMaterial = find.descendant(
|
||||||
|
of: find.byType(Drawer),
|
||||||
|
matching: find.byType(Material),
|
||||||
|
);
|
||||||
|
|
||||||
|
final ScaffoldState state = tester.firstState(find.byType(Scaffold));
|
||||||
|
|
||||||
|
// Open the drawer.
|
||||||
|
state.openDrawer();
|
||||||
|
await tester.pump();
|
||||||
|
await tester.pump(const Duration(seconds: 1));
|
||||||
|
|
||||||
|
// Test the drawer shape.
|
||||||
|
Material material = tester.widget<Material>(drawerMaterial);
|
||||||
|
expect(
|
||||||
|
material.shape,
|
||||||
|
const RoundedRectangleBorder(
|
||||||
|
borderRadius: BorderRadius.only(
|
||||||
|
topRight: Radius.circular(16.0),
|
||||||
|
bottomRight: Radius.circular(16.0),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
|
// Close the opened drawer.
|
||||||
|
await tester.tapAt(const Offset(750, 300));
|
||||||
|
await tester.pumpAndSettle();
|
||||||
|
|
||||||
|
// Open the end drawer.
|
||||||
|
state.openEndDrawer();
|
||||||
|
await tester.pump();
|
||||||
|
await tester.pump(const Duration(seconds: 1));
|
||||||
|
|
||||||
|
// Test the end drawer shape.
|
||||||
|
material = tester.widget<Material>(drawerMaterial);
|
||||||
|
expect(
|
||||||
|
material.shape,
|
||||||
|
const RoundedRectangleBorder(
|
||||||
|
borderRadius: BorderRadius.only(
|
||||||
|
topLeft: Radius.circular(16.0),
|
||||||
|
bottomLeft: Radius.circular(16.0),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
testWidgets('Drawer default shape (rtl)', (WidgetTester tester) async {
|
||||||
|
await tester.pumpWidget(
|
||||||
|
MaterialApp(
|
||||||
|
theme: ThemeData(useMaterial3: true),
|
||||||
|
home: const Directionality(
|
||||||
|
textDirection: TextDirection.rtl,
|
||||||
|
child: Scaffold(
|
||||||
|
drawer: Drawer(),
|
||||||
|
endDrawer: Drawer(),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
|
final Finder drawerMaterial = find.descendant(
|
||||||
|
of: find.byType(Drawer),
|
||||||
|
matching: find.byType(Material),
|
||||||
|
);
|
||||||
|
|
||||||
|
final ScaffoldState state = tester.firstState(find.byType(Scaffold));
|
||||||
|
|
||||||
|
// Open the drawer.
|
||||||
|
state.openDrawer();
|
||||||
|
await tester.pump();
|
||||||
|
await tester.pump(const Duration(seconds: 1));
|
||||||
|
|
||||||
|
// Test the drawer shape.
|
||||||
|
Material material = tester.widget<Material>(drawerMaterial);
|
||||||
|
expect(
|
||||||
|
material.shape,
|
||||||
|
const RoundedRectangleBorder(
|
||||||
|
borderRadius: BorderRadius.only(
|
||||||
|
topLeft: Radius.circular(16.0),
|
||||||
|
bottomLeft: Radius.circular(16.0),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
|
// Close the opened drawer.
|
||||||
|
await tester.tapAt(const Offset(750, 300));
|
||||||
|
await tester.pumpAndSettle();
|
||||||
|
|
||||||
|
// Open the end drawer.
|
||||||
|
state.openEndDrawer();
|
||||||
|
await tester.pump();
|
||||||
|
await tester.pump(const Duration(seconds: 1));
|
||||||
|
|
||||||
|
// Test the end drawer shape.
|
||||||
|
material = tester.widget<Material>(drawerMaterial);
|
||||||
|
expect(
|
||||||
|
material.shape,
|
||||||
|
const RoundedRectangleBorder(
|
||||||
|
borderRadius: BorderRadius.only(
|
||||||
|
topRight: Radius.circular(16.0),
|
||||||
|
bottomRight: Radius.circular(16.0),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
group('Material 2', () {
|
||||||
|
// Tests that are only relevant for Material 2. Once ThemeData.useMaterial3
|
||||||
|
// is turned on by default, these tests can be removed.
|
||||||
|
|
||||||
|
testWidgets('Drawer default shape', (WidgetTester tester) async {
|
||||||
|
await tester.pumpWidget(
|
||||||
|
MaterialApp(
|
||||||
|
theme: ThemeData(useMaterial3: false),
|
||||||
|
home: const Scaffold(
|
||||||
|
drawer: Drawer(),
|
||||||
|
endDrawer: Drawer(),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
|
final Finder drawerMaterial = find.descendant(
|
||||||
|
of: find.byType(Drawer),
|
||||||
|
matching: find.byType(Material),
|
||||||
|
);
|
||||||
|
|
||||||
|
final ScaffoldState state = tester.firstState(find.byType(Scaffold));
|
||||||
|
|
||||||
|
// Open the drawer.
|
||||||
|
state.openDrawer();
|
||||||
|
await tester.pump();
|
||||||
|
await tester.pump(const Duration(seconds: 1));
|
||||||
|
|
||||||
|
// Test the drawer shape.
|
||||||
|
Material material = tester.widget<Material>(drawerMaterial);
|
||||||
|
expect(material.shape, null);
|
||||||
|
|
||||||
|
// Close the opened drawer.
|
||||||
|
await tester.tapAt(const Offset(750, 300));
|
||||||
|
await tester.pumpAndSettle();
|
||||||
|
|
||||||
|
// Open the end drawer.
|
||||||
|
state.openEndDrawer();
|
||||||
|
await tester.pump();
|
||||||
|
await tester.pump(const Duration(seconds: 1));
|
||||||
|
|
||||||
|
// Test the end drawer shape.
|
||||||
|
material = tester.widget<Material>(drawerMaterial);
|
||||||
|
expect(material.shape, null);
|
||||||
|
});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user