MaterialBanner alignment fixes and improvements (#74309)

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

@@ -50,6 +50,10 @@ import 'theme.dart';
 /// Otherwise, the [actions] will be placed below the [content]. Use
 /// [forceActionsBelow] to override this behavior.
 ///
+/// If the [actions] placed below the [content], they will be laid out in a row.
+/// If there isn't sufficient room to display everything, they are laid out
+/// in a column instead.
+///
 /// The [actions] and [content] must be provided. An optional leading widget
 /// (typically an [Image]) can also be provided. The [contentTextStyle] and
 /// [backgroundColor] can be provided to customize the banner.
@@ -70,6 +74,7 @@ class MaterialBanner extends StatelessWidget {
     this.padding,
     this.leadingPadding,
     this.forceActionsBelow = false,
+    this.overflowAlignment = OverflowBarAlignment.end,
   }) : assert(content != null),
        assert(actions != null),
        assert(forceActionsBelow != null),
@@ -124,8 +129,15 @@ class MaterialBanner extends StatelessWidget {
   /// this is false, the [actions] will be placed on the trailing side of the
   /// [content] if [actions]'s length is 1 and below the [content] if greater
   /// than 1.
+  ///
+  /// Defaults to false.
   final bool forceActionsBelow;
 
+  /// The horizontal alignment of the [actions] when the [actions] laid out in a column.
+  ///
+  /// Defaults to [OverflowBarAlignment.end].
+  final OverflowBarAlignment overflowAlignment;
+
   @override
   Widget build(BuildContext context) {
     assert(actions.isNotEmpty);
@@ -146,6 +158,7 @@ class MaterialBanner extends StatelessWidget {
       constraints: const BoxConstraints(minHeight: 52.0),
       padding: const EdgeInsets.symmetric(horizontal: 8),
       child: OverflowBar(
+        overflowAlignment: overflowAlignment,
         spacing: 8,
         children: actions,
       ),

packages/flutter/test/material/banner_test.dart

@@ -243,10 +243,47 @@ void main() {
 
     await tester.pumpWidget(buildFrame(TextDirection.ltr));
     for (int index = 0; index < actionCount; index += 1) {
-      expect(tester.getTopLeft(find.byKey(ValueKey<int>(index))), Offset(8, 134.0 + index * 10));
+      expect(tester.getTopLeft(find.byKey(ValueKey<int>(index))), Offset(592, 134.0 + index * 10));
     }
 
     await tester.pumpWidget(buildFrame(TextDirection.rtl));
+    for (int index = 0; index < actionCount; index += 1) {
+      expect(tester.getTopLeft(find.byKey(ValueKey<int>(index))), Offset(8, 134.0 + index * 10));
+    }
+  });
+
+  testWidgets('[overflowAlignment] test', (WidgetTester tester) async {
+    const int actionCount = 4;
+    Widget buildFrame(TextDirection textDirection, OverflowBarAlignment overflowAlignment) {
+      return MaterialApp(
+        home: Directionality(
+          textDirection: textDirection,
+          child: MaterialBanner(
+            overflowAlignment: overflowAlignment,
+            content: const SizedBox(width: 100, height: 100),
+            actions: List<Widget>.generate(actionCount, (int index) {
+              return SizedBox(
+                width: 200,
+                height: 10,
+                key: ValueKey<int>(index),
+              );
+            }),
+          ),
+        ),
+      );
+    }
+
+    await tester.pumpWidget(buildFrame(TextDirection.ltr, OverflowBarAlignment.start));
+    for (int index = 0; index < actionCount; index += 1) {
+      expect(tester.getTopLeft(find.byKey(ValueKey<int>(index))), Offset(8, 134.0 + index * 10));
+    }
+
+    await tester.pumpWidget(buildFrame(TextDirection.ltr, OverflowBarAlignment.center));
+    for (int index = 0; index < actionCount; index += 1) {
+      expect(tester.getTopLeft(find.byKey(ValueKey<int>(index))), Offset(300, 134.0 + index * 10));
+    }
+
+    await tester.pumpWidget(buildFrame(TextDirection.ltr, OverflowBarAlignment.end));
     for (int index = 0; index < actionCount; index += 1) {
       expect(tester.getTopLeft(find.byKey(ValueKey<int>(index))), Offset(592, 134.0 + index * 10));
     }