[flutter_adaptive_scaffold] Body becomes blank if window is a particular size within specified breakpoints

[kaboc]

Steps to reproduce

1. Run the code below.
2. Open the console to see the window size info.
3. Resize the window and see if the content becomes blank.

Expected results

Text is shown whatever size the window is.

Actual results

The body becomes blank when the window size is:

• height < 480, width >= 600
• height >= 900, height > width
• etc.

flutter_adaptive_scaffold 0.1.12 and below don't have this issue. I'm not sure if the suddenly changed behaviour is related to some of the breaking changes in 0.2.0 mentioned in the change log.

I was expecting mediumAndUp would work for medium size and any larger size. Is it wrong?

Code sample

Code sample

import 'package:flutter/material.dart';
import 'package:flutter_adaptive_scaffold/flutter_adaptive_scaffold.dart';

const destinations = [
  (icon: Icon(Icons.star), label: 'Star'),
  (icon: Icon(Icons.favorite), label: 'Heart'),
];

void main() => runApp(const App());

class App extends StatefulWidget {
  const App();

  @override
  State<App> createState() => _AppState();
}

class _AppState extends State<App> {
  int _index = 0;

  @override
  Widget build(BuildContext context) {
    print(MediaQuery.sizeOf(context));

    return MaterialApp(
      home: Scaffold(
        body: AdaptiveLayout(
          transitionDuration: Duration.zero,
          body: SlotLayout(
            config: {
              Breakpoints.small: SlotLayout.from(
                key: const ValueKey('small body'),
                builder: (context) {
                  return Center(
                    child: Text('Small: ${destinations[_index].label}'),
                  );
                },
              ),
              Breakpoints.mediumAndUp: SlotLayout.from(
                key: const ValueKey('mediumAndUp body'),
                builder: (context) {
                  return Center(
                    child: Text('Medium and up: ${destinations[_index].label}'),
                  );
                },
              ),
            },
          ),
          bottomNavigation: SlotLayout(
            config: {
              Breakpoints.small: SlotLayout.from(
                key: const ValueKey('bottomNavigation'),
                builder: (context) {
                  return AdaptiveScaffold.standardBottomNavigationBar(
                    currentIndex: _index,
                    onDestinationSelected: (index) {
                      setState(() => _index = index);
                    },
                    destinations: [
                      for (final destination in destinations)
                        NavigationDestination(
                          icon: destination.icon,
                          label: destination.label,
                        ),
                    ],
                  );
                },
              ),
            },
          ),
          primaryNavigation: SlotLayout(
            config: {
              Breakpoints.mediumAndUp: SlotLayout.from(
                key: const ValueKey('primaryNavigation'),
                builder: (context) {
                  return AdaptiveScaffold.standardNavigationRail(
                    selectedIndex: _index,
                    onDestinationSelected: (index) {
                      setState(() => _index = index);
                    },
                    destinations: [
                      for (final destination in destinations)
                        NavigationRailDestination(
                          icon: destination.icon,
                          label: Text(destination.label),
                        ),
                    ],
                  );
                },
              ),
            },
          ),
        ),
      ),
    );
  }
}

Screenshots or Video

No response

Logs

No response

Flutter Doctor output

Doctor output

[√] Flutter (Channel stable, 3.22.3, on Microsoft Windows [Version 10.0.22631.4037], locale ja-JP)
    • Flutter version 3.22.3 on channel stable at D:\xxxx\flutter\sdk
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision b0850beeb2 (4 weeks ago), 2024-07-16 21:43:41 -0700
    • Engine revision 235db911ba
    • Dart version 3.4.4
    • DevTools version 2.34.3

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at D:\xxxx\android\sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = D:\xxxx\android\sdk
    • Java binary at: C:\Program Files\JetBrains\IntelliJ IDEA 2023.2.5\jbr\bin\java
    • Java version OpenJDK Runtime Environment JBR-17.0.11+1-1207.30-jcef (build 17.0.11+1-b1207.30)
    • All Android licenses accepted.

[X] Chrome - develop for the web (Cannot find Chrome executable at .\Google\Chrome\Application\chrome.exe)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.10.6)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.10.35201.131
    • Windows 10 SDK version 10.0.22621.0

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/windows#android-setup for detailed instructions).

[√] IntelliJ IDEA Ultimate Edition (version 2024.1)
    • IntelliJ at C:\Program Files\JetBrains\IntelliJ IDEA 2023.2.5
    • Flutter plugin version 81.0.2
    • Dart plugin version 241.18968.26

[√] VS Code (version 1.91.1)
    • VS Code at C:\Users\xxxx\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.94.0

[√] Connected device (2 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.22631.4037]
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 127.0.2651.98

[√] Network resources
    • All expected network resources are available.

! Doctor found issues in 2 categories.

[huycozy]

Hi @kaboc
I see that when the window size is Size(591.0, 493.0), it falls into Breakpoints.small which corresponds to the widget you fill: Text('Small: ${destinations[_index].label}'):

Is this an expected result? Can you please provide a screenshot that you see it as an issue?

[kaboc]

@huycozy
Hi! I've got different results. Are you using flutter_adaptive_scaffold 0.2.0? The issue doesn't occur with <0.2.0.

Size(591.0, 493.0)	Size(591.0, 590.0)	Size(591.0, 591.0)

[kaboc]

Ah! I noticed just now that 0.2.1 was released 9 hours ago. Looks like it has fixed the issue.

[kaboc]

flutter/packages#7347

[kaboc]

Sadly it still happens on mobile.

Size(411.4, 897.1)	Size(877.1, 387.4)

[martijn00]

@kaboc @huycozy I've made a fix for this. See my PR

[kaboc]

@martijn00
Hi, thank you for the quick fix! I tried running my code sample with your version, but it seems the bug still exists. I have the same result as #153496 (comment).

The pubspec.lock file has the following lines, so I don't think I have a mistake in the setup.

  flutter_adaptive_scaffold:
    dependency: "direct main"
    description:
      path: "packages/flutter_adaptive_scaffold"
      ref: andup
      resolved-ref: "6c83fdbc1b6582b5d70182dc12a7b15c437361d7"
      url: "https://github.com/martijn00/flutter_packages.git"
    source: git
    version: "0.2.1+1"

BTW, I think the version should be 0.2.2 instead of 0.2.1+1 since it is a bug fix.

[huycozy]

Sadly it still happens on mobile.

Thanks. Indeed it is in landscape mode on mobile device. Reproduced this on flutter_adaptive_scaffold: 0.2.1.

I've made a fix for this. See my PR

Thanks for your contribution.

[gspencergoog]

Fixed in flutter/packages#7425

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.