Skip to content

NestedScrollView.body will be disconnected if horizontal #102001

@Piinks

Description

@Piinks

The NestedScrollView uses the PrimaryScrollController in order to attach to the inner scroll view that the user provides to NestedScrollView.body. It does this in order to keep the two scroll views scrolling in sync. While investigating #100264, I realized that since the PSC only attaches automatically to vertical ScrollViews, if the inner scroll view is horizontal, the NestedScrollView is broken.

Steps to Reproduce

  1. Execute flutter run on the code sample
  2. Observe the header and body do not scroll in sync

Expected results:

The two scroll views should scroll as if they are one scroll view.

Actual results:

They are detached and scrolling separately.

Code sample
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: NestedScrollView(
            scrollDirection: Axis.horizontal, // vertical as well, no matter
            headerSliverBuilder: (context, innerBoxIsScrolled) {
              return [const SliverAppBar(title: Text('Demo'))];
            },
            body: ListView.builder(
              scrollDirection: Axis.horizontal,
              itemBuilder: (context, index) => Text('Index $index'),
            )),
      ),
    );
  }
}
Logs
[✓] Flutter (Channel master, 2.13.0-0.0.pre.586, on macOS 12.3.1 21E258 darwin-x64, locale en)
    • Flutter version 2.13.0-0.0.pre.586 at /Users/katelovett/_github/flutter
    • Upstream repository [email protected]:flutter/flutter.git
    • Framework revision a8da7ced35 (74 minutes ago), 2022-04-15 11:44:08 -0700
    • Engine revision 135a4b5dce
    • Dart version 2.18.0 (build 2.18.0-23.0.dev)
    • DevTools version 2.12.2

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0-rc2)
    • Android SDK at /Users/katelovett/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0-rc2
    • Java binary at: /Applications/Android Studio with Blaze.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio
    • Android Studio at /Applications/Android Studio with Blaze Beta.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.12+0-b1504.28-7817840)

[✓] Android Studio (version 2020.3)
    • Android Studio at /Applications/Android Studio with Blaze.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)

[✓] IntelliJ IDEA Ultimate Edition (version 2021.3.3)
    • IntelliJ at /Applications/IntelliJ UE (stable).app
    • Flutter plugin version 66.0.3
    • Dart plugin version 213.7371

[✓] VS Code (version 1.66.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.38.1

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-x64     • macOS 12.3.1 21E258 darwin-x64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 100.0.4896.88

[✓] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work lista: qualityA truly polished experiencef: scrollingViewports, list views, slivers, etc.frameworkflutter/packages/flutter repository. See also f: labels.team-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions