I have a flutter app with an events list. I am adding a calendar view where the events can be seen as dots on a calendar grid with an events list underneath if a day with events is selected. I got a premade widget from flutter gems here: https://fluttergems.dev/packages/flutter_neat_and_clean_calendar/

src:
https://github.com/rwbr/flutter_neat_and_clean_calendar/blob/main/lib/flutter_neat_and_clean_calendar.dart

This works and looks fine in typical phone dimensions but my tests fail because the test surface that the widget is pumped on is more square. Similarly, rotating the phone will cause this overflow. I want to eventually create a different calendar page for the rotated view. For now, I would like to figure out how to get the calendar to not overflow.

I tried to wrap the calendar widget in a SingleChildScrollView but this led to the error:

 I/flutter ( 4605): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter ( 4605): The following assertion was thrown during performLayout():
I/flutter ( 4605): RenderFlex children have non-zero flex but incoming height constraints are unbounded.
I/flutter ( 4605): When a column is in a parent that does not provide a finite height constraint, for example if it is
I/flutter ( 4605): in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a
I/flutter ( 4605): flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining
I/flutter ( 4605): space in the vertical direction.
I/flutter ( 4605): These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child
I/flutter ( 4605): cannot simultaneously expand to fit its parent.
I/flutter ( 4605): Consider setting mainAxisSize to MainAxisSize.min and using FlexFit.loose fits for the flexible
I/flutter ( 4605): children (using Flexible rather than Expanded). This will allow the flexible children to size
I/flutter ( 4605): themselves to less than the infinite remaining space they would otherwise be forced to take, and
I/flutter ( 4605): then will cause the RenderFlex to shrink-wrap the children rather than expanding to fit the maximum
I/flutter ( 4605): constraints provided by the parent.

I tried changing the use of Expanded’s to Flexible with fit: FlexFit.loose. Perhaps I missed some but I was getting another error that that the size was missing. I also briefly gave up and just set the test surface’s dimensions manually to get around the overflow. However I am now trying to get the widget to work on any screen (not necessarily look good, just not overflow). I tried going into the source code and changing the individual parts of the widget (it is a Container with a Column with Children: Row (for top part of calendar), GridView for the calendar days, Row for an expansion button (can collapse/expand the calendar from 30-day view to 7-day view), and then an ListView Builder’s event list. I tried wrapping the GridView in a SingleChildScrollView but it still overflows and doesnt allow scrolling. The day GridView is actually wrapped in a GestureDetector. Not sure if this needs to be accounted for.

This is my calendar page:

and this is my test code:

    testWidgets('CalendarPage shows Calendar and Search Bar',
        (WidgetTester tester) async {
      // test is fragile due to overlow of calendar when height is too low or high relative to width
      //await tester.binding.setSurfaceSize(Size(300,497));
      var numEvents = 7;
      // Mock event list for testing
      testEvent(int idx) => NeatCleanCalendarEvent("A Test Event ${idx}",
          isMultiDay: true,
          startTime: DateTime.now().add(Duration(hours: idx * idx)),
          endTime: DateTime.now()
              .add(Duration(hours: idx * idx))
              .add(Duration(hours: 25)),
          description: 'A test event',
          color: Colors.blue);
      var mockEvents = List.generate(numEvents, testEvent);

      // Pump the CalendarPage with a mocked event list
      /*
      await tester.pumpWidget(MaterialApp(
          home: Scaffold(body: SingleChildScrollView(child:
          CalendarPage(eventList: mockEvents))))
      );
      */
      await tester.pumpWidget(MaterialApp(
          home: Scaffold(body:
          CalendarPage(eventList: mockEvents)))
      );
     
    
      expect(find.byType(CalendarPage), findsOneWidget);
      await tester.pumpAndSettle(); // Rebuild the widget after the state has changed

      // Verify the search bar is present
      expect(find.byType(TextField), findsOneWidget);
      expect(find.byType(Calendar), findsOneWidget);

    });

If anyone could come up with some solutions that get around the overflow, I would really appreciate it!

( )