Skip to content

Commit 596d9b6

Browse files
authored
Center Floating Snackbar with custom width when direction is RTL (#140215)
## Description This PR fixes the positionning of a floating snackbar when the text direction is RTL. ## Related Issue Fixes flutter/flutter#140125. ## Tests Adds 1 test.
1 parent c1e207d commit 596d9b6

File tree

2 files changed

+50
-1
lines changed

2 files changed

+50
-1
lines changed

packages/flutter/lib/src/material/scaffold.dart

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1183,7 +1183,13 @@ class _ScaffoldLayout extends MultiChildLayoutDelegate {
11831183
: contentBottom;
11841184
}
11851185

1186-
final double xOffset = hasCustomWidth ? (size.width - snackBarWidth!) / 2 : 0.0;
1186+
double xOffset = 0.0;
1187+
if (hasCustomWidth) {
1188+
xOffset = switch (textDirection) {
1189+
TextDirection.rtl => (snackBarWidth! - size.width) / 2,
1190+
TextDirection.ltr => (size.width - snackBarWidth!) / 2,
1191+
};
1192+
}
11871193
positionChild(_ScaffoldSlot.snackBar, Offset(xOffset, snackBarYOffsetBase - snackBarSize.height));
11881194

11891195
assert((){

packages/flutter/test/material/snack_bar_test.dart

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2604,6 +2604,49 @@ void main() {
26042604
expect(snackBarTopRight.dx - actionTopRight.dx, 8.0 + 15.0); // button margin + horizontal scaffold outside margin
26052605
},
26062606
);
2607+
2608+
testWidgets('Floating snackbar with custom width is centered when text direction is rtl', (WidgetTester tester) async {
2609+
// Regression test for https://github.com/flutter/flutter/issues/140125.
2610+
const double customWidth = 400.0;
2611+
await tester.pumpWidget(
2612+
MaterialApp(
2613+
home: Directionality(
2614+
textDirection: TextDirection.rtl,
2615+
child: Scaffold(
2616+
body: Builder(
2617+
builder: (BuildContext context) {
2618+
return GestureDetector(
2619+
onTap: () {
2620+
ScaffoldMessenger.of(context).showSnackBar(
2621+
const SnackBar(
2622+
behavior: SnackBarBehavior.floating,
2623+
width: customWidth,
2624+
content: Text('Feeling super snackish'),
2625+
),
2626+
);
2627+
},
2628+
child: const Text('X'),
2629+
);
2630+
},
2631+
),
2632+
),
2633+
),
2634+
),
2635+
);
2636+
2637+
await tester.tap(find.text('X'));
2638+
await tester.pump(); // start animation
2639+
await tester.pump(const Duration(milliseconds: 750));
2640+
2641+
final Finder materialFinder = find.descendant(
2642+
of: find.byType(SnackBar),
2643+
matching: find.byType(Material),
2644+
);
2645+
final Offset snackBarBottomLeft = tester.getBottomLeft(materialFinder);
2646+
final Offset snackBarBottomRight = tester.getBottomRight(materialFinder);
2647+
expect(snackBarBottomLeft.dx, (800 - customWidth) / 2); // Device width is 800.
2648+
expect(snackBarBottomRight.dx, (800 + customWidth) / 2); // Device width is 800.
2649+
});
26072650
});
26082651

26092652
testWidgets('SnackBars hero across transitions when using ScaffoldMessenger', (WidgetTester tester) async {

0 commit comments

Comments
 (0)