From fe58197b545857ca6e50f87f836044dc787f770b Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Wed, 16 Jul 2025 10:20:27 +0200
Subject: [PATCH 01/10] chore: add example web platform

---
 example/.metadata                       |  27 ++++-------------
 example/analysis_options.yaml           |  28 +++++++++++++++++
 example/pubspec.lock                    |  20 ++++++-------
 example/test/widget_test.dart           |  30 +++++++++++++++++++
 example/web/favicon.png                 | Bin 0 -> 917 bytes
 example/web/icons/Icon-192.png          | Bin 0 -> 5292 bytes
 example/web/icons/Icon-512.png          | Bin 0 -> 8252 bytes
 example/web/icons/Icon-maskable-192.png | Bin 0 -> 5594 bytes
 example/web/icons/Icon-maskable-512.png | Bin 0 -> 20998 bytes
 example/web/index.html                  |  38 ++++++++++++++++++++++++
 example/web/manifest.json               |  35 ++++++++++++++++++++++
 11 files changed, 147 insertions(+), 31 deletions(-)
 create mode 100644 example/analysis_options.yaml
 create mode 100644 example/test/widget_test.dart
 create mode 100644 example/web/favicon.png
 create mode 100644 example/web/icons/Icon-192.png
 create mode 100644 example/web/icons/Icon-512.png
 create mode 100644 example/web/icons/Icon-maskable-192.png
 create mode 100644 example/web/icons/Icon-maskable-512.png
 create mode 100644 example/web/index.html
 create mode 100644 example/web/manifest.json

diff --git a/example/.metadata b/example/.metadata
index 2d1be89..220a11f 100644
--- a/example/.metadata
+++ b/example/.metadata
@@ -4,8 +4,8 @@
 # This file should be version controlled and should not be manually edited.
 
 version:
-  revision: "2663184aa79047d0a33a14a3b607954f8fdd8730"
-  channel: "stable"
+  revision: "99d909aed0f862ecac957eb157353ab7d82da20b"
+  channel: "main"
 
 project_type: app
 
@@ -13,26 +13,11 @@ project_type: app
 migration:
   platforms:
     - platform: root
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-    - platform: android
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-    - platform: ios
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-    - platform: linux
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-    - platform: macos
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
+      create_revision: 99d909aed0f862ecac957eb157353ab7d82da20b
+      base_revision: 99d909aed0f862ecac957eb157353ab7d82da20b
     - platform: web
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-    - platform: windows
-      create_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
-      base_revision: 2663184aa79047d0a33a14a3b607954f8fdd8730
+      create_revision: 99d909aed0f862ecac957eb157353ab7d82da20b
+      base_revision: 99d909aed0f862ecac957eb157353ab7d82da20b
 
   # User provided section
 
diff --git a/example/analysis_options.yaml b/example/analysis_options.yaml
new file mode 100644
index 0000000..0d29021
--- /dev/null
+++ b/example/analysis_options.yaml
@@ -0,0 +1,28 @@
+# This file configures the analyzer, which statically analyzes Dart code to
+# check for errors, warnings, and lints.
+#
+# The issues identified by the analyzer are surfaced in the UI of Dart-enabled
+# IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
+# invoked from the command line by running `flutter analyze`.
+
+# The following line activates a set of recommended lints for Flutter apps,
+# packages, and plugins designed to encourage good coding practices.
+include: package:flutter_lints/flutter.yaml
+
+linter:
+  # The lint rules applied to this project can be customized in the
+  # section below to disable rules from the `package:flutter_lints/flutter.yaml`
+  # included above or to enable additional rules. A list of all available lints
+  # and their documentation is published at https://dart.dev/lints.
+  #
+  # Instead of disabling a lint rule for the entire project in the
+  # section below, it can also be suppressed for a single line of code
+  # or a specific dart file by using the `// ignore: name_of_lint` and
+  # `// ignore_for_file: name_of_lint` syntax on the line or in the file
+  # producing the lint.
+  rules:
+    # avoid_print: false  # Uncomment to disable the `avoid_print` rule
+    # prefer_single_quotes: true  # Uncomment to enable the `prefer_single_quotes` rule
+
+# Additional information about this file can be found at
+# https://dart.dev/guides/language/analysis-options
diff --git a/example/pubspec.lock b/example/pubspec.lock
index e6d4f72..70484fe 100644
--- a/example/pubspec.lock
+++ b/example/pubspec.lock
@@ -63,26 +63,26 @@ packages:
     dependency: transitive
     description:
       name: leak_tracker
-      sha256: "6bb818ecbdffe216e81182c2f0714a2e62b593f4a4f13098713ff1685dfb6ab0"
+      sha256: "8dcda04c3fc16c14f48a7bb586d4be1f0d1572731b6d81d51772ef47c02081e0"
       url: "https://pub.dev"
     source: hosted
-    version: "10.0.9"
+    version: "11.0.1"
   leak_tracker_flutter_testing:
     dependency: transitive
     description:
       name: leak_tracker_flutter_testing
-      sha256: f8b613e7e6a13ec79cfdc0e97638fddb3ab848452eff057653abd3edba760573
+      sha256: "1dbc140bb5a23c75ea9c4811222756104fbcd1a27173f0c34ca01e16bea473c1"
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.9"
+    version: "3.0.10"
   leak_tracker_testing:
     dependency: transitive
     description:
       name: leak_tracker_testing
-      sha256: "6ba465d5d76e67ddf503e1161d1f4a6bc42306f9d66ca1e8f079a47290fb06d3"
+      sha256: "8d5a2d49f4a66b49744b23b018848400d23e54caf9463f4eb20df3eb8acb2eb1"
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.1"
+    version: "3.0.2"
   matcher:
     dependency: transitive
     description:
@@ -171,10 +171,10 @@ packages:
     dependency: transitive
     description:
       name: test_api
-      sha256: fb31f383e2ee25fbbfe06b40fe21e1e458d14080e3c67e7ba0acfde4df4e0bbd
+      sha256: "522f00f556e73044315fa4585ec3270f1808a4b186c936e612cab0b565ff1e00"
       url: "https://pub.dev"
     source: hosted
-    version: "0.7.4"
+    version: "0.7.6"
   value_layout_builder:
     dependency: transitive
     description:
@@ -187,10 +187,10 @@ packages:
     dependency: transitive
     description:
       name: vector_math
-      sha256: "80b3257d1492ce4d091729e3a67a60407d227c27241d6927be0130c98e741803"
+      sha256: d530bd74fea330e6e364cda7a85019c434070188383e1cd8d9777ee586914c5b
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.4"
+    version: "2.2.0"
   vm_service:
     dependency: transitive
     description:
diff --git a/example/test/widget_test.dart b/example/test/widget_test.dart
new file mode 100644
index 0000000..092d222
--- /dev/null
+++ b/example/test/widget_test.dart
@@ -0,0 +1,30 @@
+// This is a basic Flutter widget test.
+//
+// To perform an interaction with a widget in your test, use the WidgetTester
+// utility in the flutter_test package. For example, you can send tap and scroll
+// gestures. You can also use WidgetTester to find child widgets in the widget
+// tree, read text, and verify that the values of widget properties are correct.
+
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+import 'package:example/main.dart';
+
+void main() {
+  testWidgets('Counter increments smoke test', (WidgetTester tester) async {
+    // Build our app and trigger a frame.
+    await tester.pumpWidget(const MyApp());
+
+    // Verify that our counter starts at 0.
+    expect(find.text('0'), findsOneWidget);
+    expect(find.text('1'), findsNothing);
+
+    // Tap the '+' icon and trigger a frame.
+    await tester.tap(find.byIcon(Icons.add));
+    await tester.pump();
+
+    // Verify that our counter has incremented.
+    expect(find.text('0'), findsNothing);
+    expect(find.text('1'), findsOneWidget);
+  });
+}
diff --git a/example/web/favicon.png b/example/web/favicon.png
new file mode 100644
index 0000000000000000000000000000000000000000..8aaa46ac1ae21512746f852a42ba87e4165dfdd1
GIT binary patch
literal 917
zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4#%`jKx9jP7LeL$-D$|I14-?iy0X7
zltGxWVyS%@P(fs7NJL45ua8x7ey(0(N`6wRUPW#JP&EUCO@$SZnVVXYs8ErclUHn2
zVXFjIVFhG^g!Ppaz)DK8ZIvQ?0~DO|i&7O#^-S~(l<c?^6clWVQqrt~T->1AfjnEK
zjFOT9D}DX)@^Za$W4-*MbbUihOG|wNBYh(yU7!lx;>x^|#0uTKVr7USFmqf|i<65o
z3raHc^AtelCMM;Vme?vOfh>Xph&xL%(-1c06+^uR^q@XSM&D4+Kp$>4P^%3{)XKjo
zGZknv$b36P8?Z_gF{nK@`XI}Z90TzwSQO}0J1!f2c(B=V`5aP@1P1a|PZ!4!3&Gl8
zTYqUsf!gYFyJnXpu0!n&N*<mM6;!yDy;iI!?0xZxS-@9o){@>SYAX-%d(5<QWisP%
zpKxJ^!zO{CB{zx^b({)M+}nHh%-rj7^M&&ZcU$j%zjx;LVyDXoIuhq|8P;5s=KHG5
z<JUB4<A0$RmNJizixz(PY{v3_`K1HjE{oV$3+pLbhDf-dGF^GSkNIsaZ^^?aj@RFX
zmI#!cuT=hV*<Wg+koNS~T)(gK8EvWbJGDN%Cgswi@;rmS$PYP}{^d1_2Ol_C#PhDD
zFw$(<^hU$>gVjrHJWqXQshj@!<B9Fv+a9JEO;0$m^uEygb*U`#RIBf=|21JrRHoLF
zSVqsI&*oWt$jm+Fz?pMwCX>Zm{!01WsQrH~9=kTxW#6SvuapgMqt>$=j#%eyGrQzr
zP{L-3gsMA^$I1&gsBAEL+vxi1*Igl=8#8`5?A-T5=z-sk46WA1IUT)AIZHx1rdUrf
zVJrJn<74DDw`j)Ki#gt}mIT-Q`XRa2-jQXQoI%w`nb|XblvzK${ZzlV)m-XcwC(od
z71_OEC5Bt9GEXosOXaPTYOia#R4ID2TiU~`zVMl08TV_C%DnU4^+HE>9(CE4D6?Fz
oujB08i7adh9xk7*FX66dWH6F5TM;?E2b5PlUHx3vIVCg!0Dx9vYXATM

literal 0
HcmV?d00001

diff --git a/example/web/icons/Icon-192.png b/example/web/icons/Icon-192.png
new file mode 100644
index 0000000000000000000000000000000000000000..b749bfef07473333cf1dd31e9eed89862a5d52aa
GIT binary patch
literal 5292
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

literal 0
HcmV?d00001

diff --git a/example/web/icons/Icon-512.png b/example/web/icons/Icon-512.png
new file mode 100644
index 0000000000000000000000000000000000000000..88cfd48dff1169879ba46840804b412fe02fefd6
GIT binary patch
literal 8252
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

literal 0
HcmV?d00001

diff --git a/example/web/icons/Icon-maskable-192.png b/example/web/icons/Icon-maskable-192.png
new file mode 100644
index 0000000000000000000000000000000000000000..eb9b4d76e525556d5d89141648c724331630325d
GIT binary patch
literal 5594
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
X>c!)3PgKfL&lX^$Z>Cpu&6)6jvi^Z!

literal 0
HcmV?d00001

diff --git a/example/web/icons/Icon-maskable-512.png b/example/web/icons/Icon-maskable-512.png
new file mode 100644
index 0000000000000000000000000000000000000000..d69c56691fbdb0b7efa65097c7cc1edac12a6d3e
GIT binary patch
literal 20998
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
MPgg&ebxsLQ025IeI{*Lx

literal 0
HcmV?d00001

diff --git a/example/web/index.html b/example/web/index.html
new file mode 100644
index 0000000..29b5808
--- /dev/null
+++ b/example/web/index.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <!--
+    If you are serving your web app in a path other than the root, change the
+    href value below to reflect the base path you are serving from.
+
+    The path provided below has to start and end with a slash "/" in order for
+    it to work correctly.
+
+    For more details:
+    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
+
+    This is a placeholder for base href that will be replaced by the value of
+    the `--base-href` argument provided to `flutter build`.
+  -->
+  <base href="$FLUTTER_BASE_HREF">
+
+  <meta charset="UTF-8">
+  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
+  <meta name="description" content="A new Flutter project.">
+
+  <!-- iOS meta tags & icons -->
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+  <meta name="apple-mobile-web-app-title" content="example">
+  <link rel="apple-touch-icon" href="icons/Icon-192.png">
+
+  <!-- Favicon -->
+  <link rel="icon" type="image/png" href="favicon.png"/>
+
+  <title>example</title>
+  <link rel="manifest" href="manifest.json">
+</head>
+<body>
+  <script src="flutter_bootstrap.js" async></script>
+</body>
+</html>
diff --git a/example/web/manifest.json b/example/web/manifest.json
new file mode 100644
index 0000000..096edf8
--- /dev/null
+++ b/example/web/manifest.json
@@ -0,0 +1,35 @@
+{
+    "name": "example",
+    "short_name": "example",
+    "start_url": ".",
+    "display": "standalone",
+    "background_color": "#0175C2",
+    "theme_color": "#0175C2",
+    "description": "A new Flutter project.",
+    "orientation": "portrait-primary",
+    "prefer_related_applications": false,
+    "icons": [
+        {
+            "src": "icons/Icon-192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-maskable-192.png",
+            "sizes": "192x192",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "icons/Icon-maskable-512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "maskable"
+        }
+    ]
+}

From 78a036ffff1ba883c648688335aff29973fd5f4e Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Wed, 16 Jul 2025 15:43:13 +0200
Subject: [PATCH 02/10] feat: main & cross axis alignment, ability to expand
 first child

---
 example/lib/main.dart                |  33 ++-
 lib/src/rendering/overflow_view.dart | 323 +++++++++++++++------------
 lib/src/widgets/overflow_view.dart   |  41 +++-
 3 files changed, 246 insertions(+), 151 deletions(-)

diff --git a/example/lib/main.dart b/example/lib/main.dart
index 4e99f40..72dc629 100644
--- a/example/lib/main.dart
+++ b/example/lib/main.dart
@@ -65,12 +65,11 @@ class _MyHomePageState extends State<MyHomePage> {
         title: Text(widget.title),
       ),
       body: SafeArea(
-        child: Padding(
-          padding: const EdgeInsets.all(8.0),
+        child: SingleChildScrollView(
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              Text(
+              /*Text(
                 'People',
                 style: TextStyle(fontSize: 20),
               ),
@@ -90,14 +89,23 @@ class _MyHomePageState extends State<MyHomePage> {
                     color: Colors.red,
                   );
                 },
+              ),*/
+
+              Text('MainAxisAlignment.start'),
+              FractionallySizedBox(
+                widthFactor: ratio,
+                child: CommandBar(mainAxisAlignment: MainAxisAlignment.start),
               ),
+              Text('MainAxisAlignment.end'),
               SizedBox(height: 20),
               FractionallySizedBox(
                 widthFactor: ratio,
-                child: CommandBar(),
+                child: CommandBar(mainAxisAlignment: MainAxisAlignment.end),
               ),
+              Text('MainAxisAlignment.center'),
+              CommandBar(mainAxisAlignment: MainAxisAlignment.center),
               SizedBox(height: 20),
-              Expanded(
+              /*Expanded(
                 child: OverflowView(
                   direction: Axis.vertical,
                   spacing: 4,
@@ -159,7 +167,7 @@ class _MyHomePageState extends State<MyHomePage> {
                     );
                   },
                 ),
-              ),
+              ),*/
               // Slider(
               //   value: ratio,
               //   min: 0,
@@ -254,8 +262,11 @@ class AvatarWidget extends StatelessWidget {
 }
 
 class CommandBar extends StatelessWidget {
+  final MainAxisAlignment mainAxisAlignment;
+
   const CommandBar({
     Key? key,
+    this.mainAxisAlignment = MainAxisAlignment.start,
   }) : super(key: key);
 
   @override
@@ -273,8 +284,14 @@ class CommandBar extends StatelessWidget {
     ];
 
     return OverflowView.flexible(
-      spacing: -4,
-      children: [...commands.map((e) => _MenuItem(data: e))],
+      spacing: 4,
+      expandFirstChild: true,
+      mainAxisAlignment: mainAxisAlignment,
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        SizedBox(height: 200, child: Text('Hello this is a long text for testing the ')),
+        ...commands.map((e) => _MenuItem(data: e))
+      ],
       builder: (context, remaining) {
         return PopupMenuButton<String>(
           icon: Icon(Icons.menu),
diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index 9d45af0..300b37e 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -22,14 +22,38 @@ class RenderOverflowView extends RenderBox
     required Axis direction,
     required double spacing,
     required OverflowViewLayoutBehavior layoutBehavior,
+    required MainAxisAlignment mainAxisAlignment,
+    required CrossAxisAlignment crossAxisAlignment,
+    required bool expandFirstChild,
   })  : assert(spacing > double.negativeInfinity && spacing < double.infinity),
         _direction = direction,
         _spacing = spacing,
+        _mainAxisAlignment = mainAxisAlignment,
         _layoutBehavior = layoutBehavior,
+        _crossAxisAlignment = crossAxisAlignment,
+        _expandFirstChild = expandFirstChild,
         _isHorizontal = direction == Axis.horizontal {
     addAll(children);
   }
 
+  MainAxisAlignment get mainAxisAlignment => _mainAxisAlignment;
+  MainAxisAlignment _mainAxisAlignment;
+  set mainAxisAlignment(MainAxisAlignment value) {
+    if (_mainAxisAlignment != value) {
+      _mainAxisAlignment = value;
+      markNeedsLayout();
+    }
+  }
+
+  CrossAxisAlignment get crossAxisAlignment => _crossAxisAlignment;
+  CrossAxisAlignment _crossAxisAlignment;
+  set crossAxisAlignment(CrossAxisAlignment value) {
+    if (_crossAxisAlignment != value) {
+      _crossAxisAlignment = value;
+      markNeedsLayout();
+    }
+  }
+
   Axis get direction => _direction;
   Axis _direction;
   set direction(Axis value) {
@@ -59,11 +83,19 @@ class RenderOverflowView extends RenderBox
     }
   }
 
+  bool get expandFirstChild => _expandFirstChild;
+  bool _expandFirstChild;
+  set expandFirstChild(bool value) {
+    if (_expandFirstChild != value) {
+      _expandFirstChild = value;
+      markNeedsLayout();
+    }
+  }
+
   bool _isHorizontal;
   @override
   void setupParentData(RenderBox child) {
-    if (child.parentData is! OverflowViewParentData)
-      child.parentData = OverflowViewParentData();
+    if (child.parentData is! OverflowViewParentData) child.parentData = OverflowViewParentData();
   }
 
   double _getCrossSize(RenderBox child) {
@@ -84,6 +116,19 @@ class RenderOverflowView extends RenderBox
     }
   }
 
+  double _calculateMainAxisAlignmentOffset(double totalChildrenSize, double availableSize) {
+    switch (mainAxisAlignment) {
+      case MainAxisAlignment.start:
+        return 0.0;
+      case MainAxisAlignment.end:
+        return availableSize - totalChildrenSize;
+      case MainAxisAlignment.center:
+        return (availableSize - totalChildrenSize) / 2.0;
+      default:
+        return 0.0;
+    }
+  }
+
   bool _hasOverflow = false;
 
   @override
@@ -94,26 +139,25 @@ class RenderOverflowView extends RenderBox
     if (layoutBehavior == OverflowViewLayoutBehavior.fixed) {
       performFixedLayout();
     } else {
-      performFlexibleLayout();
+      _performFlexibleLayout();
     }
   }
 
   void resetOffstage() {
     visitChildren((child) {
-      final OverflowViewParentData childParentData =
-          child.parentData as OverflowViewParentData;
+      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
       childParentData.offstage = null;
     });
   }
 
   void performFixedLayout() {
     RenderBox child = firstChild!;
+
     final BoxConstraints childConstraints = constraints.loosen();
-    final double maxExtent =
-        _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
 
-    OverflowViewParentData childParentData =
-        child.parentData as OverflowViewParentData;
+    final double maxExtent = _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
+
+    OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
     child.layout(childConstraints, parentUsesSize: true);
     final double childExtent = child.size.getMainExtent(direction);
     final double crossExtent = child.size.getCrossExtent(direction);
@@ -122,26 +166,22 @@ class RenderOverflowView extends RenderBox
         : childConstraints.tighten(height: childExtent, width: crossExtent);
 
     final double childStride = childExtent + spacing;
-    Offset getChildOffset(int index) {
-      final double mainAxisOffset = index * childStride;
-      final double crossAxisOffset = 0;
-      if (_isHorizontal) {
-        return Offset(mainAxisOffset, crossAxisOffset);
-      } else {
-        return Offset(crossAxisOffset, mainAxisOffset);
-      }
-    }
 
     int onstageCount = 0;
     final int count = childCount - 1;
-    final double requestedExtent =
-        childExtent * (childCount - 1) + spacing * (childCount - 2);
-    final int renderedChildCount = requestedExtent <= maxExtent
-        ? count
-        : (maxExtent + spacing) ~/ childStride - 1;
+    final double requestedExtent = childExtent * (childCount - 1) + spacing * (childCount - 2);
+    final int renderedChildCount = requestedExtent <= maxExtent ? count : (maxExtent + spacing) ~/ childStride - 1;
     final int unRenderedChildCount = count - renderedChildCount;
+
+    // Calculate the total size of rendered children
+    final double totalRenderedSize = renderedChildCount * childStride - spacing;
+
+    // Calculate alignment offset
+    final double alignmentOffset = _calculateMainAxisAlignmentOffset(totalRenderedSize, maxExtent);
+
     if (renderedChildCount > 0) {
       childParentData.offstage = false;
+      childParentData.offset = _isHorizontal ? Offset(alignmentOffset, 0) : Offset(0, alignmentOffset);
       onstageCount++;
     }
 
@@ -149,7 +189,8 @@ class RenderOverflowView extends RenderBox
       child = childParentData.nextSibling!;
       childParentData = child.parentData as OverflowViewParentData;
       child.layout(otherChildConstraints);
-      childParentData.offset = getChildOffset(i);
+      childParentData.offset =
+          _isHorizontal ? Offset(alignmentOffset + i * childStride, 0) : Offset(0, alignmentOffset + i * childStride);
       childParentData.offstage = false;
       onstageCount++;
     }
@@ -164,166 +205,171 @@ class RenderOverflowView extends RenderBox
       // We have to layout the overflow indicator.
       final RenderBox overflowIndicator = lastChild!;
 
-      final BoxValueConstraints<int> overflowIndicatorConstraints =
-          BoxValueConstraints<int>(
+      final BoxValueConstraints<int> overflowIndicatorConstraints = BoxValueConstraints<int>(
         value: unRenderedChildCount,
         constraints: otherChildConstraints,
       );
       overflowIndicator.layout(overflowIndicatorConstraints);
-      final OverflowViewParentData overflowIndicatorParentData =
-          overflowIndicator.parentData as OverflowViewParentData;
-      overflowIndicatorParentData.offset = getChildOffset(renderedChildCount);
+      final OverflowViewParentData overflowIndicatorParentData = overflowIndicator.parentData as OverflowViewParentData;
+      overflowIndicatorParentData.offset = _isHorizontal
+          ? Offset(alignmentOffset + renderedChildCount * childStride, 0)
+          : Offset(0, alignmentOffset + renderedChildCount * childStride);
       overflowIndicatorParentData.offstage = false;
       onstageCount++;
     }
 
     final double mainAxisExtent = onstageCount * childStride - spacing;
-    final requestedSize = _isHorizontal
-        ? Size(mainAxisExtent, crossExtent)
-        : Size(crossExtent, mainAxisExtent);
+    final requestedSize = _isHorizontal ? Size(mainAxisExtent, crossExtent) : Size(crossExtent, mainAxisExtent);
 
     size = constraints.constrain(requestedSize);
   }
 
-  void performFlexibleLayout() {
-    RenderBox child = firstChild!;
-    List<RenderBox> renderBoxes = <RenderBox>[];
-    int unRenderedChildCount = childCount - 1;
-    double availableExtent =
-        _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
-    double offset = 0;
-    final double maxCrossExtent =
-        _isHorizontal ? constraints.maxHeight : constraints.maxWidth;
-
-    final BoxConstraints childConstraints = _isHorizontal
+  BoxConstraints _getChildrenConstraints() {
+    final double maxCrossExtent = _isHorizontal ? constraints.maxHeight : constraints.maxWidth;
+    return _isHorizontal
         ? BoxConstraints.loose(Size(double.infinity, maxCrossExtent))
         : BoxConstraints.loose(Size(maxCrossExtent, double.infinity));
+  }
+
+  List<RenderBox> _applyChildrenConstraints() {
+    RenderBox child = firstChild!;
+
+    final List<RenderBox> children = <RenderBox>[];
 
-    bool showOverflowIndicator = false;
     while (child != lastChild) {
-      final OverflowViewParentData childParentData =
-          child.parentData as OverflowViewParentData;
+      final childParentData = child.parentData as OverflowViewParentData;
+      child.layout(_getChildrenConstraints(), parentUsesSize: true);
+      children.add(child);
+      child = childParentData.nextSibling!;
+    }
+
+    return children;
+  }
 
-      child.layout(childConstraints, parentUsesSize: true);
+  void _performFlexibleLayout() {
+    double availableExtent = _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
 
-      final double childMainSize = _getMainSize(child);
+    bool showOverflowIndicator = false;
 
-      if (childMainSize <= availableExtent) {
-        // We have room to paint this child.
-        renderBoxes.add(child);
+    // First we retrieve the size of all the children.
+
+    final children = _applyChildrenConstraints();
+
+    double maxCrossSize = 0;
+
+    double filledExtent = 0;
+    int fittingChildren = 0;
+
+    for (final child in children) {
+      final childParentData = child.parentData as OverflowViewParentData;
+      double childMainSize = _getMainSize(child);
+      double childCrossSize = _getCrossSize(child);
+
+      maxCrossSize = math.max(maxCrossSize, childCrossSize);
+
+      if (filledExtent + childMainSize <= availableExtent) {
         childParentData.offstage = false;
-        childParentData.offset =
-            _isHorizontal ? Offset(offset, 0) : Offset(0, offset);
-
-        final double childStride = spacing + childMainSize;
-        offset += childStride;
-        availableExtent -= childStride;
-        unRenderedChildCount--;
-        child = childParentData.nextSibling!;
+        filledExtent += childMainSize + spacing;
+        fittingChildren++;
       } else {
-        // We have no room to paint any further child.
         showOverflowIndicator = true;
+        childParentData.offstage = true;
         break;
       }
     }
 
     if (showOverflowIndicator) {
-      // We didn't layout all the children.
+      // We need to place the overflow indicator. To do this we
+      // might need to remove children until it fits.
       final RenderBox overflowIndicator = lastChild!;
-      final BoxValueConstraints<int> overflowIndicatorConstraints =
-          BoxValueConstraints<int>(
-        value: unRenderedChildCount,
-        constraints: childConstraints,
+      final BoxValueConstraints<int> overflowIndicatorConstraints = BoxValueConstraints<int>(
+        value: childCount - fittingChildren - 1,
+        constraints: _getChildrenConstraints(),
       );
+
       overflowIndicator.layout(
         overflowIndicatorConstraints,
         parentUsesSize: true,
       );
 
-      final double childMainSize = _getMainSize(overflowIndicator);
+      final OverflowViewParentData overflowIndicatorParentData = overflowIndicator.parentData as OverflowViewParentData;
+      overflowIndicatorParentData.offstage = false;
 
-      // We need to remove the children that prevent the overflowIndicator
-      // to paint.
-      while (childMainSize > availableExtent && renderBoxes.isNotEmpty) {
-        final RenderBox child = renderBoxes.removeLast();
-        final OverflowViewParentData childParentData =
-            child.parentData as OverflowViewParentData;
-        childParentData.offstage = true;
-        final double childStride = _getMainSize(child) + spacing;
+      double indicatorSize = _getMainSize(overflowIndicator) + spacing;
 
-        availableExtent += childStride;
-        unRenderedChildCount++;
-        offset -= childStride;
-      }
+      filledExtent += indicatorSize;
 
-      if (childMainSize > availableExtent) {
-        // We cannot paint any child because there is not enough space.
-        _hasOverflow = true;
+      while (filledExtent >= availableExtent) {
+        final RenderBox lastChild = children.last;
+        final OverflowViewParentData lastChildParentData = lastChild.parentData as OverflowViewParentData;
+        lastChildParentData.offstage = true;
+        children.removeLast();
+        fittingChildren--;
+        final freed = _getMainSize(lastChild);
+        filledExtent -= freed;
       }
 
-      if (overflowIndicatorConstraints.value != unRenderedChildCount) {
-        // The number of unrendered child changed, we have to layout the
-        // indicator another time.
-        overflowIndicator.layout(
-          BoxValueConstraints<int>(
-            value: unRenderedChildCount,
-            constraints: childConstraints,
-          ),
-          parentUsesSize: true,
-        );
-      }
+      children.add(overflowIndicator);
 
-      renderBoxes.add(overflowIndicator);
+      maxCrossSize = math.max(maxCrossSize, _getCrossSize(overflowIndicator));
+    }
 
-      final OverflowViewParentData overflowIndicatorParentData =
-          overflowIndicator.parentData as OverflowViewParentData;
-      overflowIndicatorParentData.offset =
-          _isHorizontal ? Offset(offset, 0) : Offset(0, offset);
-      overflowIndicatorParentData.offstage = false;
-      offset += childMainSize;
-    } else {
-      // We layout all children. We need to adjust the offset used to compute
-      // the final size.
-      offset -= spacing;
-
-      // We need to layout the overflowIndicator because we may have already
-      // laid it out with parentUsesSize: true before.
-      // When unmounting a _LayoutBuilderElement, it calls markNeedsLayout
-      // a last time, and can cause error.
-      lastChild?.layout(BoxValueConstraints<int>(
-        value: unRenderedChildCount,
-        constraints: childConstraints,
-      ));
+    // Now we now the extent of all children that will be painted.
+    // We can now calculate the offsets and the remaining space.
+
+    double remainder = availableExtent - filledExtent;
 
-      // Because the overflow indicator will be paint outside of the screen,
-      // we need to say that there is an overflow.
-      _hasOverflow = true;
+    if (expandFirstChild) {
+      double childMainSize = _getMainSize(children.first);
+
+      firstChild!.layout(
+        BoxConstraints.tight(Size(childMainSize + remainder, maxCrossSize)),
+        parentUsesSize: true,
+      );
+
+      remainder = 0;
+    }
+
+    double offset = 0;
+
+    // If we try to center the children we start with half the remaining space.
+    if (mainAxisAlignment == MainAxisAlignment.center) {
+      offset = remainder / 2;
+    }
+
+    // If we try to align the children at the end we start with the remaining space.
+    if (mainAxisAlignment == MainAxisAlignment.end) {
+      offset = remainder;
     }
 
-    final double crossSize = renderBoxes.fold(
-      0,
-      (previousValue, element) => math.max(
-        previousValue,
-        _getCrossSize(element),
-      ),
-    );
-
-    // By default we center all children in the cross-axis.
-    for (final child in renderBoxes) {
-      final double childCrossPosition =
-          crossSize / 2.0 - _getCrossSize(child) / 2.0;
-      final OverflowViewParentData childParentData =
-          child.parentData as OverflowViewParentData;
-      childParentData.offset = _isHorizontal
-          ? Offset(childParentData.offset.dx, childCrossPosition)
-          : Offset(childCrossPosition, childParentData.offset.dy);
+    for (final child in children.where((child) => child.isOnstage)) {
+      final childParentData = child.parentData as OverflowViewParentData;
+
+      final double childCrossSize = _getCrossSize(child);
+
+      double childCrossOffset = 0;
+
+      if (crossAxisAlignment == CrossAxisAlignment.start) {
+        childCrossOffset = 0;
+      } else if (crossAxisAlignment == CrossAxisAlignment.end) {
+        childCrossOffset = maxCrossSize - childCrossSize;
+      } else if (crossAxisAlignment == CrossAxisAlignment.center) {
+        childCrossOffset = (maxCrossSize - childCrossSize) / 2;
+      }
+
+      if (_isHorizontal) {
+        childParentData.offset = Offset(offset, childCrossOffset);
+      } else {
+        childParentData.offset = Offset(childCrossOffset, offset);
+      }
+      offset += _getMainSize(child) + spacing;
     }
 
     Size idealSize;
     if (_isHorizontal) {
-      idealSize = Size(offset, crossSize);
+      idealSize = Size(offset, maxCrossSize);
     } else {
-      idealSize = Size(crossSize, offset);
+      idealSize = Size(maxCrossSize, offset);
     }
 
     size = constraints.constrain(idealSize);
@@ -345,8 +391,7 @@ class RenderOverflowView extends RenderBox
   @override
   void paint(PaintingContext context, Offset offset) {
     void paintChild(RenderObject child) {
-      final OverflowViewParentData childParentData =
-          child.parentData as OverflowViewParentData;
+      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
       if (childParentData.offstage == false) {
         context.paintChild(child, childParentData.offset + offset);
       } else {
@@ -377,8 +422,7 @@ class RenderOverflowView extends RenderBox
     // The x, y parameters have the top left of the node's box as the origin.
     visitOnlyOnStageChildren((renderObject) {
       final RenderBox child = renderObject as RenderBox;
-      final OverflowViewParentData childParentData =
-          child.parentData as OverflowViewParentData;
+      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
       result.addWithPaintOffset(
         offset: childParentData.offset,
         position: position,
@@ -404,6 +448,5 @@ extension on Size {
 }
 
 extension RenderObjectExtensions on RenderObject {
-  bool get isOnstage =>
-      (parentData as OverflowViewParentData).offstage == false;
+  bool get isOnstage => (parentData as OverflowViewParentData).offstage == false;
 }
diff --git a/lib/src/widgets/overflow_view.dart b/lib/src/widgets/overflow_view.dart
index 4136745..b0fc966 100644
--- a/lib/src/widgets/overflow_view.dart
+++ b/lib/src/widgets/overflow_view.dart
@@ -23,15 +23,21 @@ class OverflowView extends MultiChildRenderObjectWidget {
   OverflowView({
     Key? key,
     required OverflowIndicatorBuilder builder,
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start,
+    CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
     Axis direction = Axis.horizontal,
     required List<Widget> children,
+    bool expandFirstChild = false,
     double spacing = 0,
   }) : this._all(
           key: key,
           builder: builder,
+          mainAxisAlignment: mainAxisAlignment,
+          crossAxisAlignment: crossAxisAlignment,
           direction: direction,
           children: children,
           spacing: spacing,
+          expandFirstChild: expandFirstChild,
           layoutBehavior: OverflowViewLayoutBehavior.fixed,
         );
 
@@ -44,26 +50,34 @@ class OverflowView extends MultiChildRenderObjectWidget {
     Key? key,
     required OverflowIndicatorBuilder builder,
     Axis direction = Axis.horizontal,
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start,
+    CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
     required List<Widget> children,
+    bool expandFirstChild = false,
     double spacing = 0,
   }) : this._all(
           key: key,
           builder: builder,
           direction: direction,
+          mainAxisAlignment: mainAxisAlignment,
           children: children,
           spacing: spacing,
+          expandFirstChild: expandFirstChild,
+          crossAxisAlignment: crossAxisAlignment,
           layoutBehavior: OverflowViewLayoutBehavior.flexible,
         );
 
   OverflowView._all({
     Key? key,
     required OverflowIndicatorBuilder builder,
+    this.mainAxisAlignment = MainAxisAlignment.start,
+    this.crossAxisAlignment = CrossAxisAlignment.center,
     this.direction = Axis.horizontal,
     required List<Widget> children,
     this.spacing = 0,
+    this.expandFirstChild = false,
     required OverflowViewLayoutBehavior layoutBehavior,
-  })  : assert(spacing > double.negativeInfinity &&
-            spacing < double.infinity),
+  })  : assert(spacing > double.negativeInfinity && spacing < double.infinity),
         _layoutBehavior = layoutBehavior,
         super(
           key: key,
@@ -88,6 +102,21 @@ class OverflowView extends MultiChildRenderObjectWidget {
 
   final OverflowViewLayoutBehavior _layoutBehavior;
 
+  /// The alignment of the children along the main axis.
+  ///
+  /// For example, if [mainAxisAlignment] is [MainAxisAlignment.end], the
+  /// children are placed at the end of the main axis.
+  final MainAxisAlignment mainAxisAlignment;
+
+  /// The alignment of the children along the cross axis.
+  ///
+  /// For example, if [crossAxisAlignment] is [CrossAxisAlignment.end], the
+  /// children are placed at the end of the cross axis.
+  final CrossAxisAlignment crossAxisAlignment;
+
+  /// Whether the first child should be expanded to fill the available space.
+  final bool expandFirstChild;
+
   @override
   _OverflowViewElement createElement() {
     return _OverflowViewElement(this);
@@ -96,9 +125,12 @@ class OverflowView extends MultiChildRenderObjectWidget {
   @override
   RenderOverflowView createRenderObject(BuildContext context) {
     return RenderOverflowView(
+      expandFirstChild: expandFirstChild,
       direction: direction,
       spacing: spacing,
       layoutBehavior: _layoutBehavior,
+      mainAxisAlignment: mainAxisAlignment,
+      crossAxisAlignment: crossAxisAlignment,
     );
   }
 
@@ -110,7 +142,10 @@ class OverflowView extends MultiChildRenderObjectWidget {
     renderObject
       ..direction = direction
       ..spacing = spacing
-      ..layoutBehavior = _layoutBehavior;
+      ..layoutBehavior = _layoutBehavior
+      ..mainAxisAlignment = mainAxisAlignment
+      ..expandFirstChild = expandFirstChild
+      ..crossAxisAlignment = crossAxisAlignment;
   }
 }
 

From 78b7982e4fdda958d0ff724836f46d06e31911bf Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Wed, 16 Jul 2025 16:22:13 +0200
Subject: [PATCH 03/10] fix: overflowing overflow indicator

---
 example/lib/avatars.dart             |  86 +++++++
 example/lib/main.dart                | 332 +++++++++------------------
 lib/src/rendering/overflow_view.dart |  17 +-
 3 files changed, 202 insertions(+), 233 deletions(-)
 create mode 100644 example/lib/avatars.dart

diff --git a/example/lib/avatars.dart b/example/lib/avatars.dart
new file mode 100644
index 0000000..962f9b3
--- /dev/null
+++ b/example/lib/avatars.dart
@@ -0,0 +1,86 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:overflow_view/overflow_view.dart';
+
+class Avatar {
+  const Avatar(this.initials, this.color);
+  final String initials;
+  final Color color;
+}
+
+String getInitials(int index) {
+  return String.fromCharCode(65 + (index % 26 + 1));
+}
+
+Color getColor(int index) {
+  return Colors.primaries[index % Colors.primaries.length].shade500;
+}
+
+List<Avatar> generateAvatars(int count) {
+  return List.generate(count + 1, (index) => Avatar(getInitials(index), getColor(index)));
+}
+
+class Avatars extends StatefulWidget {
+  const Avatars({super.key});
+
+  @override
+  State<Avatars> createState() => _AvatarsState();
+}
+
+class _AvatarsState extends State<Avatars> {
+  int _avatarCount = 5;
+
+  @override
+  Widget build(BuildContext context) {
+    final avatars = generateAvatars(_avatarCount);
+
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        OverflowView.flexible(
+          spacing: -40,
+          children: <Widget>[
+            for (int i = 0; i < avatars.length; i++) AvatarWidget(text: avatars[i].initials, color: avatars[i].color)
+          ],
+          builder: (context, remaining) {
+            return AvatarWidget(
+              text: '+$remaining',
+              color: Colors.red,
+            );
+          },
+        ),
+        Slider(
+          value: _avatarCount.toDouble(),
+          min: 1,
+          max: 50,
+          onChanged: (value) => setState(() => _avatarCount = value.toInt()),
+        ),
+      ],
+    );
+  }
+}
+
+class AvatarWidget extends StatelessWidget {
+  const AvatarWidget({
+    Key? key,
+    required this.text,
+    required this.color,
+  }) : super(key: key);
+
+  final String text;
+  final Color color;
+
+  @override
+  Widget build(BuildContext context) {
+    return CircleAvatar(
+      radius: 40,
+      backgroundColor: color,
+      foregroundColor: Colors.white,
+      child: Text(
+        text,
+        style: TextStyle(fontSize: 30),
+      ),
+    );
+  }
+}
diff --git a/example/lib/main.dart b/example/lib/main.dart
index 72dc629..17addbc 100644
--- a/example/lib/main.dart
+++ b/example/lib/main.dart
@@ -1,3 +1,6 @@
+import 'dart:math';
+
+import 'package:example/avatars.dart';
 import 'package:flutter/material.dart';
 import 'package:overflow_view/overflow_view.dart';
 
@@ -9,12 +12,12 @@ class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-      title: 'Flutter Demo',
+      title: 'Overflow View Demo',
       theme: ThemeData(
         primarySwatch: Colors.blue,
         visualDensity: VisualDensity.adaptivePlatformDensity,
       ),
-      home: MyHomePage(title: 'Flutter Demo Home Page'),
+      home: MyHomePage(title: 'Overflow View Demo'),
     );
   }
 }
@@ -28,245 +31,117 @@ class MyHomePage extends StatefulWidget {
   _MyHomePageState createState() => _MyHomePageState();
 }
 
-class Avatar {
-  const Avatar(this.initials, this.color);
-  final String initials;
-  final Color color;
-}
-
-const List<Avatar> avatars = <Avatar>[
-  Avatar('AD', Colors.green),
-  Avatar('JG', Colors.pink),
-  Avatar('DA', Colors.blue),
-  Avatar('JA', Colors.black),
-  Avatar('CB', Colors.amber),
-  Avatar('RR', Colors.deepPurple),
-  Avatar('JD', Colors.pink),
-  Avatar('MB', Colors.amberAccent),
-  Avatar('AA', Colors.blueAccent),
-  Avatar('BA', Colors.tealAccent),
-  Avatar('CR', Colors.yellow),
-];
-
 class _MyHomePageState extends State<MyHomePage> {
-  int _counter = 1;
-  double ratio = 1;
-
-  void _incrementCounter() {
-    setState(() {
-      _counter = (_counter + 1).clamp(0, avatars.length - 1);
-    });
-  }
+  MainAxisAlignment _mainAxisAlignment = MainAxisAlignment.start;
+  CrossAxisAlignment _crossAxisAlignment = CrossAxisAlignment.start;
+  bool _expandFirstChild = false;
 
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: AppBar(
-        title: Text(widget.title),
-      ),
-      body: SafeArea(
-        child: SingleChildScrollView(
-          child: Column(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              /*Text(
-                'People',
-                style: TextStyle(fontSize: 20),
-              ),
-              SizedBox(height: 20),
-              OverflowView.flexible(
-                spacing: -40,
-                children: <Widget>[
-                  for (int i = 0; i < _counter; i++)
-                    AvatarWidget(
-                      text: avatars[i].initials,
-                      color: avatars[i].color,
-                    )
-                ],
-                builder: (context, remaining) {
-                  return AvatarWidget(
-                    text: '+$remaining',
-                    color: Colors.red,
-                  );
-                },
-              ),*/
-
-              Text('MainAxisAlignment.start'),
-              FractionallySizedBox(
-                widthFactor: ratio,
-                child: CommandBar(mainAxisAlignment: MainAxisAlignment.start),
-              ),
-              Text('MainAxisAlignment.end'),
-              SizedBox(height: 20),
-              FractionallySizedBox(
-                widthFactor: ratio,
-                child: CommandBar(mainAxisAlignment: MainAxisAlignment.end),
-              ),
-              Text('MainAxisAlignment.center'),
-              CommandBar(mainAxisAlignment: MainAxisAlignment.center),
-              SizedBox(height: 20),
-              /*Expanded(
-                child: OverflowView(
-                  direction: Axis.vertical,
-                  spacing: 4,
-                  children: <Widget>[
-                    for (int i = 0; i < _counter; i++)
-                      AvatarWidget(
-                        text: avatars[i].initials,
-                        color: avatars[i].color,
-                      )
+        appBar: AppBar(
+          title: Text(widget.title),
+        ),
+        body: SafeArea(
+          child: SingleChildScrollView(
+            padding: EdgeInsets.all(0),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(
+                  'Avatars',
+                  style: TextStyle(fontSize: 20),
+                ),
+                SizedBox(height: 20),
+                Avatars(),
+                Divider(),
+                Text('Command Bar', style: TextStyle(fontSize: 20)),
+                Wrap(
+                  spacing: 10,
+                  runSpacing: 10,
+                  children: [
+                    Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text('MainAxisAlignment'),
+                        SizedBox(height: 10),
+                        SegmentedButton<MainAxisAlignment>(
+                          segments: [
+                            ButtonSegment(value: MainAxisAlignment.start, label: Text('Start')),
+                            ButtonSegment(value: MainAxisAlignment.center, label: Text('Center')),
+                            ButtonSegment(value: MainAxisAlignment.end, label: Text('End')),
+                          ],
+                          selected: {_mainAxisAlignment},
+                          onSelectionChanged: (value) {
+                            setState(() {
+                              _mainAxisAlignment = value.first;
+                            });
+                          },
+                        ),
+                      ],
+                    ),
+                    Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text('CrossAxisAlignment'),
+                        SizedBox(height: 10),
+                        SegmentedButton<CrossAxisAlignment>(
+                          segments: [
+                            ButtonSegment(value: CrossAxisAlignment.start, label: Text('Start')),
+                            ButtonSegment(value: CrossAxisAlignment.center, label: Text('Center')),
+                            ButtonSegment(value: CrossAxisAlignment.end, label: Text('End')),
+                          ],
+                          selected: {_crossAxisAlignment},
+                          onSelectionChanged: (value) {
+                            setState(() {
+                              _crossAxisAlignment = value.first;
+                            });
+                          },
+                        ),
+                      ],
+                    ),
+                    Row(
+                      children: [
+                        Switch(
+                          value: _expandFirstChild,
+                          onChanged: (value) {
+                            setState(() {
+                              _expandFirstChild = value;
+                            });
+                          },
+                        ),
+                        Text('Expand first child'),
+                      ],
+                    ),
                   ],
-                  builder: (context, remaining) {
-                    return SizedBox(
-                      height: 80,
-                      width: 80,
-                      child: Stack(
-                        fit: StackFit.expand,
-                        children: [
-                          if (remaining > 0)
-                            AvatarOverview(
-                              position: 0,
-                              remaining: remaining,
-                              counter: _counter,
-                            ),
-                          if (remaining > 1)
-                            AvatarOverview(
-                              position: 1,
-                              remaining: remaining,
-                              counter: _counter,
-                            ),
-                          if (remaining > 2)
-                            AvatarOverview(
-                              position: 2,
-                              remaining: remaining,
-                              counter: _counter,
-                            ),
-                          if (remaining > 3)
-                            AvatarOverview(
-                              position: 3,
-                              remaining: remaining,
-                              counter: _counter,
-                            ),
-                          Positioned.fill(
-                            child: Center(
-                              child: FractionallySizedBox(
-                                alignment: Alignment.center,
-                                widthFactor: 0.5,
-                                heightFactor: 0.5,
-                                child: FittedBox(
-                                  child: AvatarWidget(
-                                    text: '+$remaining',
-                                    color: Colors.black.withOpacity(0.9),
-                                  ),
-                                ),
-                              ),
-                            ),
-                          ),
-                        ],
-                      ),
-                    );
-                  },
                 ),
-              ),*/
-              // Slider(
-              //   value: ratio,
-              //   min: 0,
-              //   max: 1,
-              //   divisions: 100,
-              //   onChanged: (value) {
-              //     setState(() {
-              //       ratio = value;
-              //     });
-              //   },
-              // ),
-              SizedBox(height: 40),
-            ],
+                Container(
+                  width: double.infinity,
+                  child: Card(
+                    child: CommandBar(
+                      mainAxisAlignment: _mainAxisAlignment,
+                      crossAxisAlignment: _crossAxisAlignment,
+                      expandFirstChild: _expandFirstChild,
+                    ),
+                  ),
+                ),
+              ],
+            ),
           ),
-        ),
-      ),
-      floatingActionButton: FloatingActionButton(
-        onPressed: _incrementCounter,
-        tooltip: 'Increment',
-        child: Icon(Icons.add),
-      ),
-    );
-  }
-}
-
-class AvatarOverview extends StatelessWidget {
-  AvatarOverview({
-    Key? key,
-    required int remaining,
-    required int position,
-    required int counter,
-  })  : index = counter - remaining + position,
-        alignment = _getAlignment(position),
-        super(key: key);
-
-  final int index;
-  final Alignment alignment;
-
-  @override
-  Widget build(BuildContext context) {
-    final Avatar avatar = avatars[index];
-    return FractionallySizedBox(
-      key: ValueKey(index),
-      alignment: alignment,
-      widthFactor: 0.5,
-      heightFactor: 0.5,
-      child: FittedBox(
-        child: AvatarWidget(
-          text: avatar.initials,
-          color: avatar.color,
-        ),
-      ),
-    );
-  }
-
-  static Alignment _getAlignment(int position) {
-    switch (position) {
-      case 0:
-        return Alignment.topLeft;
-      case 1:
-        return Alignment.topRight;
-      case 2:
-        return Alignment.bottomLeft;
-      default:
-        return Alignment.bottomRight;
-    }
-  }
-}
-
-class AvatarWidget extends StatelessWidget {
-  const AvatarWidget({
-    Key? key,
-    required this.text,
-    required this.color,
-  }) : super(key: key);
-
-  final String text;
-  final Color color;
-
-  @override
-  Widget build(BuildContext context) {
-    return CircleAvatar(
-      radius: 40,
-      backgroundColor: color,
-      foregroundColor: Colors.white,
-      child: Text(
-        text,
-        style: TextStyle(fontSize: 30),
-      ),
-    );
+        ));
   }
 }
 
 class CommandBar extends StatelessWidget {
   final MainAxisAlignment mainAxisAlignment;
+  final CrossAxisAlignment crossAxisAlignment;
+  final bool expandFirstChild;
 
   const CommandBar({
     Key? key,
     this.mainAxisAlignment = MainAxisAlignment.start,
+    this.crossAxisAlignment = CrossAxisAlignment.start,
+    this.expandFirstChild = false,
   }) : super(key: key);
 
   @override
@@ -285,11 +160,14 @@ class CommandBar extends StatelessWidget {
 
     return OverflowView.flexible(
       spacing: 4,
-      expandFirstChild: true,
+      expandFirstChild: expandFirstChild,
       mainAxisAlignment: mainAxisAlignment,
-      crossAxisAlignment: CrossAxisAlignment.start,
+      crossAxisAlignment: crossAxisAlignment,
       children: [
-        SizedBox(height: 200, child: Text('Hello this is a long text for testing the ')),
+        Align(
+          alignment: Alignment.centerLeft,
+          child: Text('Menu title'),
+        ),
         ...commands.map((e) => _MenuItem(data: e))
       ],
       builder: (context, remaining) {
diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index 300b37e..d53c225 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -278,6 +278,8 @@ class RenderOverflowView extends RenderBox
       }
     }
 
+    final renderedChildren = children.where((child) => child.isOnstage).toList();
+
     if (showOverflowIndicator) {
       // We need to place the overflow indicator. To do this we
       // might need to remove children until it fits.
@@ -297,19 +299,20 @@ class RenderOverflowView extends RenderBox
 
       double indicatorSize = _getMainSize(overflowIndicator) + spacing;
 
-      filledExtent += indicatorSize;
+      filledExtent += indicatorSize + spacing;
 
       while (filledExtent >= availableExtent) {
-        final RenderBox lastChild = children.last;
+        print("Removing child $fittingChildren of ${renderedChildren.length}");
+        final RenderBox lastChild = renderedChildren.last;
         final OverflowViewParentData lastChildParentData = lastChild.parentData as OverflowViewParentData;
         lastChildParentData.offstage = true;
-        children.removeLast();
+        renderedChildren.removeLast();
         fittingChildren--;
-        final freed = _getMainSize(lastChild);
+        final freed = _getMainSize(lastChild) + spacing;
         filledExtent -= freed;
       }
 
-      children.add(overflowIndicator);
+      renderedChildren.add(overflowIndicator);
 
       maxCrossSize = math.max(maxCrossSize, _getCrossSize(overflowIndicator));
     }
@@ -319,6 +322,8 @@ class RenderOverflowView extends RenderBox
 
     double remainder = availableExtent - filledExtent;
 
+    print("Filled extent: $filledExtent of $availableExtent . Remaining $remainder");
+
     if (expandFirstChild) {
       double childMainSize = _getMainSize(children.first);
 
@@ -342,7 +347,7 @@ class RenderOverflowView extends RenderBox
       offset = remainder;
     }
 
-    for (final child in children.where((child) => child.isOnstage)) {
+    for (final child in renderedChildren) {
       final childParentData = child.parentData as OverflowViewParentData;
 
       final double childCrossSize = _getCrossSize(child);

From 6db2facfeca037673f4612fc2cb297faad4ac13b Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Wed, 16 Jul 2025 16:34:34 +0200
Subject: [PATCH 04/10] fix: extra trailing spacing

---
 lib/src/rendering/overflow_view.dart | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index d53c225..9c8fcfb 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -297,15 +297,16 @@ class RenderOverflowView extends RenderBox
       final OverflowViewParentData overflowIndicatorParentData = overflowIndicator.parentData as OverflowViewParentData;
       overflowIndicatorParentData.offstage = false;
 
-      double indicatorSize = _getMainSize(overflowIndicator) + spacing;
+      double indicatorSize = _getMainSize(overflowIndicator);
 
-      filledExtent += indicatorSize + spacing;
+      filledExtent += spacing + indicatorSize;
 
       while (filledExtent >= availableExtent) {
-        print("Removing child $fittingChildren of ${renderedChildren.length}");
         final RenderBox lastChild = renderedChildren.last;
+
         final OverflowViewParentData lastChildParentData = lastChild.parentData as OverflowViewParentData;
         lastChildParentData.offstage = true;
+
         renderedChildren.removeLast();
         fittingChildren--;
         final freed = _getMainSize(lastChild) + spacing;
@@ -320,9 +321,10 @@ class RenderOverflowView extends RenderBox
     // Now we now the extent of all children that will be painted.
     // We can now calculate the offsets and the remaining space.
 
-    double remainder = availableExtent - filledExtent;
+    // Trim the last spacing..
+    filledExtent -= spacing;
 
-    print("Filled extent: $filledExtent of $availableExtent . Remaining $remainder");
+    double remainder = availableExtent - filledExtent;
 
     if (expandFirstChild) {
       double childMainSize = _getMainSize(children.first);

From ff095b428b76006568dbd8460176a826d79db74f Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Wed, 16 Jul 2025 22:34:22 +0200
Subject: [PATCH 05/10] fix: negative spacing exceeding the container

---
 lib/src/rendering/overflow_view.dart | 28 +++++++++++++++-------------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index 9c8fcfb..0570233 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -246,6 +246,13 @@ class RenderOverflowView extends RenderBox
     return children;
   }
 
+  double _spacingExtent(int childCount) {
+    if (childCount == 0) {
+      return 0;
+    }
+    return spacing * (childCount - 1);
+  }
+
   void _performFlexibleLayout() {
     double availableExtent = _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
 
@@ -267,9 +274,9 @@ class RenderOverflowView extends RenderBox
 
       maxCrossSize = math.max(maxCrossSize, childCrossSize);
 
-      if (filledExtent + childMainSize <= availableExtent) {
+      if (filledExtent + childMainSize + _spacingExtent(fittingChildren) <= availableExtent) {
         childParentData.offstage = false;
-        filledExtent += childMainSize + spacing;
+        filledExtent += childMainSize;
         fittingChildren++;
       } else {
         showOverflowIndicator = true;
@@ -298,10 +305,9 @@ class RenderOverflowView extends RenderBox
       overflowIndicatorParentData.offstage = false;
 
       double indicatorSize = _getMainSize(overflowIndicator);
+      filledExtent += indicatorSize;
 
-      filledExtent += spacing + indicatorSize;
-
-      while (filledExtent >= availableExtent) {
+      while (filledExtent + _spacingExtent(fittingChildren + 1) >= availableExtent) {
         final RenderBox lastChild = renderedChildren.last;
 
         final OverflowViewParentData lastChildParentData = lastChild.parentData as OverflowViewParentData;
@@ -309,7 +315,8 @@ class RenderOverflowView extends RenderBox
 
         renderedChildren.removeLast();
         fittingChildren--;
-        final freed = _getMainSize(lastChild) + spacing;
+        final freed = _getMainSize(lastChild);
+
         filledExtent -= freed;
       }
 
@@ -318,13 +325,7 @@ class RenderOverflowView extends RenderBox
       maxCrossSize = math.max(maxCrossSize, _getCrossSize(overflowIndicator));
     }
 
-    // Now we now the extent of all children that will be painted.
-    // We can now calculate the offsets and the remaining space.
-
-    // Trim the last spacing..
-    filledExtent -= spacing;
-
-    double remainder = availableExtent - filledExtent;
+    double remainder = availableExtent - filledExtent - _spacingExtent(renderedChildren.length);
 
     if (expandFirstChild) {
       double childMainSize = _getMainSize(children.first);
@@ -369,6 +370,7 @@ class RenderOverflowView extends RenderBox
       } else {
         childParentData.offset = Offset(childCrossOffset, offset);
       }
+
       offset += _getMainSize(child) + spacing;
     }
 

From 278e0fba508d92f0c15269f07a3d28b5bc91ff09 Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Wed, 16 Jul 2025 22:34:35 +0200
Subject: [PATCH 06/10] chore: add flutter_lints

---
 analysis_options.yaml              |   1 +
 example/analysis_options.yaml      |  25 +---
 example/lib/avatars.dart           |  60 +++++---
 example/lib/main.dart              | 216 +++--------------------------
 example/lib/menu.dart              | 213 ++++++++++++++++++++++++++++
 example/pubspec.lock               |  18 ++-
 example/pubspec.yaml               |   1 +
 example/test/widget_test.dart      |  30 ----
 lib/src/widgets/overflow_view.dart |  10 +-
 pubspec.yaml                       |   1 +
 test/overflow_view_test.dart       |   6 +-
 11 files changed, 301 insertions(+), 280 deletions(-)
 create mode 100644 analysis_options.yaml
 create mode 100644 example/lib/menu.dart
 delete mode 100644 example/test/widget_test.dart

diff --git a/analysis_options.yaml b/analysis_options.yaml
new file mode 100644
index 0000000..f9b3034
--- /dev/null
+++ b/analysis_options.yaml
@@ -0,0 +1 @@
+include: package:flutter_lints/flutter.yaml
diff --git a/example/analysis_options.yaml b/example/analysis_options.yaml
index 0d29021..e3f2b56 100644
--- a/example/analysis_options.yaml
+++ b/example/analysis_options.yaml
@@ -1,28 +1,5 @@
-# This file configures the analyzer, which statically analyzes Dart code to
-# check for errors, warnings, and lints.
-#
-# The issues identified by the analyzer are surfaced in the UI of Dart-enabled
-# IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
-# invoked from the command line by running `flutter analyze`.
-
-# The following line activates a set of recommended lints for Flutter apps,
-# packages, and plugins designed to encourage good coding practices.
 include: package:flutter_lints/flutter.yaml
 
 linter:
-  # The lint rules applied to this project can be customized in the
-  # section below to disable rules from the `package:flutter_lints/flutter.yaml`
-  # included above or to enable additional rules. A list of all available lints
-  # and their documentation is published at https://dart.dev/lints.
-  #
-  # Instead of disabling a lint rule for the entire project in the
-  # section below, it can also be suppressed for a single line of code
-  # or a specific dart file by using the `// ignore: name_of_lint` and
-  # `// ignore_for_file: name_of_lint` syntax on the line or in the file
-  # producing the lint.
   rules:
-    # avoid_print: false  # Uncomment to disable the `avoid_print` rule
-    # prefer_single_quotes: true  # Uncomment to enable the `prefer_single_quotes` rule
-
-# Additional information about this file can be found at
-# https://dart.dev/guides/language/analysis-options
+    library_private_types_in_public_api: false
\ No newline at end of file
diff --git a/example/lib/avatars.dart b/example/lib/avatars.dart
index 962f9b3..886b78e 100644
--- a/example/lib/avatars.dart
+++ b/example/lib/avatars.dart
@@ -1,5 +1,3 @@
-import 'dart:math';
-
 import 'package:flutter/material.dart';
 import 'package:overflow_view/overflow_view.dart';
 
@@ -21,15 +19,16 @@ List<Avatar> generateAvatars(int count) {
   return List.generate(count + 1, (index) => Avatar(getInitials(index), getColor(index)));
 }
 
-class Avatars extends StatefulWidget {
-  const Avatars({super.key});
+class AvatarsDemo extends StatefulWidget {
+  const AvatarsDemo({super.key});
 
   @override
-  State<Avatars> createState() => _AvatarsState();
+  State<AvatarsDemo> createState() => _AvatarsDemoState();
 }
 
-class _AvatarsState extends State<Avatars> {
+class _AvatarsDemoState extends State<AvatarsDemo> {
   int _avatarCount = 5;
+  double _spacing = -40;
 
   @override
   Widget build(BuildContext context) {
@@ -38,17 +37,26 @@ class _AvatarsState extends State<Avatars> {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        OverflowView.flexible(
-          spacing: -40,
-          children: <Widget>[
-            for (int i = 0; i < avatars.length; i++) AvatarWidget(text: avatars[i].initials, color: avatars[i].color)
-          ],
-          builder: (context, remaining) {
-            return AvatarWidget(
-              text: '+$remaining',
-              color: Colors.red,
-            );
-          },
+        SizedBox(
+          width: double.infinity,
+          child: Card(
+            child: Padding(
+              padding: const EdgeInsets.all(8.0),
+              child: OverflowView.flexible(
+                spacing: _spacing,
+                children: <Widget>[
+                  for (int i = 0; i < avatars.length; i++)
+                    AvatarWidget(text: avatars[i].initials, color: avatars[i].color)
+                ],
+                builder: (context, remaining) {
+                  return AvatarWidget(
+                    text: '+$remaining',
+                    color: Colors.red,
+                  );
+                },
+              ),
+            ),
+          ),
         ),
         Slider(
           value: _avatarCount.toDouble(),
@@ -56,6 +64,20 @@ class _AvatarsState extends State<Avatars> {
           max: 50,
           onChanged: (value) => setState(() => _avatarCount = value.toInt()),
         ),
+        SizedBox(height: 20),
+        Text('Spacing (${_spacing.toInt()})'),
+        SizedBox(height: 10),
+        SizedBox(
+          width: 200,
+          child: Slider(
+            value: _spacing,
+            min: -40,
+            max: 40,
+            onChanged: (value) => setState(
+              () => _spacing = value,
+            ),
+          ),
+        ),
       ],
     );
   }
@@ -63,10 +85,10 @@ class _AvatarsState extends State<Avatars> {
 
 class AvatarWidget extends StatelessWidget {
   const AvatarWidget({
-    Key? key,
+    super.key,
     required this.text,
     required this.color,
-  }) : super(key: key);
+  });
 
   final String text;
   final Color color;
diff --git a/example/lib/main.dart b/example/lib/main.dart
index 17addbc..f4b5e0c 100644
--- a/example/lib/main.dart
+++ b/example/lib/main.dart
@@ -1,14 +1,14 @@
-import 'dart:math';
-
 import 'package:example/avatars.dart';
+import 'package:example/menu.dart';
 import 'package:flutter/material.dart';
-import 'package:overflow_view/overflow_view.dart';
 
 void main() {
   runApp(MyApp());
 }
 
 class MyApp extends StatelessWidget {
+  const MyApp({super.key});
+
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
@@ -17,207 +17,31 @@ class MyApp extends StatelessWidget {
         primarySwatch: Colors.blue,
         visualDensity: VisualDensity.adaptivePlatformDensity,
       ),
-      home: MyHomePage(title: 'Overflow View Demo'),
-    );
-  }
-}
-
-class MyHomePage extends StatefulWidget {
-  MyHomePage({Key? key, required this.title}) : super(key: key);
-
-  final String title;
-
-  @override
-  _MyHomePageState createState() => _MyHomePageState();
-}
-
-class _MyHomePageState extends State<MyHomePage> {
-  MainAxisAlignment _mainAxisAlignment = MainAxisAlignment.start;
-  CrossAxisAlignment _crossAxisAlignment = CrossAxisAlignment.start;
-  bool _expandFirstChild = false;
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
+      home: Scaffold(
         appBar: AppBar(
-          title: Text(widget.title),
+          title: Text('Overflow View Demo'),
         ),
         body: SafeArea(
           child: SingleChildScrollView(
-            padding: EdgeInsets.all(0),
-            child: Column(
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text(
-                  'Avatars',
-                  style: TextStyle(fontSize: 20),
-                ),
-                SizedBox(height: 20),
-                Avatars(),
-                Divider(),
-                Text('Command Bar', style: TextStyle(fontSize: 20)),
-                Wrap(
-                  spacing: 10,
-                  runSpacing: 10,
-                  children: [
-                    Column(
-                      crossAxisAlignment: CrossAxisAlignment.start,
-                      children: [
-                        Text('MainAxisAlignment'),
-                        SizedBox(height: 10),
-                        SegmentedButton<MainAxisAlignment>(
-                          segments: [
-                            ButtonSegment(value: MainAxisAlignment.start, label: Text('Start')),
-                            ButtonSegment(value: MainAxisAlignment.center, label: Text('Center')),
-                            ButtonSegment(value: MainAxisAlignment.end, label: Text('End')),
-                          ],
-                          selected: {_mainAxisAlignment},
-                          onSelectionChanged: (value) {
-                            setState(() {
-                              _mainAxisAlignment = value.first;
-                            });
-                          },
-                        ),
-                      ],
-                    ),
-                    Column(
-                      crossAxisAlignment: CrossAxisAlignment.start,
-                      children: [
-                        Text('CrossAxisAlignment'),
-                        SizedBox(height: 10),
-                        SegmentedButton<CrossAxisAlignment>(
-                          segments: [
-                            ButtonSegment(value: CrossAxisAlignment.start, label: Text('Start')),
-                            ButtonSegment(value: CrossAxisAlignment.center, label: Text('Center')),
-                            ButtonSegment(value: CrossAxisAlignment.end, label: Text('End')),
-                          ],
-                          selected: {_crossAxisAlignment},
-                          onSelectionChanged: (value) {
-                            setState(() {
-                              _crossAxisAlignment = value.first;
-                            });
-                          },
-                        ),
-                      ],
-                    ),
-                    Row(
-                      children: [
-                        Switch(
-                          value: _expandFirstChild,
-                          onChanged: (value) {
-                            setState(() {
-                              _expandFirstChild = value;
-                            });
-                          },
-                        ),
-                        Text('Expand first child'),
-                      ],
-                    ),
-                  ],
-                ),
-                Container(
-                  width: double.infinity,
-                  child: Card(
-                    child: CommandBar(
-                      mainAxisAlignment: _mainAxisAlignment,
-                      crossAxisAlignment: _crossAxisAlignment,
-                      expandFirstChild: _expandFirstChild,
-                    ),
+            padding: EdgeInsets.all(32),
+            child: SingleChildScrollView(
+              child: Column(
+                children: [
+                  Text(
+                    'Avatars',
+                    style: TextStyle(fontSize: 20),
                   ),
-                ),
-              ],
+                  SizedBox(height: 20),
+                  AvatarsDemo(),
+                  Divider(),
+                  Text('Menu Bar', style: TextStyle(fontSize: 20)),
+                  SizedBox(height: 20),
+                  MenuDemo(),
+                ],
+              ),
             ),
           ),
-        ));
-  }
-}
-
-class CommandBar extends StatelessWidget {
-  final MainAxisAlignment mainAxisAlignment;
-  final CrossAxisAlignment crossAxisAlignment;
-  final bool expandFirstChild;
-
-  const CommandBar({
-    Key? key,
-    this.mainAxisAlignment = MainAxisAlignment.start,
-    this.crossAxisAlignment = CrossAxisAlignment.start,
-    this.expandFirstChild = false,
-  }) : super(key: key);
-
-  @override
-  Widget build(BuildContext context) {
-    final List<MenuItemData> commands = <MenuItemData>[
-      MenuItemData(id: 'a', label: 'File'),
-      MenuItemData(id: 'b', icon: Icons.save, label: 'Save'),
-      MenuItemData(id: 'c', label: 'Edit'),
-      MenuItemData(id: 'd', label: 'View'),
-      MenuItemData(id: 'e', icon: Icons.exit_to_app),
-      MenuItemData(id: 'f', label: 'Long Command'),
-      MenuItemData(id: 'f', label: 'Very Long Command'),
-      MenuItemData(id: 'f', label: 'Very very Long Command'),
-      MenuItemData(id: 'f', label: 'Help'),
-    ];
-
-    return OverflowView.flexible(
-      spacing: 4,
-      expandFirstChild: expandFirstChild,
-      mainAxisAlignment: mainAxisAlignment,
-      crossAxisAlignment: crossAxisAlignment,
-      children: [
-        Align(
-          alignment: Alignment.centerLeft,
-          child: Text('Menu title'),
         ),
-        ...commands.map((e) => _MenuItem(data: e))
-      ],
-      builder: (context, remaining) {
-        return PopupMenuButton<String>(
-          icon: Icon(Icons.menu),
-          itemBuilder: (context) {
-            return commands
-                .skip(commands.length - remaining)
-                .map((e) => PopupMenuItem<String>(
-                      value: e.id,
-                      child: _MenuItem(data: e),
-                    ))
-                .toList();
-          },
-        );
-      },
-    );
-  }
-}
-
-class MenuItemData {
-  const MenuItemData({
-    required this.id,
-    this.label,
-    this.icon,
-  });
-
-  final String id;
-  final String? label;
-  final IconData? icon;
-}
-
-class _MenuItem extends StatelessWidget {
-  const _MenuItem({
-    Key? key,
-    required this.data,
-  }) : super(key: key);
-
-  final MenuItemData data;
-
-  @override
-  Widget build(BuildContext context) {
-    return TextButton(
-      onPressed: () {},
-      child: Row(
-        children: [
-          if (data.icon != null) Icon(data.icon),
-          if (data.icon != null && data.label != null) SizedBox(width: 8),
-          if (data.label != null) Text(data.label!),
-        ],
       ),
     );
   }
diff --git a/example/lib/menu.dart b/example/lib/menu.dart
new file mode 100644
index 0000000..972bba6
--- /dev/null
+++ b/example/lib/menu.dart
@@ -0,0 +1,213 @@
+import 'package:flutter/material.dart';
+import 'package:overflow_view/overflow_view.dart';
+
+class MenuDemo extends StatefulWidget {
+  const MenuDemo({super.key});
+
+  @override
+  _MenuDemoState createState() => _MenuDemoState();
+}
+
+class _MenuDemoState extends State<MenuDemo> {
+  MainAxisAlignment _mainAxisAlignment = MainAxisAlignment.start;
+  CrossAxisAlignment _crossAxisAlignment = CrossAxisAlignment.center;
+  bool _expandFirstChild = true;
+  double _spacing = 4;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        SizedBox(
+          width: double.infinity,
+          child: Card(
+            child: Padding(
+              padding: const EdgeInsets.symmetric(
+                horizontal: 16,
+              ),
+              child: MenuBar(
+                mainAxisAlignment: _mainAxisAlignment,
+                crossAxisAlignment: _crossAxisAlignment,
+                spacing: _spacing,
+                expandFirstChild: _expandFirstChild,
+              ),
+            ),
+          ),
+        ),
+        SizedBox(height: 20),
+        Wrap(
+          spacing: 10,
+          runSpacing: 10,
+          children: [
+            Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text('MainAxisAlignment'),
+                SizedBox(height: 10),
+                SegmentedButton<MainAxisAlignment>(
+                  segments: [
+                    ButtonSegment(value: MainAxisAlignment.start, label: Text('Start')),
+                    ButtonSegment(value: MainAxisAlignment.center, label: Text('Center')),
+                    ButtonSegment(value: MainAxisAlignment.end, label: Text('End')),
+                  ],
+                  selected: {_mainAxisAlignment},
+                  onSelectionChanged: (value) {
+                    setState(() {
+                      _mainAxisAlignment = value.first;
+                    });
+                  },
+                ),
+              ],
+            ),
+            Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text('CrossAxisAlignment'),
+                SizedBox(height: 10),
+                SegmentedButton<CrossAxisAlignment>(
+                  segments: [
+                    ButtonSegment(value: CrossAxisAlignment.start, label: Text('Start')),
+                    ButtonSegment(value: CrossAxisAlignment.center, label: Text('Center')),
+                    ButtonSegment(value: CrossAxisAlignment.end, label: Text('End')),
+                  ],
+                  selected: {_crossAxisAlignment},
+                  onSelectionChanged: (value) {
+                    setState(() {
+                      _crossAxisAlignment = value.first;
+                    });
+                  },
+                ),
+              ],
+            ),
+            Row(
+              children: [
+                Switch(
+                  value: _expandFirstChild,
+                  onChanged: (value) {
+                    setState(() {
+                      _expandFirstChild = value;
+                    });
+                  },
+                ),
+                Text('Expand first child'),
+              ],
+            ),
+            Column(children: [
+              Text('Spacing (${_spacing.toInt()})'),
+              SizedBox(height: 10),
+              SizedBox(
+                width: 200,
+                child: Slider(
+                  value: _spacing,
+                  min: -4,
+                  max: 16,
+                  onChanged: (value) {
+                    setState(() {
+                      _spacing = value;
+                    });
+                  },
+                ),
+              ),
+            ]),
+          ],
+        ),
+      ],
+    );
+  }
+}
+
+class MenuBar extends StatelessWidget {
+  final MainAxisAlignment mainAxisAlignment;
+  final CrossAxisAlignment crossAxisAlignment;
+  final bool expandFirstChild;
+  final double spacing;
+
+  const MenuBar({
+    super.key,
+    this.mainAxisAlignment = MainAxisAlignment.start,
+    this.crossAxisAlignment = CrossAxisAlignment.start,
+    this.expandFirstChild = false,
+    this.spacing = 4,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final List<MenuItemData> commands = <MenuItemData>[
+      MenuItemData(id: 'a', label: 'File'),
+      MenuItemData(id: 'b', icon: Icons.save, label: 'Save'),
+      MenuItemData(id: 'c', label: 'Edit'),
+      MenuItemData(id: 'd', label: 'View'),
+      MenuItemData(id: 'e', icon: Icons.exit_to_app),
+      MenuItemData(id: 'f', label: 'Long Command'),
+      MenuItemData(id: 'f', label: 'Very Long Command'),
+      MenuItemData(id: 'f', label: 'Very very Long Command'),
+      MenuItemData(id: 'f', label: 'Help'),
+    ];
+
+    return OverflowView.flexible(
+      spacing: spacing,
+      expandFirstChild: expandFirstChild,
+      mainAxisAlignment: mainAxisAlignment,
+      crossAxisAlignment: crossAxisAlignment,
+      children: [
+        Align(
+          alignment: Alignment.centerLeft,
+          child: Text(
+            'Menu title',
+            style: TextStyle(fontWeight: FontWeight.bold),
+          ),
+        ),
+        ...commands.map((e) => _MenuItem(data: e))
+      ],
+      builder: (context, remaining) {
+        return PopupMenuButton<String>(
+          icon: Icon(Icons.menu),
+          itemBuilder: (context) {
+            return commands
+                .skip(commands.length - remaining)
+                .map((e) => PopupMenuItem<String>(
+                      value: e.id,
+                      child: _MenuItem(data: e),
+                    ))
+                .toList();
+          },
+        );
+      },
+    );
+  }
+}
+
+class MenuItemData {
+  const MenuItemData({
+    required this.id,
+    this.label,
+    this.icon,
+  });
+
+  final String id;
+  final String? label;
+  final IconData? icon;
+}
+
+class _MenuItem extends StatelessWidget {
+  const _MenuItem({
+    required this.data,
+  });
+
+  final MenuItemData data;
+
+  @override
+  Widget build(BuildContext context) {
+    return TextButton(
+      onPressed: () {},
+      child: Row(
+        children: [
+          if (data.icon != null) Icon(data.icon),
+          if (data.icon != null && data.label != null) SizedBox(width: 8),
+          if (data.label != null) Text(data.label!),
+        ],
+      ),
+    );
+  }
+}
diff --git a/example/pubspec.lock b/example/pubspec.lock
index 70484fe..6aeb20b 100644
--- a/example/pubspec.lock
+++ b/example/pubspec.lock
@@ -54,6 +54,14 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  flutter_lints:
+    dependency: "direct dev"
+    description:
+      name: flutter_lints
+      sha256: "3105dc8492f6183fb076ccf1f351ac3d60564bff92e20bfc4af9cc1651f4e7e1"
+      url: "https://pub.dev"
+    source: hosted
+    version: "6.0.0"
   flutter_test:
     dependency: "direct dev"
     description: flutter
@@ -83,6 +91,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "3.0.2"
+  lints:
+    dependency: transitive
+    description:
+      name: lints
+      sha256: a5e2b223cb7c9c8efdc663ef484fdd95bb243bff242ef5b13e26883547fce9a0
+      url: "https://pub.dev"
+    source: hosted
+    version: "6.0.0"
   matcher:
     dependency: transitive
     description:
@@ -200,5 +216,5 @@ packages:
     source: hosted
     version: "15.0.0"
 sdks:
-  dart: ">=3.7.0-0 <4.0.0"
+  dart: ">=3.8.0 <4.0.0"
   flutter: ">=3.32.0"
diff --git a/example/pubspec.yaml b/example/pubspec.yaml
index ea69f0a..95ab8da 100644
--- a/example/pubspec.yaml
+++ b/example/pubspec.yaml
@@ -30,6 +30,7 @@ dependencies:
 dev_dependencies:
   flutter_test:
     sdk: flutter
+  flutter_lints: ^6.0.0
 
 # For information on the generic Dart part of this file, see the
 # following page: https://dart.dev/tools/pub/pubspec
diff --git a/example/test/widget_test.dart b/example/test/widget_test.dart
deleted file mode 100644
index 092d222..0000000
--- a/example/test/widget_test.dart
+++ /dev/null
@@ -1,30 +0,0 @@
-// This is a basic Flutter widget test.
-//
-// To perform an interaction with a widget in your test, use the WidgetTester
-// utility in the flutter_test package. For example, you can send tap and scroll
-// gestures. You can also use WidgetTester to find child widgets in the widget
-// tree, read text, and verify that the values of widget properties are correct.
-
-import 'package:flutter/material.dart';
-import 'package:flutter_test/flutter_test.dart';
-
-import 'package:example/main.dart';
-
-void main() {
-  testWidgets('Counter increments smoke test', (WidgetTester tester) async {
-    // Build our app and trigger a frame.
-    await tester.pumpWidget(const MyApp());
-
-    // Verify that our counter starts at 0.
-    expect(find.text('0'), findsOneWidget);
-    expect(find.text('1'), findsNothing);
-
-    // Tap the '+' icon and trigger a frame.
-    await tester.tap(find.byIcon(Icons.add));
-    await tester.pump();
-
-    // Verify that our counter has incremented.
-    expect(find.text('0'), findsNothing);
-    expect(find.text('1'), findsOneWidget);
-  });
-}
diff --git a/lib/src/widgets/overflow_view.dart b/lib/src/widgets/overflow_view.dart
index b0fc966..7304a82 100644
--- a/lib/src/widgets/overflow_view.dart
+++ b/lib/src/widgets/overflow_view.dart
@@ -68,7 +68,7 @@ class OverflowView extends MultiChildRenderObjectWidget {
         );
 
   OverflowView._all({
-    Key? key,
+    super.key,
     required OverflowIndicatorBuilder builder,
     this.mainAxisAlignment = MainAxisAlignment.start,
     this.crossAxisAlignment = CrossAxisAlignment.center,
@@ -80,7 +80,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
   })  : assert(spacing > double.negativeInfinity && spacing < double.infinity),
         _layoutBehavior = layoutBehavior,
         super(
-          key: key,
           children: [
             ...children,
             ValueLayoutBuilder<int>(
@@ -118,6 +117,7 @@ class OverflowView extends MultiChildRenderObjectWidget {
   final bool expandFirstChild;
 
   @override
+  // ignore: library_private_types_in_public_api
   _OverflowViewElement createElement() {
     return _OverflowViewElement(this);
   }
@@ -150,14 +150,14 @@ class OverflowView extends MultiChildRenderObjectWidget {
 }
 
 class _OverflowViewElement extends MultiChildRenderObjectElement {
-  _OverflowViewElement(OverflowView widget) : super(widget);
+  _OverflowViewElement(OverflowView super.widget);
 
   @override
   void debugVisitOnstageChildren(ElementVisitor visitor) {
-    children.forEach((element) {
+    for (var element in children) {
       if (element.renderObject?.isOnstage == true) {
         visitor(element);
       }
-    });
+    }
   }
 }
diff --git a/pubspec.yaml b/pubspec.yaml
index ca8ee6a..4b28d6c 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -15,3 +15,4 @@ dependencies:
 dev_dependencies:
   flutter_test:
     sdk: flutter
+  flutter_lints: ^6.0.0
diff --git a/test/overflow_view_test.dart b/test/overflow_view_test.dart
index d31df95..2f4cc45 100644
--- a/test/overflow_view_test.dart
+++ b/test/overflow_view_test.dart
@@ -4,7 +4,6 @@ import 'package:flutter_test/flutter_test.dart';
 import 'package:overflow_view/overflow_view.dart';
 
 void main() {
-
   testWidgets(
     'the overflow indicator is not built if there is enough room (except for flexible)',
     (tester) async {
@@ -378,10 +377,7 @@ void main() {
 }
 
 class _Text extends StatelessWidget {
-  const _Text(
-    this.text, {
-    Key? key,
-  }) : super(key: key);
+  const _Text(this.text);
 
   final String text;
 

From 151fc2de0863b872d0ec3065753b4be9f8db1cef Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Thu, 17 Jul 2025 14:57:56 +0200
Subject: [PATCH 07/10] refactor: clean up and fix: unexpected overflow in
 test.

---
 lib/src/rendering/overflow_view.dart | 353 +++++++++++++++------------
 test/overflow_view_test.dart         |   4 +-
 2 files changed, 195 insertions(+), 162 deletions(-)

diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index 0570233..55a332e 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -1,22 +1,31 @@
+import 'dart:math' as math;
+
 import 'package:flutter/rendering.dart';
 import 'package:value_layout_builder/value_layout_builder.dart';
 
-import 'dart:math' as math;
+enum OverflowViewLayoutBehavior {
+  fixed,
+  flexible,
+}
 
 /// Parent data for use with [RenderOverflowView].
 class OverflowViewParentData extends ContainerBoxParentData<RenderBox> {
   bool? offstage;
 }
 
-enum OverflowViewLayoutBehavior {
-  fixed,
-  flexible,
-}
-
 class RenderOverflowView extends RenderBox
     with
         ContainerRenderObjectMixin<RenderBox, OverflowViewParentData>,
         RenderBoxContainerDefaultsMixin<RenderBox, OverflowViewParentData> {
+  MainAxisAlignment _mainAxisAlignment;
+  CrossAxisAlignment _crossAxisAlignment;
+  Axis _direction;
+  double _spacing;
+  OverflowViewLayoutBehavior _layoutBehavior;
+  bool _expandFirstChild;
+  bool _isHorizontal;
+
+  bool _hasOverflow = false;
   RenderOverflowView({
     List<RenderBox>? children,
     required Axis direction,
@@ -25,7 +34,12 @@ class RenderOverflowView extends RenderBox
     required MainAxisAlignment mainAxisAlignment,
     required CrossAxisAlignment crossAxisAlignment,
     required bool expandFirstChild,
-  })  : assert(spacing > double.negativeInfinity && spacing < double.infinity),
+  })  : assert(
+          mainAxisAlignment != MainAxisAlignment.spaceBetween &&
+              mainAxisAlignment != MainAxisAlignment.spaceAround &&
+              mainAxisAlignment != MainAxisAlignment.spaceEvenly,
+          "mainAxisAlignment must not be spaceBetween, spaceAround or spaceEvenly",
+        ),
         _direction = direction,
         _spacing = spacing,
         _mainAxisAlignment = mainAxisAlignment,
@@ -35,18 +49,8 @@ class RenderOverflowView extends RenderBox
         _isHorizontal = direction == Axis.horizontal {
     addAll(children);
   }
-
-  MainAxisAlignment get mainAxisAlignment => _mainAxisAlignment;
-  MainAxisAlignment _mainAxisAlignment;
-  set mainAxisAlignment(MainAxisAlignment value) {
-    if (_mainAxisAlignment != value) {
-      _mainAxisAlignment = value;
-      markNeedsLayout();
-    }
-  }
-
   CrossAxisAlignment get crossAxisAlignment => _crossAxisAlignment;
-  CrossAxisAlignment _crossAxisAlignment;
+
   set crossAxisAlignment(CrossAxisAlignment value) {
     if (_crossAxisAlignment != value) {
       _crossAxisAlignment = value;
@@ -55,7 +59,6 @@ class RenderOverflowView extends RenderBox
   }
 
   Axis get direction => _direction;
-  Axis _direction;
   set direction(Axis value) {
     if (_direction != value) {
       _direction = value;
@@ -64,18 +67,16 @@ class RenderOverflowView extends RenderBox
     }
   }
 
-  double get spacing => _spacing;
-  double _spacing;
-  set spacing(double value) {
-    assert(value > double.negativeInfinity && value < double.infinity);
-    if (_spacing != value) {
-      _spacing = value;
+  bool get expandFirstChild => _expandFirstChild;
+  set expandFirstChild(bool value) {
+    if (_expandFirstChild != value) {
+      _expandFirstChild = value;
       markNeedsLayout();
     }
   }
 
   OverflowViewLayoutBehavior get layoutBehavior => _layoutBehavior;
-  OverflowViewLayoutBehavior _layoutBehavior;
+
   set layoutBehavior(OverflowViewLayoutBehavior value) {
     if (_layoutBehavior != value) {
       _layoutBehavior = value;
@@ -83,74 +84,72 @@ class RenderOverflowView extends RenderBox
     }
   }
 
-  bool get expandFirstChild => _expandFirstChild;
-  bool _expandFirstChild;
-  set expandFirstChild(bool value) {
-    if (_expandFirstChild != value) {
-      _expandFirstChild = value;
+  MainAxisAlignment get mainAxisAlignment => _mainAxisAlignment;
+  set mainAxisAlignment(MainAxisAlignment value) {
+    if (_mainAxisAlignment != value) {
+      _mainAxisAlignment = value;
       markNeedsLayout();
     }
   }
 
-  bool _isHorizontal;
-  @override
-  void setupParentData(RenderBox child) {
-    if (child.parentData is! OverflowViewParentData) child.parentData = OverflowViewParentData();
-  }
-
-  double _getCrossSize(RenderBox child) {
-    switch (_direction) {
-      case Axis.horizontal:
-        return child.size.height;
-      case Axis.vertical:
-        return child.size.width;
+  double get spacing => _spacing;
+  set spacing(double value) {
+    assert(value > double.negativeInfinity && value < double.infinity);
+    if (_spacing != value) {
+      _spacing = value;
+      markNeedsLayout();
     }
   }
 
-  double _getMainSize(RenderBox child) {
-    switch (_direction) {
-      case Axis.horizontal:
-        return child.size.width;
-      case Axis.vertical:
-        return child.size.height;
-    }
+  @override
+  bool hitTestChildren(BoxHitTestResult result, {required Offset position}) {
+    // The x, y parameters have the top left of the node's box as the origin.
+    visitOnlyOnStageChildren((renderObject) {
+      final RenderBox child = renderObject as RenderBox;
+      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
+      result.addWithPaintOffset(
+        offset: childParentData.offset,
+        position: position,
+        hitTest: (BoxHitTestResult result, Offset transformed) {
+          assert(transformed == position - childParentData.offset);
+          return child.hitTest(result, position: transformed);
+        },
+      );
+    });
+
+    return false;
   }
 
-  double _calculateMainAxisAlignmentOffset(double totalChildrenSize, double availableSize) {
-    switch (mainAxisAlignment) {
-      case MainAxisAlignment.start:
-        return 0.0;
-      case MainAxisAlignment.end:
-        return availableSize - totalChildrenSize;
-      case MainAxisAlignment.center:
-        return (availableSize - totalChildrenSize) / 2.0;
-      default:
-        return 0.0;
+  @override
+  void paint(PaintingContext context, Offset offset) {
+    void paintChild(RenderObject child) {
+      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
+      if (childParentData.offstage == false) {
+        context.paintChild(child, childParentData.offset + offset);
+      } else {
+        // We paint it outside the box.
+        context.paintChild(child, size.bottomRight(Offset.zero));
+      }
     }
-  }
 
-  bool _hasOverflow = false;
+    void defaultPaint(PaintingContext context, Offset offset) {
+      visitOnlyOnStageChildren(paintChild);
+    }
 
-  @override
-  void performLayout() {
-    _hasOverflow = false;
-    assert(firstChild != null);
-    resetOffstage();
-    if (layoutBehavior == OverflowViewLayoutBehavior.fixed) {
-      performFixedLayout();
+    if (_hasOverflow) {
+      context.pushClipRect(
+        needsCompositing,
+        offset,
+        Offset.zero & size,
+        defaultPaint,
+        clipBehavior: Clip.hardEdge,
+      );
     } else {
-      _performFlexibleLayout();
+      defaultPaint(context, offset);
     }
   }
 
-  void resetOffstage() {
-    visitChildren((child) {
-      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
-      childParentData.offstage = null;
-    });
-  }
-
-  void performFixedLayout() {
+  void _performFixedLayout() {
     RenderBox child = firstChild!;
 
     final BoxConstraints childConstraints = constraints.loosen();
@@ -224,21 +223,51 @@ class RenderOverflowView extends RenderBox
     size = constraints.constrain(requestedSize);
   }
 
-  BoxConstraints _getChildrenConstraints() {
-    final double maxCrossExtent = _isHorizontal ? constraints.maxHeight : constraints.maxWidth;
-    return _isHorizontal
-        ? BoxConstraints.loose(Size(double.infinity, maxCrossExtent))
-        : BoxConstraints.loose(Size(maxCrossExtent, double.infinity));
+  @override
+  void performLayout() {
+    _hasOverflow = false;
+    assert(firstChild != null);
+    resetOffstage();
+    if (layoutBehavior == OverflowViewLayoutBehavior.fixed) {
+      _performFixedLayout();
+    } else {
+      _performFlexibleLayout();
+    }
+  }
+
+  void resetOffstage() {
+    visitChildren((child) {
+      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
+      childParentData.offstage = null;
+    });
+  }
+
+  @override
+  void setupParentData(RenderBox child) {
+    if (child.parentData is! OverflowViewParentData) child.parentData = OverflowViewParentData();
+  }
+
+  @override
+  void visitChildrenForSemantics(RenderObjectVisitor visitor) {
+    visitOnlyOnStageChildren(visitor);
   }
 
-  List<RenderBox> _applyChildrenConstraints() {
+  void visitOnlyOnStageChildren(RenderObjectVisitor visitor) {
+    visitChildren((child) {
+      if (child.isOnstage) {
+        visitor(child);
+      }
+    });
+  }
+
+  List<RenderBox> _layoutChildrenSizes() {
     RenderBox child = firstChild!;
 
     final List<RenderBox> children = <RenderBox>[];
 
     while (child != lastChild) {
       final childParentData = child.parentData as OverflowViewParentData;
-      child.layout(_getChildrenConstraints(), parentUsesSize: true);
+      child.layout(_childConstraints, parentUsesSize: true);
       children.add(child);
       child = childParentData.nextSibling!;
     }
@@ -246,11 +275,42 @@ class RenderOverflowView extends RenderBox
     return children;
   }
 
-  double _spacingExtent(int childCount) {
-    if (childCount == 0) {
-      return 0;
+  double _calculateMainAxisAlignmentOffset(double totalChildrenSize, double availableSize) {
+    switch (mainAxisAlignment) {
+      case MainAxisAlignment.start:
+        return 0.0;
+      case MainAxisAlignment.end:
+        return availableSize - totalChildrenSize;
+      case MainAxisAlignment.center:
+        return (availableSize - totalChildrenSize) / 2.0;
+      default:
+        return 0.0;
+    }
+  }
+
+  BoxConstraints get _childConstraints {
+    final double maxCrossExtent = _isHorizontal ? constraints.maxHeight : constraints.maxWidth;
+    return _isHorizontal
+        ? BoxConstraints.loose(Size(double.infinity, maxCrossExtent))
+        : BoxConstraints.loose(Size(maxCrossExtent, double.infinity));
+  }
+
+  double _getCrossSize(RenderBox child) {
+    switch (_direction) {
+      case Axis.horizontal:
+        return child.size.height;
+      case Axis.vertical:
+        return child.size.width;
+    }
+  }
+
+  double _getMainSize(RenderBox child) {
+    switch (_direction) {
+      case Axis.horizontal:
+        return child.size.width;
+      case Axis.vertical:
+        return child.size.height;
     }
-    return spacing * (childCount - 1);
   }
 
   void _performFlexibleLayout() {
@@ -258,22 +318,30 @@ class RenderOverflowView extends RenderBox
 
     bool showOverflowIndicator = false;
 
-    // First we retrieve the size of all the children.
+    // |_______| availableExtent
+    // □ □ □ □ □ □
+    //           ^overflowing child
+    // <-------> fitting children (count)
 
-    final children = _applyChildrenConstraints();
+    // First we retrieve the size of all the children.
+    final children = _layoutChildrenSizes();
 
+    // Needed to calculate the cross axis alignment later
     double maxCrossSize = 0;
 
+    // Keep track of the total size of the children that are already on stage
     double filledExtent = 0;
+
     int fittingChildren = 0;
 
     for (final child in children) {
-      final childParentData = child.parentData as OverflowViewParentData;
       double childMainSize = _getMainSize(child);
       double childCrossSize = _getCrossSize(child);
-
       maxCrossSize = math.max(maxCrossSize, childCrossSize);
 
+      final childParentData = child.parentData as OverflowViewParentData;
+
+      // Check if the filled space is less than the available extent.
       if (filledExtent + childMainSize + _spacingExtent(fittingChildren) <= availableExtent) {
         childParentData.offstage = false;
         filledExtent += childMainSize;
@@ -288,12 +356,13 @@ class RenderOverflowView extends RenderBox
     final renderedChildren = children.where((child) => child.isOnstage).toList();
 
     if (showOverflowIndicator) {
-      // We need to place the overflow indicator. To do this we
-      // might need to remove children until it fits.
+      // We need to place the overflow indicator.
+      // We start by determining its size, by passing the value of already
+      // overflowing children.
       final RenderBox overflowIndicator = lastChild!;
-      final BoxValueConstraints<int> overflowIndicatorConstraints = BoxValueConstraints<int>(
+      BoxValueConstraints<int> overflowIndicatorConstraints = BoxValueConstraints<int>(
         value: childCount - fittingChildren - 1,
-        constraints: _getChildrenConstraints(),
+        constraints: _childConstraints,
       );
 
       overflowIndicator.layout(
@@ -307,7 +376,9 @@ class RenderOverflowView extends RenderBox
       double indicatorSize = _getMainSize(overflowIndicator);
       filledExtent += indicatorSize;
 
-      while (filledExtent + _spacingExtent(fittingChildren + 1) >= availableExtent) {
+      // Remove children until we can fit the overflow indicator fits.
+
+      while (filledExtent + _spacingExtent(fittingChildren + 1) > availableExtent) {
         final RenderBox lastChild = renderedChildren.last;
 
         final OverflowViewParentData lastChildParentData = lastChild.parentData as OverflowViewParentData;
@@ -320,6 +391,19 @@ class RenderOverflowView extends RenderBox
         filledExtent -= freed;
       }
 
+      // Now that we know the final count of fitting children we
+      // layout again to pass the correct count to the overflow indicator.
+
+      overflowIndicatorConstraints = BoxValueConstraints<int>(
+        value: childCount - fittingChildren - 1,
+        constraints: _childConstraints,
+      );
+
+      overflowIndicator.layout(
+        overflowIndicatorConstraints,
+        parentUsesSize: true,
+      );
+
       renderedChildren.add(overflowIndicator);
 
       maxCrossSize = math.max(maxCrossSize, _getCrossSize(overflowIndicator));
@@ -327,6 +411,8 @@ class RenderOverflowView extends RenderBox
 
     double remainder = availableExtent - filledExtent - _spacingExtent(renderedChildren.length);
 
+    // We increase the size of the first child to fill the leading space.
+    // we consume the remainder space.
     if (expandFirstChild) {
       double childMainSize = _getMainSize(children.first);
 
@@ -338,6 +424,7 @@ class RenderOverflowView extends RenderBox
       remainder = 0;
     }
 
+    // We fill the extent based on the offset
     double offset = 0;
 
     // If we try to center the children we start with half the remaining space.
@@ -384,76 +471,22 @@ class RenderOverflowView extends RenderBox
     size = constraints.constrain(idealSize);
   }
 
-  void visitOnlyOnStageChildren(RenderObjectVisitor visitor) {
-    visitChildren((child) {
-      if (child.isOnstage) {
-        visitor(child);
-      }
-    });
-  }
-
-  @override
-  void visitChildrenForSemantics(RenderObjectVisitor visitor) {
-    visitOnlyOnStageChildren(visitor);
-  }
-
-  @override
-  void paint(PaintingContext context, Offset offset) {
-    void paintChild(RenderObject child) {
-      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
-      if (childParentData.offstage == false) {
-        context.paintChild(child, childParentData.offset + offset);
-      } else {
-        // We paint it outside the box.
-        context.paintChild(child, size.bottomRight(Offset.zero));
-      }
-    }
-
-    void defaultPaint(PaintingContext context, Offset offset) {
-      visitOnlyOnStageChildren(paintChild);
-    }
-
-    if (_hasOverflow) {
-      context.pushClipRect(
-        needsCompositing,
-        offset,
-        Offset.zero & size,
-        defaultPaint,
-        clipBehavior: Clip.hardEdge,
-      );
-    } else {
-      defaultPaint(context, offset);
+  double _spacingExtent(int childCount) {
+    if (childCount == 0) {
+      return 0;
     }
-  }
-
-  @override
-  bool hitTestChildren(BoxHitTestResult result, {required Offset position}) {
-    // The x, y parameters have the top left of the node's box as the origin.
-    visitOnlyOnStageChildren((renderObject) {
-      final RenderBox child = renderObject as RenderBox;
-      final OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
-      result.addWithPaintOffset(
-        offset: childParentData.offset,
-        position: position,
-        hitTest: (BoxHitTestResult result, Offset transformed) {
-          assert(transformed == position - childParentData.offset);
-          return child.hitTest(result, position: transformed);
-        },
-      );
-    });
-
-    return false;
+    return spacing * (childCount - 1);
   }
 }
 
 extension on Size {
-  double getMainExtent(Axis axis) {
-    return axis == Axis.horizontal ? width : height;
-  }
-
   double getCrossExtent(Axis axis) {
     return axis == Axis.horizontal ? height : width;
   }
+
+  double getMainExtent(Axis axis) {
+    return axis == Axis.horizontal ? width : height;
+  }
 }
 
 extension RenderObjectExtensions on RenderObject {
diff --git a/test/overflow_view_test.dart b/test/overflow_view_test.dart
index 2f4cc45..d73d2d8 100644
--- a/test/overflow_view_test.dart
+++ b/test/overflow_view_test.dart
@@ -5,7 +5,7 @@ import 'package:overflow_view/overflow_view.dart';
 
 void main() {
   testWidgets(
-    'the overflow indicator is not built if there is enough room (except for flexible)',
+    'the overflow indicator is not built if there is enough room',
     (tester) async {
       int buildCount = 0;
       await tester.pumpWidget(
@@ -38,7 +38,7 @@ void main() {
           ),
         ),
       );
-      expect(buildCount, 1);
+      expect(buildCount, 0);
     },
   );
 

From f78b40e601dc7ffb112d8fbf325802b4b3e5d412 Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Fri, 18 Jul 2025 13:22:44 +0200
Subject: [PATCH 08/10] chore: clean up and rework layout behaviour

---
 example/lib/fixed_flexible.dart      | 243 +++++++++++++++++++++++++++
 example/lib/main.dart                |   5 +
 example/lib/menu.dart                |   5 +-
 lib/overflow_view.dart               |   1 +
 lib/src/rendering/overflow_view.dart | 189 ++++++++++++---------
 lib/src/widgets/overflow_view.dart   |  13 +-
 6 files changed, 367 insertions(+), 89 deletions(-)
 create mode 100644 example/lib/fixed_flexible.dart

diff --git a/example/lib/fixed_flexible.dart b/example/lib/fixed_flexible.dart
new file mode 100644
index 0000000..d252a26
--- /dev/null
+++ b/example/lib/fixed_flexible.dart
@@ -0,0 +1,243 @@
+import 'package:flutter/material.dart';
+import 'package:overflow_view/overflow_view.dart';
+
+class FixedVsFlexibleDemo extends StatefulWidget {
+  const FixedVsFlexibleDemo({super.key});
+
+  @override
+  State<FixedVsFlexibleDemo> createState() => _FixedVsFlexibleDemoState();
+}
+
+class _FixedVsFlexibleDemoState extends State<FixedVsFlexibleDemo> {
+  bool _fixed = false;
+  int _count = 10;
+  double _width = 300;
+  double _spacing = 8.0;
+  Axis _axis = Axis.horizontal;
+  MainAxisAlignment _mainAxisAlignment = MainAxisAlignment.start;
+  CrossAxisAlignment _crossAxisAlignment = CrossAxisAlignment.start;
+
+  Widget _buildOverflow(BuildContext context, int count) {
+    return Container(
+      decoration: BoxDecoration(
+        color: Colors.yellow,
+        borderRadius: BorderRadius.circular(10),
+      ),
+      height: 50,
+      width: 50,
+      child: Center(child: Text("Ov: $count")),
+    );
+  }
+
+  List<Widget> _buildChildren(BuildContext context, int count) {
+    return List.generate(
+      count,
+      (index) => Container(
+        decoration: BoxDecoration(
+          color: Colors.blue,
+          borderRadius: BorderRadius.circular(10),
+        ),
+        height: index % 3 * 10 + 50,
+        width: 50 + index % 3 * 10,
+        child: Center(child: Text("Child: $index")),
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      width: double.infinity,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Container(
+            decoration: BoxDecoration(
+              border: Border.all(color: Colors.black),
+              borderRadius: BorderRadius.circular(10),
+            ),
+            height: 300,
+            width: _width,
+            child: Center(
+              child: OverflowView(
+                mainAxisAlignment: _mainAxisAlignment,
+                crossAxisAlignment: _crossAxisAlignment,
+                builder: _buildOverflow,
+                direction: _axis,
+                layoutBehavior: _fixed ? OverflowViewLayoutBehavior.fixed : OverflowViewLayoutBehavior.flexible,
+                spacing: _spacing,
+                children: _buildChildren(context, _count),
+              ),
+            ),
+          ),
+          Wrap(
+            spacing: 16,
+            runSpacing: 8,
+            children: [
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Count: $_count"),
+                  SizedBox(
+                    width: 8,
+                  ),
+                  SizedBox(
+                    width: 150,
+                    child: Slider(
+                      value: _count.toDouble(),
+                      max: 20,
+                      min: 1,
+                      onChanged: (value) {
+                        setState(() {
+                          _count = value.toInt();
+                        });
+                      },
+                    ),
+                  ),
+                ],
+              ),
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Width: ${_width.toInt()}"),
+                  SizedBox(
+                    width: 8,
+                  ),
+                  SizedBox(
+                    width: 150,
+                    child: Slider(
+                      value: _width,
+                      max: 500,
+                      min: 100,
+                      onChanged: (value) {
+                        setState(() {
+                          _width = value;
+                        });
+                      },
+                    ),
+                  ),
+                ],
+              ),
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Spacing: ${_spacing.toInt()}"),
+                  SizedBox(
+                    width: 8,
+                  ),
+                  SizedBox(
+                    width: 150,
+                    child: Slider(
+                      value: _spacing,
+                      max: 50,
+                      min: -10,
+                      onChanged: (value) {
+                        setState(() {
+                          _spacing = value;
+                        });
+                      },
+                    ),
+                  ),
+                ],
+              ),
+            ],
+          ),
+          Row(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Text("Fixed"),
+              Switch(
+                  value: _fixed,
+                  onChanged: (value) {
+                    setState(() {
+                      _fixed = value;
+                    });
+                  }),
+            ],
+          ),
+          Wrap(
+            spacing: 16,
+            runSpacing: 8,
+            children: [
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Axis:"),
+                  SizedBox(
+                    width: 8,
+                  ),
+                  DropdownButton<Axis>(
+                    value: _axis,
+                    onChanged: (value) {
+                      if (value != null) {
+                        setState(() {
+                          _axis = value;
+                        });
+                      }
+                    },
+                    items: Axis.values.map((axis) {
+                      return DropdownMenuItem<Axis>(
+                        value: axis,
+                        child: Text(axis == Axis.horizontal ? "Horizontal" : "Vertical"),
+                      );
+                    }).toList(),
+                  ),
+                ],
+              ),
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("MainAxisAlignment:"),
+                  SizedBox(
+                    width: 8,
+                  ),
+                  DropdownButton<MainAxisAlignment>(
+                    value: _mainAxisAlignment,
+                    onChanged: (value) {
+                      if (value != null) {
+                        setState(() {
+                          _mainAxisAlignment = value;
+                        });
+                      }
+                    },
+                    items: MainAxisAlignment.values.map((alignment) {
+                      return DropdownMenuItem<MainAxisAlignment>(
+                        value: alignment,
+                        child: Text(alignment.toString().split('.').last),
+                      );
+                    }).toList(),
+                  ),
+                ],
+              ),
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("CrossAxisAlignment:"),
+                  SizedBox(
+                    width: 8,
+                  ),
+                  DropdownButton<CrossAxisAlignment>(
+                    value: _crossAxisAlignment,
+                    onChanged: (value) {
+                      if (value != null) {
+                        setState(() {
+                          _crossAxisAlignment = value;
+                        });
+                      }
+                    },
+                    items: CrossAxisAlignment.values.map((alignment) {
+                      return DropdownMenuItem<CrossAxisAlignment>(
+                        value: alignment,
+                        child: Text(alignment.toString().split('.').last),
+                      );
+                    }).toList(),
+                  ),
+                ],
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/example/lib/main.dart b/example/lib/main.dart
index f4b5e0c..fee5287 100644
--- a/example/lib/main.dart
+++ b/example/lib/main.dart
@@ -1,4 +1,5 @@
 import 'package:example/avatars.dart';
+import 'package:example/fixed_flexible.dart';
 import 'package:example/menu.dart';
 import 'package:flutter/material.dart';
 
@@ -37,6 +38,10 @@ class MyApp extends StatelessWidget {
                   Text('Menu Bar', style: TextStyle(fontSize: 20)),
                   SizedBox(height: 20),
                   MenuDemo(),
+                  Divider(),
+                  Text('Fixed vs Flexible', style: TextStyle(fontSize: 20)),
+                  SizedBox(height: 20),
+                  FixedVsFlexibleDemo(),
                 ],
               ),
             ),
diff --git a/example/lib/menu.dart b/example/lib/menu.dart
index 972bba6..6145fb9 100644
--- a/example/lib/menu.dart
+++ b/example/lib/menu.dart
@@ -145,9 +145,10 @@ class MenuBar extends StatelessWidget {
       MenuItemData(id: 'f', label: 'Help'),
     ];
 
-    return OverflowView.flexible(
+    return OverflowView(
       spacing: spacing,
-      expandFirstChild: expandFirstChild,
+      layoutBehavior:
+          expandFirstChild ? OverflowViewLayoutBehavior.expandFirstFlexible : OverflowViewLayoutBehavior.flexible,
       mainAxisAlignment: mainAxisAlignment,
       crossAxisAlignment: crossAxisAlignment,
       children: [
diff --git a/lib/overflow_view.dart b/lib/overflow_view.dart
index 5e3fc58..d75d570 100644
--- a/lib/overflow_view.dart
+++ b/lib/overflow_view.dart
@@ -1,3 +1,4 @@
 library overflow_view;
 
 export 'src/widgets/overflow_view.dart';
+export 'src/rendering/overflow_view.dart' show OverflowViewLayoutBehavior;
diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index 55a332e..2e3acf4 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -6,6 +6,7 @@ import 'package:value_layout_builder/value_layout_builder.dart';
 enum OverflowViewLayoutBehavior {
   fixed,
   flexible,
+  expandFirstFlexible,
 }
 
 /// Parent data for use with [RenderOverflowView].
@@ -22,7 +23,7 @@ class RenderOverflowView extends RenderBox
   Axis _direction;
   double _spacing;
   OverflowViewLayoutBehavior _layoutBehavior;
-  bool _expandFirstChild;
+
   bool _isHorizontal;
 
   bool _hasOverflow = false;
@@ -33,7 +34,6 @@ class RenderOverflowView extends RenderBox
     required OverflowViewLayoutBehavior layoutBehavior,
     required MainAxisAlignment mainAxisAlignment,
     required CrossAxisAlignment crossAxisAlignment,
-    required bool expandFirstChild,
   })  : assert(
           mainAxisAlignment != MainAxisAlignment.spaceBetween &&
               mainAxisAlignment != MainAxisAlignment.spaceAround &&
@@ -45,7 +45,6 @@ class RenderOverflowView extends RenderBox
         _mainAxisAlignment = mainAxisAlignment,
         _layoutBehavior = layoutBehavior,
         _crossAxisAlignment = crossAxisAlignment,
-        _expandFirstChild = expandFirstChild,
         _isHorizontal = direction == Axis.horizontal {
     addAll(children);
   }
@@ -67,14 +66,6 @@ class RenderOverflowView extends RenderBox
     }
   }
 
-  bool get expandFirstChild => _expandFirstChild;
-  set expandFirstChild(bool value) {
-    if (_expandFirstChild != value) {
-      _expandFirstChild = value;
-      markNeedsLayout();
-    }
-  }
-
   OverflowViewLayoutBehavior get layoutBehavior => _layoutBehavior;
 
   set layoutBehavior(OverflowViewLayoutBehavior value) {
@@ -150,77 +141,131 @@ class RenderOverflowView extends RenderBox
   }
 
   void _performFixedLayout() {
-    RenderBox child = firstChild!;
-
-    final BoxConstraints childConstraints = constraints.loosen();
+    double availableExtent = _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
 
-    final double maxExtent = _isHorizontal ? constraints.maxWidth : constraints.maxHeight;
+    // First we retrieve the size of all the children.
+    final children = _layoutChildrenSizes();
 
-    OverflowViewParentData childParentData = child.parentData as OverflowViewParentData;
-    child.layout(childConstraints, parentUsesSize: true);
-    final double childExtent = child.size.getMainExtent(direction);
-    final double crossExtent = child.size.getCrossExtent(direction);
-    final BoxConstraints otherChildConstraints = _isHorizontal
-        ? childConstraints.tighten(width: childExtent, height: crossExtent)
-        : childConstraints.tighten(height: childExtent, width: crossExtent);
+    // Needed to calculate the cross axis alignment later
+    double maxCrossSize = 0;
 
-    final double childStride = childExtent + spacing;
+    double maxMainSize = 0;
 
-    int onstageCount = 0;
-    final int count = childCount - 1;
-    final double requestedExtent = childExtent * (childCount - 1) + spacing * (childCount - 2);
-    final int renderedChildCount = requestedExtent <= maxExtent ? count : (maxExtent + spacing) ~/ childStride - 1;
-    final int unRenderedChildCount = count - renderedChildCount;
+    // Calculate the total size needed for all children (excluding overflow indicator)
 
-    // Calculate the total size of rendered children
-    final double totalRenderedSize = renderedChildCount * childStride - spacing;
+    for (final child in children) {
+      double childCrossSize = _getCrossSize(child);
+      maxCrossSize = math.max(maxCrossSize, childCrossSize);
+      maxMainSize = math.max(maxMainSize, _getMainSize(child));
+    }
 
-    // Calculate alignment offset
-    final double alignmentOffset = _calculateMainAxisAlignmentOffset(totalRenderedSize, maxExtent);
+    // Add spacing between children
 
-    if (renderedChildCount > 0) {
-      childParentData.offstage = false;
-      childParentData.offset = _isHorizontal ? Offset(alignmentOffset, 0) : Offset(0, alignmentOffset);
-      onstageCount++;
-    }
+    // Determine how many children can fit
+    int fittingChildren = 0;
+    double filledExtent = 0;
+    bool showOverflowIndicator = false;
 
-    for (int i = 1; i < renderedChildCount; i++) {
-      child = childParentData.nextSibling!;
-      childParentData = child.parentData as OverflowViewParentData;
-      child.layout(otherChildConstraints);
-      childParentData.offset =
-          _isHorizontal ? Offset(alignmentOffset + i * childStride, 0) : Offset(0, alignmentOffset + i * childStride);
-      childParentData.offstage = false;
-      onstageCount++;
+    for (final child in children) {
+      // Check if this child would fit
+      if (filledExtent + maxMainSize + (fittingChildren > 0 ? spacing : 0) <= availableExtent) {
+        final childParentData = child.parentData as OverflowViewParentData;
+        childParentData.offstage = false;
+        filledExtent += maxMainSize + (fittingChildren > 0 ? spacing : 0);
+        fittingChildren++;
+      } else {
+        showOverflowIndicator = true;
+        final childParentData = child.parentData as OverflowViewParentData;
+        childParentData.offstage = true;
+      }
     }
 
-    while (child != lastChild) {
-      child = childParentData.nextSibling!;
-      childParentData = child.parentData as OverflowViewParentData;
-      childParentData.offstage = true;
-    }
+    final renderedChildren = children.where((child) => child.isOnstage).toList();
 
-    if (unRenderedChildCount > 0) {
-      // We have to layout the overflow indicator.
+    if (showOverflowIndicator) {
+      // We need to place the overflow indicator.
       final RenderBox overflowIndicator = lastChild!;
+      BoxValueConstraints<int> overflowIndicatorConstraints = BoxValueConstraints<int>(
+        value: childCount - fittingChildren - 1,
+        constraints: _childConstraints,
+      );
 
-      final BoxValueConstraints<int> overflowIndicatorConstraints = BoxValueConstraints<int>(
-        value: unRenderedChildCount,
-        constraints: otherChildConstraints,
+      overflowIndicator.layout(
+        overflowIndicatorConstraints,
+        parentUsesSize: true,
       );
-      overflowIndicator.layout(overflowIndicatorConstraints);
+
       final OverflowViewParentData overflowIndicatorParentData = overflowIndicator.parentData as OverflowViewParentData;
-      overflowIndicatorParentData.offset = _isHorizontal
-          ? Offset(alignmentOffset + renderedChildCount * childStride, 0)
-          : Offset(0, alignmentOffset + renderedChildCount * childStride);
       overflowIndicatorParentData.offstage = false;
-      onstageCount++;
+
+      double indicatorSize = _getMainSize(overflowIndicator);
+      filledExtent += indicatorSize;
+
+      // Remove children until we can fit the overflow indicator
+      while (filledExtent + (fittingChildren > 0 ? spacing : 0) > availableExtent) {
+        final RenderBox lastChild = renderedChildren.last;
+        final OverflowViewParentData lastChildParentData = lastChild.parentData as OverflowViewParentData;
+        lastChildParentData.offstage = true;
+
+        renderedChildren.removeLast();
+        fittingChildren--;
+        final freed = _getMainSize(lastChild);
+        filledExtent -= freed + (fittingChildren > 0 ? spacing : 0);
+      }
+
+      // Now that we know the final count of fitting children we
+      // layout again to pass the correct count to the overflow indicator.
+      overflowIndicatorConstraints = BoxValueConstraints<int>(
+        value: childCount - fittingChildren - 1,
+        constraints: _childConstraints,
+      );
+
+      overflowIndicator.layout(
+        overflowIndicatorConstraints,
+        parentUsesSize: true,
+      );
+
+      renderedChildren.add(overflowIndicator);
+      maxCrossSize = math.max(maxCrossSize, _getCrossSize(overflowIndicator));
+    }
+
+    // Calculate alignment offset
+    final double alignmentOffset = _calculateMainAxisAlignmentOffset(filledExtent, availableExtent);
+
+    // Position all rendered children with uniform spacing
+    double offset = alignmentOffset;
+    for (final child in renderedChildren) {
+      final childParentData = child.parentData as OverflowViewParentData;
+      final double childCrossSize = _getCrossSize(child);
+
+      double childCrossOffset = 0;
+      if (crossAxisAlignment == CrossAxisAlignment.start) {
+        childCrossOffset = 0;
+      } else if (crossAxisAlignment == CrossAxisAlignment.end) {
+        childCrossOffset = maxCrossSize - childCrossSize;
+      } else if (crossAxisAlignment == CrossAxisAlignment.center) {
+        childCrossOffset = (maxCrossSize - childCrossSize) / 2;
+      }
+
+      if (_isHorizontal) {
+        childParentData.offset = Offset(offset, childCrossOffset);
+      } else {
+        childParentData.offset = Offset(childCrossOffset, offset);
+      }
+
+      offset += maxMainSize + spacing;
     }
 
-    final double mainAxisExtent = onstageCount * childStride - spacing;
-    final requestedSize = _isHorizontal ? Size(mainAxisExtent, crossExtent) : Size(crossExtent, mainAxisExtent);
+    Size idealSize;
 
-    size = constraints.constrain(requestedSize);
+    double trailingSpace = availableExtent - filledExtent;
+    if (_isHorizontal) {
+      idealSize = Size(offset - spacing + trailingSpace, maxCrossSize);
+    } else {
+      idealSize = Size(maxCrossSize, offset - spacing + trailingSpace);
+    }
+
+    size = constraints.constrain(idealSize);
   }
 
   @override
@@ -413,7 +458,7 @@ class RenderOverflowView extends RenderBox
 
     // We increase the size of the first child to fill the leading space.
     // we consume the remainder space.
-    if (expandFirstChild) {
+    if (layoutBehavior == OverflowViewLayoutBehavior.expandFirstFlexible) {
       double childMainSize = _getMainSize(children.first);
 
       firstChild!.layout(
@@ -461,11 +506,13 @@ class RenderOverflowView extends RenderBox
       offset += _getMainSize(child) + spacing;
     }
 
+    final trailingSpace = availableExtent - filledExtent;
+
     Size idealSize;
     if (_isHorizontal) {
-      idealSize = Size(offset, maxCrossSize);
+      idealSize = Size(offset + trailingSpace, maxCrossSize);
     } else {
-      idealSize = Size(maxCrossSize, offset);
+      idealSize = Size(maxCrossSize, offset + trailingSpace);
     }
 
     size = constraints.constrain(idealSize);
@@ -479,16 +526,6 @@ class RenderOverflowView extends RenderBox
   }
 }
 
-extension on Size {
-  double getCrossExtent(Axis axis) {
-    return axis == Axis.horizontal ? height : width;
-  }
-
-  double getMainExtent(Axis axis) {
-    return axis == Axis.horizontal ? width : height;
-  }
-}
-
 extension RenderObjectExtensions on RenderObject {
   bool get isOnstage => (parentData as OverflowViewParentData).offstage == false;
 }
diff --git a/lib/src/widgets/overflow_view.dart b/lib/src/widgets/overflow_view.dart
index 7304a82..9db09ff 100644
--- a/lib/src/widgets/overflow_view.dart
+++ b/lib/src/widgets/overflow_view.dart
@@ -27,7 +27,7 @@ class OverflowView extends MultiChildRenderObjectWidget {
     CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
     Axis direction = Axis.horizontal,
     required List<Widget> children,
-    bool expandFirstChild = false,
+    OverflowViewLayoutBehavior layoutBehavior = OverflowViewLayoutBehavior.fixed,
     double spacing = 0,
   }) : this._all(
           key: key,
@@ -37,8 +37,7 @@ class OverflowView extends MultiChildRenderObjectWidget {
           direction: direction,
           children: children,
           spacing: spacing,
-          expandFirstChild: expandFirstChild,
-          layoutBehavior: OverflowViewLayoutBehavior.fixed,
+          layoutBehavior: layoutBehavior,
         );
 
   /// Creates a flexible [OverflowView].
@@ -53,7 +52,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
     MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start,
     CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
     required List<Widget> children,
-    bool expandFirstChild = false,
     double spacing = 0,
   }) : this._all(
           key: key,
@@ -62,7 +60,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
           mainAxisAlignment: mainAxisAlignment,
           children: children,
           spacing: spacing,
-          expandFirstChild: expandFirstChild,
           crossAxisAlignment: crossAxisAlignment,
           layoutBehavior: OverflowViewLayoutBehavior.flexible,
         );
@@ -75,7 +72,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
     this.direction = Axis.horizontal,
     required List<Widget> children,
     this.spacing = 0,
-    this.expandFirstChild = false,
     required OverflowViewLayoutBehavior layoutBehavior,
   })  : assert(spacing > double.negativeInfinity && spacing < double.infinity),
         _layoutBehavior = layoutBehavior,
@@ -113,9 +109,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
   /// children are placed at the end of the cross axis.
   final CrossAxisAlignment crossAxisAlignment;
 
-  /// Whether the first child should be expanded to fill the available space.
-  final bool expandFirstChild;
-
   @override
   // ignore: library_private_types_in_public_api
   _OverflowViewElement createElement() {
@@ -125,7 +118,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
   @override
   RenderOverflowView createRenderObject(BuildContext context) {
     return RenderOverflowView(
-      expandFirstChild: expandFirstChild,
       direction: direction,
       spacing: spacing,
       layoutBehavior: _layoutBehavior,
@@ -144,7 +136,6 @@ class OverflowView extends MultiChildRenderObjectWidget {
       ..spacing = spacing
       ..layoutBehavior = _layoutBehavior
       ..mainAxisAlignment = mainAxisAlignment
-      ..expandFirstChild = expandFirstChild
       ..crossAxisAlignment = crossAxisAlignment;
   }
 }

From 3071f7351ea22f180f7e3fcd2902c977a6e8a052 Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Fri, 18 Jul 2025 13:54:13 +0200
Subject: [PATCH 09/10] refactor: move out controls of example

---
 example/lib/fixed_flexible.dart    | 210 +++++++----------------------
 example/lib/menu.dart              | 105 +++++----------
 example/lib/overflow_controls.dart | 209 ++++++++++++++++++++++++++++
 3 files changed, 284 insertions(+), 240 deletions(-)
 create mode 100644 example/lib/overflow_controls.dart

diff --git a/example/lib/fixed_flexible.dart b/example/lib/fixed_flexible.dart
index d252a26..40172ca 100644
--- a/example/lib/fixed_flexible.dart
+++ b/example/lib/fixed_flexible.dart
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:overflow_view/overflow_view.dart';
+import 'overflow_controls.dart';
 
 class FixedVsFlexibleDemo extends StatefulWidget {
   const FixedVsFlexibleDemo({super.key});
@@ -70,171 +71,50 @@ class _FixedVsFlexibleDemoState extends State<FixedVsFlexibleDemo> {
               ),
             ),
           ),
-          Wrap(
-            spacing: 16,
-            runSpacing: 8,
-            children: [
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Text("Count: $_count"),
-                  SizedBox(
-                    width: 8,
-                  ),
-                  SizedBox(
-                    width: 150,
-                    child: Slider(
-                      value: _count.toDouble(),
-                      max: 20,
-                      min: 1,
-                      onChanged: (value) {
-                        setState(() {
-                          _count = value.toInt();
-                        });
-                      },
-                    ),
-                  ),
-                ],
-              ),
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Text("Width: ${_width.toInt()}"),
-                  SizedBox(
-                    width: 8,
-                  ),
-                  SizedBox(
-                    width: 150,
-                    child: Slider(
-                      value: _width,
-                      max: 500,
-                      min: 100,
-                      onChanged: (value) {
-                        setState(() {
-                          _width = value;
-                        });
-                      },
-                    ),
-                  ),
-                ],
-              ),
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Text("Spacing: ${_spacing.toInt()}"),
-                  SizedBox(
-                    width: 8,
-                  ),
-                  SizedBox(
-                    width: 150,
-                    child: Slider(
-                      value: _spacing,
-                      max: 50,
-                      min: -10,
-                      onChanged: (value) {
-                        setState(() {
-                          _spacing = value;
-                        });
-                      },
-                    ),
-                  ),
-                ],
-              ),
-            ],
-          ),
-          Row(
-            mainAxisSize: MainAxisSize.min,
-            children: [
-              Text("Fixed"),
-              Switch(
-                  value: _fixed,
-                  onChanged: (value) {
-                    setState(() {
-                      _fixed = value;
-                    });
-                  }),
-            ],
-          ),
-          Wrap(
-            spacing: 16,
-            runSpacing: 8,
-            children: [
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Text("Axis:"),
-                  SizedBox(
-                    width: 8,
-                  ),
-                  DropdownButton<Axis>(
-                    value: _axis,
-                    onChanged: (value) {
-                      if (value != null) {
-                        setState(() {
-                          _axis = value;
-                        });
-                      }
-                    },
-                    items: Axis.values.map((axis) {
-                      return DropdownMenuItem<Axis>(
-                        value: axis,
-                        child: Text(axis == Axis.horizontal ? "Horizontal" : "Vertical"),
-                      );
-                    }).toList(),
-                  ),
-                ],
-              ),
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Text("MainAxisAlignment:"),
-                  SizedBox(
-                    width: 8,
-                  ),
-                  DropdownButton<MainAxisAlignment>(
-                    value: _mainAxisAlignment,
-                    onChanged: (value) {
-                      if (value != null) {
-                        setState(() {
-                          _mainAxisAlignment = value;
-                        });
-                      }
-                    },
-                    items: MainAxisAlignment.values.map((alignment) {
-                      return DropdownMenuItem<MainAxisAlignment>(
-                        value: alignment,
-                        child: Text(alignment.toString().split('.').last),
-                      );
-                    }).toList(),
-                  ),
-                ],
-              ),
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Text("CrossAxisAlignment:"),
-                  SizedBox(
-                    width: 8,
-                  ),
-                  DropdownButton<CrossAxisAlignment>(
-                    value: _crossAxisAlignment,
-                    onChanged: (value) {
-                      if (value != null) {
-                        setState(() {
-                          _crossAxisAlignment = value;
-                        });
-                      }
-                    },
-                    items: CrossAxisAlignment.values.map((alignment) {
-                      return DropdownMenuItem<CrossAxisAlignment>(
-                        value: alignment,
-                        child: Text(alignment.toString().split('.').last),
-                      );
-                    }).toList(),
-                  ),
-                ],
-              ),
-            ],
+          OverflowControls(
+            mainAxisAlignment: _mainAxisAlignment,
+            crossAxisAlignment: _crossAxisAlignment,
+            axis: _axis,
+            spacing: _spacing,
+            expandFirstChild: false,
+            fixed: _fixed,
+            count: _count,
+            width: _width,
+            onMainAxisAlignmentChanged: (value) {
+              setState(() {
+                _mainAxisAlignment = value;
+              });
+            },
+            onCrossAxisAlignmentChanged: (value) {
+              setState(() {
+                _crossAxisAlignment = value;
+              });
+            },
+            onAxisChanged: (value) {
+              setState(() {
+                _axis = value;
+              });
+            },
+            onSpacingChanged: (value) {
+              setState(() {
+                _spacing = value;
+              });
+            },
+            onFixedChanged: (value) {
+              setState(() {
+                _fixed = value;
+              });
+            },
+            onCountChanged: (value) {
+              setState(() {
+                _count = value;
+              });
+            },
+            onWidthChanged: (value) {
+              setState(() {
+                _width = value;
+              });
+            },
           ),
         ],
       ),
diff --git a/example/lib/menu.dart b/example/lib/menu.dart
index 6145fb9..b3911fc 100644
--- a/example/lib/menu.dart
+++ b/example/lib/menu.dart
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:overflow_view/overflow_view.dart';
+import 'overflow_controls.dart';
 
 class MenuDemo extends StatefulWidget {
   const MenuDemo({super.key});
@@ -36,81 +37,35 @@ class _MenuDemoState extends State<MenuDemo> {
           ),
         ),
         SizedBox(height: 20),
-        Wrap(
-          spacing: 10,
-          runSpacing: 10,
-          children: [
-            Column(
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text('MainAxisAlignment'),
-                SizedBox(height: 10),
-                SegmentedButton<MainAxisAlignment>(
-                  segments: [
-                    ButtonSegment(value: MainAxisAlignment.start, label: Text('Start')),
-                    ButtonSegment(value: MainAxisAlignment.center, label: Text('Center')),
-                    ButtonSegment(value: MainAxisAlignment.end, label: Text('End')),
-                  ],
-                  selected: {_mainAxisAlignment},
-                  onSelectionChanged: (value) {
-                    setState(() {
-                      _mainAxisAlignment = value.first;
-                    });
-                  },
-                ),
-              ],
-            ),
-            Column(
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text('CrossAxisAlignment'),
-                SizedBox(height: 10),
-                SegmentedButton<CrossAxisAlignment>(
-                  segments: [
-                    ButtonSegment(value: CrossAxisAlignment.start, label: Text('Start')),
-                    ButtonSegment(value: CrossAxisAlignment.center, label: Text('Center')),
-                    ButtonSegment(value: CrossAxisAlignment.end, label: Text('End')),
-                  ],
-                  selected: {_crossAxisAlignment},
-                  onSelectionChanged: (value) {
-                    setState(() {
-                      _crossAxisAlignment = value.first;
-                    });
-                  },
-                ),
-              ],
-            ),
-            Row(
-              children: [
-                Switch(
-                  value: _expandFirstChild,
-                  onChanged: (value) {
-                    setState(() {
-                      _expandFirstChild = value;
-                    });
-                  },
-                ),
-                Text('Expand first child'),
-              ],
-            ),
-            Column(children: [
-              Text('Spacing (${_spacing.toInt()})'),
-              SizedBox(height: 10),
-              SizedBox(
-                width: 200,
-                child: Slider(
-                  value: _spacing,
-                  min: -4,
-                  max: 16,
-                  onChanged: (value) {
-                    setState(() {
-                      _spacing = value;
-                    });
-                  },
-                ),
-              ),
-            ]),
-          ],
+        OverflowControls(
+          mainAxisAlignment: _mainAxisAlignment,
+          crossAxisAlignment: _crossAxisAlignment,
+          axis: Axis.horizontal,
+          spacing: _spacing,
+          expandFirstChild: _expandFirstChild,
+          fixed: false,
+          count: 0,
+          width: 0,
+          onMainAxisAlignmentChanged: (value) {
+            setState(() {
+              _mainAxisAlignment = value;
+            });
+          },
+          onCrossAxisAlignmentChanged: (value) {
+            setState(() {
+              _crossAxisAlignment = value;
+            });
+          },
+          onSpacingChanged: (value) {
+            setState(() {
+              _spacing = value;
+            });
+          },
+          onExpandFirstChildChanged: (value) {
+            setState(() {
+              _expandFirstChild = value;
+            });
+          },
         ),
       ],
     );
diff --git a/example/lib/overflow_controls.dart b/example/lib/overflow_controls.dart
new file mode 100644
index 0000000..f5ead84
--- /dev/null
+++ b/example/lib/overflow_controls.dart
@@ -0,0 +1,209 @@
+import 'package:flutter/material.dart';
+
+class OverflowControls extends StatelessWidget {
+  final MainAxisAlignment mainAxisAlignment;
+  final CrossAxisAlignment crossAxisAlignment;
+  final Axis axis;
+  final double spacing;
+  final bool expandFirstChild;
+  final bool fixed;
+  final int count;
+  final double width;
+  final ValueChanged<MainAxisAlignment>? onMainAxisAlignmentChanged;
+  final ValueChanged<CrossAxisAlignment>? onCrossAxisAlignmentChanged;
+  final ValueChanged<Axis>? onAxisChanged;
+  final ValueChanged<double>? onSpacingChanged;
+  final ValueChanged<bool>? onExpandFirstChildChanged;
+  final ValueChanged<bool>? onFixedChanged;
+  final ValueChanged<int>? onCountChanged;
+  final ValueChanged<double>? onWidthChanged;
+
+  const OverflowControls({
+    super.key,
+    required this.mainAxisAlignment,
+    required this.crossAxisAlignment,
+    required this.axis,
+    required this.spacing,
+    required this.expandFirstChild,
+    required this.fixed,
+    required this.count,
+    required this.width,
+    this.onMainAxisAlignmentChanged,
+    this.onCrossAxisAlignmentChanged,
+    this.onAxisChanged,
+    this.onSpacingChanged,
+    this.onExpandFirstChildChanged,
+    this.onFixedChanged,
+    this.onCountChanged,
+    this.onWidthChanged,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Wrap(
+          spacing: 16,
+          runSpacing: 8,
+          children: [
+            if (onCountChanged != null)
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Count: $count"),
+                  SizedBox(width: 8),
+                  SizedBox(
+                    width: 150,
+                    child: Slider(
+                      value: count.toDouble(),
+                      max: 20,
+                      min: 1,
+                      onChanged: (value) {
+                        onCountChanged?.call(value.toInt());
+                      },
+                    ),
+                  ),
+                ],
+              ),
+            if (onWidthChanged != null)
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Width: ${width.toInt()}"),
+                  SizedBox(width: 8),
+                  SizedBox(
+                    width: 150,
+                    child: Slider(
+                      value: width,
+                      max: 500,
+                      min: 100,
+                      onChanged: onWidthChanged,
+                    ),
+                  ),
+                ],
+              ),
+            if (onSpacingChanged != null)
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Spacing: ${spacing.toInt()}"),
+                  SizedBox(width: 8),
+                  SizedBox(
+                    width: 150,
+                    child: Slider(
+                      value: spacing,
+                      max: 50,
+                      min: -10,
+                      onChanged: onSpacingChanged,
+                    ),
+                  ),
+                ],
+              ),
+          ],
+        ),
+        if (onExpandFirstChildChanged != null || onFixedChanged != null)
+          Wrap(
+            spacing: 16,
+            runSpacing: 8,
+            children: [
+              if (onExpandFirstChildChanged != null)
+                Row(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Switch(
+                      value: expandFirstChild,
+                      onChanged: onExpandFirstChildChanged,
+                    ),
+                    Text('Expand first child'),
+                  ],
+                ),
+              if (onFixedChanged != null)
+                Row(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Text("Fixed"),
+                    Switch(
+                      value: fixed,
+                      onChanged: onFixedChanged,
+                    ),
+                  ],
+                ),
+            ],
+          ),
+        Wrap(
+          spacing: 16,
+          runSpacing: 8,
+          children: [
+            if (onAxisChanged != null)
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("Axis:"),
+                  SizedBox(width: 8),
+                  DropdownButton<Axis>(
+                    value: axis,
+                    onChanged: (value) {
+                      if (value != null) {
+                        onAxisChanged?.call(value);
+                      }
+                    },
+                    items: Axis.values.map((axis) {
+                      return DropdownMenuItem<Axis>(
+                        value: axis,
+                        child: Text(axis == Axis.horizontal ? "Horizontal" : "Vertical"),
+                      );
+                    }).toList(),
+                  ),
+                ],
+              ),
+            if (onMainAxisAlignmentChanged != null)
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("MainAxisAlignment:"),
+                  SizedBox(width: 8),
+                  DropdownButton<MainAxisAlignment>(
+                    value: mainAxisAlignment,
+                    onChanged: (value) {
+                      if (value != null) {
+                        onMainAxisAlignmentChanged?.call(value);
+                      }
+                    },
+                    items: MainAxisAlignment.values.map((alignment) {
+                      return DropdownMenuItem<MainAxisAlignment>(
+                        value: alignment,
+                        child: Text(alignment.toString().split('.').last),
+                      );
+                    }).toList(),
+                  ),
+                ],
+              ),
+            if (onCrossAxisAlignmentChanged != null)
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Text("CrossAxisAlignment:"),
+                  SizedBox(width: 8),
+                  DropdownButton<CrossAxisAlignment>(
+                    value: crossAxisAlignment,
+                    onChanged: (value) {
+                      if (value != null) {
+                        onCrossAxisAlignmentChanged?.call(value);
+                      }
+                    },
+                    items: CrossAxisAlignment.values.map((alignment) {
+                      return DropdownMenuItem<CrossAxisAlignment>(
+                        value: alignment,
+                        child: Text(alignment.toString().split('.').last),
+                      );
+                    }).toList(),
+                  ),
+                ],
+              ),
+          ],
+        ),
+      ],
+    );
+  }
+}

From 3c2046bcc048de99afd96a6f197786322a318502 Mon Sep 17 00:00:00 2001
From: Yannick Stolle <yannick.stolle@merckgroup.com>
Date: Fri, 18 Jul 2025 13:54:32 +0200
Subject: [PATCH 10/10] chore: add assertions for unsupported alignment
 behaviours

---
 lib/src/rendering/overflow_view.dart | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/lib/src/rendering/overflow_view.dart b/lib/src/rendering/overflow_view.dart
index 2e3acf4..dd8a55e 100644
--- a/lib/src/rendering/overflow_view.dart
+++ b/lib/src/rendering/overflow_view.dart
@@ -38,7 +38,11 @@ class RenderOverflowView extends RenderBox
           mainAxisAlignment != MainAxisAlignment.spaceBetween &&
               mainAxisAlignment != MainAxisAlignment.spaceAround &&
               mainAxisAlignment != MainAxisAlignment.spaceEvenly,
-          "mainAxisAlignment must not be spaceBetween, spaceAround or spaceEvenly",
+          "mainAxisAlignment must not be spaceBetween, spaceAround or spaceEvenly (current not supported)",
+        ),
+        assert(
+          crossAxisAlignment != CrossAxisAlignment.baseline && crossAxisAlignment != CrossAxisAlignment.stretch,
+          "crossAxisAlignment must not be baseline or stretch (current not supported)",
         ),
         _direction = direction,
         _spacing = spacing,