extended_nested_scroll_view icon indicating copy to clipboard operation
extended_nested_scroll_view copied to clipboard

[Bug report] The provided ScrollController is currently attached to more than one ScrollPosition.

Open MichalNemec opened this issue 1 year ago • 5 comments

Version

6.0.0

Platforms

macOS, Web, Windows

Device Model

Macbook air m1 2020

flutter info

[✓] Flutter (Channel stable, 3.7.4, on macOS 13.2.1 22D68 darwin-arm64, locale en-CZ)
    • Flutter version 3.7.4 on channel stable at /Users/michalnemec/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision b4bce91dd0 (4 weeks ago), 2023-02-21 09:50:50 +0800
    • Engine revision 248290d6d5
    • Dart version 2.19.2
    • DevTools version 2.20.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0-rc4)
    • Android SDK at /Users/michalnemec/Library/Android/sdk
    • Platform android-33, build-tools 33.0.0-rc4
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.12+0-b1504.28-7817840)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14C18
    • CocoaPods version 1.11.3

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

[✓] Android Studio (version 2021.2)
    • Android Studio at /Applications/Android Studio.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)

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

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 13.2.1 22D68 darwin-arm64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 111.0.5563.64

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

• No issues found!

How to reproduce?

Make nestedscrollview with controller make tabs keep alive content of tabs is customscrollview see errors when hovering over scrollbar.

Logs

Error: 'The provided ScrollController is currently attached to more than one ScrollPosition.
The Scrollbar requires a single ScrollPosition in order to be painted.
When the scrollbar is interactive, the associated ScrollController must only have one ScrollPosition attached.The provided ScrollController must be unique to one ScrollView widget.' has been skipped to due to duplication occurence within 3000 ms.

Example code (optional)

TabBar get _tabBar => TabBar(
        controller: _tabController,
        tabs: const [
          Tab(
            text: 'foo',
          ),
          Tab(
            text: 'bar',
          ),
        ],
      );

ExtendedNestedScrollView(
            physics: AlwaysScrollablePhysics(),
            floatHeaderSlivers: true,
            onlyOneScrollInBody: true,
            controller: scrollController,
            headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
              return <Widget>[
                  SliverAppBar(
                    title: Text('title'),
                  ),
                SliverAppBar(
                  pinned: true,
                  bottom: PreferredSize(
                    preferredSize: const Size.fromHeight(50 + 40),
                    child: Column(
                      children: [
                        Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 4),
                          child: TextField(
                            decoration: InputDecoration(
                              hintText: 'search',
                            ),
                          ),
                        ),
                        _tabBar,
                      ],
                    ),
                  ),
                ),
              ];
            },
            body: TabBarView(
              controller: _tabController,
              physics: const NeverScrollableScrollPhysics(),
              children: const [
                Tab1(),
                Tab2(),
              ],
            ),
          ),


class Tab1 extends ConsumerStatefulWidget {
  const Tab1({super.key});

  @override
  State<Tab1> createState() => _Tab1State();
}

class _FollowingTabState extends State<Tab1> with AutomaticKeepAliveClientMixin<Tab1> {
  bool _shouldKeepAlive = true;

  @override
  bool get wantKeepAlive => _shouldKeepAlive;

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return CustomScrollView(
      physics: scrollingPhysics(),
      slivers: [
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (context, index) {
              return ListTile(
                leading: Container(
                  padding: const EdgeInsets.all(8),
                  width: 100,
                  color: Colors.red,
                  child: const Placeholder(),
                ),
                title: Text('tab1 ${index + 1}', textScaleFactor: 2),
              );
            },
            childCount: 50,
          ),
        ),
      ],
    );
  }
}

class Tab2 extends ConsumerStatefulWidget {
  const Tab2({super.key});

  @override
  State<Tab2> createState() => _Tab2State();
}

class _FollowingTabState extends State<Tab2> with AutomaticKeepAliveClientMixin<Tab2> {
  bool _shouldKeepAlive = true;

  @override
  bool get wantKeepAlive => _shouldKeepAlive;

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return CustomScrollView(
      physics: scrollingPhysics(),
      slivers: [
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (context, index) {
              return ListTile(
                leading: Container(
                  padding: const EdgeInsets.all(8),
                  width: 100,
                  color: Colors.red,
                  child: const Placeholder(),
                ),
                title: Text('tab2 ${index + 1}', textScaleFactor: 2),
              );
            },
            childCount: 50,
          ),
        ),
      ],
    );
  }
}

How to create Nested scrollview with kept alive tabs and have scrollbar there in any way that it just works?

MichalNemec avatar Mar 20 '23 01:03 MichalNemec