Add support for Material 3 medium and large top app bars. (#103962)

* Add support for M3 AppBar 'Medium' and 'Large' types.

* Updates from review feedback.

* Updated from review feedback.

dev/tools/gen_defaults/lib/app_bar_template.dart

@@ -54,5 +54,65 @@ class _TokenDefaultsM3 extends AppBarTheme {
 
   @override
   TextStyle? get titleTextStyle => ${textStyle('md.comp.top-app-bar.small.headline')};
-}''';
+}
+
+// Variant configuration
+class _MediumScrollUnderFlexibleConfig with _ScrollUnderFlexibleConfig {
+  _MediumScrollUnderFlexibleConfig(this.context);
+
+  final BuildContext context;
+  late final ThemeData _theme = Theme.of(context);
+  late final ColorScheme _colors = _theme.colorScheme;
+  late final TextTheme _textTheme = _theme.textTheme;
+
+  static const double collapsedHeight = ${tokens['md.comp.top-app-bar.small.container.height']};
+  static const double expandedHeight = ${tokens['md.comp.top-app-bar.medium.container.height']};
+
+  @override
+  TextStyle? get collapsedTextStyle =>
+    ${textStyle('md.comp.top-app-bar.small.headline')}?.apply(color: ${color('md.comp.top-app-bar.small.headline.color')});
+
+  @override
+  TextStyle? get expandedTextStyle =>
+    ${textStyle('md.comp.top-app-bar.medium.headline')}?.apply(color: ${color('md.comp.top-app-bar.medium.headline.color')});
+
+  @override
+  EdgeInsetsGeometry? get collapsedTitlePadding => const EdgeInsetsDirectional.fromSTEB(48, 0, 16, 0);
+
+  @override
+  EdgeInsetsGeometry? get collapsedCenteredTitlePadding => const EdgeInsets.fromLTRB(16, 0, 16, 0);
+
+  @override
+  EdgeInsetsGeometry? get expandedTitlePadding => const EdgeInsets.fromLTRB(16, 0, 16, 20);
+}
+
+class _LargeScrollUnderFlexibleConfig with _ScrollUnderFlexibleConfig {
+  _LargeScrollUnderFlexibleConfig(this.context);
+
+  final BuildContext context;
+  late final ThemeData _theme = Theme.of(context);
+  late final ColorScheme _colors = _theme.colorScheme;
+  late final TextTheme _textTheme = _theme.textTheme;
+
+  static const double collapsedHeight = ${tokens['md.comp.top-app-bar.small.container.height']};
+  static const double expandedHeight = ${tokens['md.comp.top-app-bar.large.container.height']};
+
+  @override
+  TextStyle? get collapsedTextStyle =>
+    ${textStyle('md.comp.top-app-bar.small.headline')}?.apply(color: ${color('md.comp.top-app-bar.small.headline.color')});
+
+  @override
+  TextStyle? get expandedTextStyle =>
+    ${textStyle('md.comp.top-app-bar.large.headline')}?.apply(color: ${color('md.comp.top-app-bar.large.headline.color')});
+
+  @override
+  EdgeInsetsGeometry? get collapsedTitlePadding => const EdgeInsetsDirectional.fromSTEB(48, 0, 16, 0);
+
+  @override
+  EdgeInsetsGeometry? get collapsedCenteredTitlePadding => const EdgeInsets.fromLTRB(16, 0, 16, 0);
+
+  @override
+  EdgeInsetsGeometry? get expandedTitlePadding => const EdgeInsets.fromLTRB(16, 0, 16, 28);
+}
+''';
 }

examples/api/lib/material/app_bar/sliver_app_bar.2.dart

@@ -0,0 +1,53 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// Flutter code sample for SliverAppBar.medium
+
+import 'package:flutter/material.dart';
+
+void main() {
+  runApp(const AppBarMediumApp());
+}
+
+class AppBarMediumApp extends StatelessWidget {
+  const AppBarMediumApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      theme: ThemeData(
+        useMaterial3: true,
+        colorSchemeSeed: const Color(0xff6750A4)
+      ),
+      home: Material(
+        child: CustomScrollView(
+          slivers: <Widget>[
+            SliverAppBar.medium(
+              leading: IconButton(icon: const Icon(Icons.menu), onPressed: () {}),
+              title: const Text('Medium App Bar'),
+              actions: <Widget>[
+                IconButton(icon: const Icon(Icons.more_vert), onPressed: () {}),
+              ],
+            ),
+            // Just some content big enough to have something to scroll.
+            SliverToBoxAdapter(
+              child: Card(
+                child: SizedBox(
+                  height: 1200,
+                  child: Padding(
+                    padding: const EdgeInsets.fromLTRB(8, 100, 8, 100),
+                    child: Text(
+                      'Here be scrolling content...',
+                      style: Theme.of(context).textTheme.headlineSmall,
+                    ),
+                  ),
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

examples/api/lib/material/app_bar/sliver_app_bar.3.dart

@@ -0,0 +1,53 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// Flutter code sample for SliverAppBar.large
+
+import 'package:flutter/material.dart';
+
+void main() {
+  runApp(const AppBarLargeApp());
+}
+
+class AppBarLargeApp extends StatelessWidget {
+  const AppBarLargeApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      theme: ThemeData(
+        useMaterial3: true,
+        colorSchemeSeed: const Color(0xff6750A4)
+      ),
+      home: Material(
+        child: CustomScrollView(
+          slivers: <Widget>[
+            SliverAppBar.large(
+              leading: IconButton(icon: const Icon(Icons.menu), onPressed: () {}),
+              title: const Text('Large App Bar'),
+              actions: <Widget>[
+                IconButton(icon: const Icon(Icons.more_vert), onPressed: () {}),
+              ],
+            ),
+            // Just some content big enough to have something to scroll.
+            SliverToBoxAdapter(
+              child: Card(
+                child: SizedBox(
+                  height: 1200,
+                  child: Padding(
+                    padding: const EdgeInsets.fromLTRB(8, 100, 8, 100),
+                    child: Text(
+                      'Here be scrolling content...',
+                      style: Theme.of(context).textTheme.headlineSmall,
+                    ),
+                  ),
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}