Как добавить прокручиваемые вкладки с закрепленным заголовком в DraggableScrollableSheet?

#flutter #tabs #nestedscrollview

#flutter #вкладки #вложенный просмотр прокрутки

Вопрос:

Я пытаюсь использовать a NestedScrollView для прокручиваемых вкладок внутри a DraggableScrollableSheet , и мне нужно передать контроллер листа в NestedScrollView прокручиваемое тело, однако это не поддерживается, NestedScrollView что требует, чтобы внутренние прокручиваемые неявно использовали контекст PrimaryScrollController .

Результирующее поведение заключается в том, что я вижу:

  1. Поведение перетаскиваемого листа правильное, и лист перемещается вверх перед прокруткой, но высота заголовка не применяется при прокрутке, и заголовок не реагирует на события перетаскивания (вкладка «Foo» ниже), ИЛИ;
  2. Обратная ситуация — лист не реагирует на события перетаскивания, но высота заголовка применяется правильно, а сам заголовок правильно реагирует на жесты для прокрутки (вкладка «Панель» ниже)

Screen-Recording-2020-12-06-at-5.35.01-pm.gif

Я пробовал несколько комбинаций NestedScrollView , CustomScrollView , и TabView , пытался добавить контроллер ко всем, некоторым, ни к одному из прокручиваемых объектов. Не повезло. Я даже пытался прослушивать Notification события из любого прикрепленного прокручиваемого файла и обновлять другой с помощью этих событий, чтобы попытаться синхронизировать их. Nada.

Был бы признателен за любую помощь в этом, я уже некоторое время рвал на себе волосы. Спасибо!

Вот код для main.dart видео выше:

 import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: DraggableScrollableSheet(
        initialChildSize: 0.6,
        maxChildSize: 0.9,
        minChildSize: 0.6,
        builder: (context, scrollController) => DefaultTabController(
          length: 2,
          child: _buildNestedScrollView(scrollController),
        ),
      ),
    );
  }

  NestedScrollView _buildNestedScrollView(ScrollController scrollController) {
    return NestedScrollView(
      // controller: scrollController,
      headerSliverBuilder: (context, innerBoxIsScrolled) {
        print('innerBoxIsScrolled $innerBoxIsScrolled');
        return [
          SliverOverlapAbsorber(
            handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
            sliver: SliverAppBar(
              toolbarHeight: 0.0,
              pinned: true,
              primary: false,
              forceElevated: innerBoxIsScrolled,
              bottom: TabBar(
                tabs: [
                  Tab(text: 'Foo'),
                  Tab(text: 'Bar'),
                ],
              ),
            ),
          ),
        ];
      },
      body: TabBarView(
        children: [
          ListView.builder(
            controller: scrollController,
            physics: ClampingScrollPhysics(),
            padding: EdgeInsets.zero,
            itemBuilder: (context, index) => Container(
              color: Colors.primaries[index % 10],
              height: 150.0,
            ),
          ),
          ListView.builder(
            // controller: scrollController,
            physics: ClampingScrollPhysics(),
            padding: EdgeInsets.zero,
            itemBuilder: (context, index) => Container(
              color: Colors.primaries[index % 10],
              height: 25.0,
            ),
          ),
        ],
      ),
    );
  }
}
 

Соответствующие ссылки:

https://api.flutter.dev/flutter/widgets/ScrollableWidgetBuilder.html

https://api.flutter.dev/flutter/widgets/NestedScrollView/body.html

Потенциально актуальная проблема с флаттером.

Комментарии:

1. Удалось ли вам решить эту проблему? Я также борюсь с NestedScrollView

2. К сожалению, нет @RaulMabe (и приносим извинения за поздний ответ). Я бы предложил проголосовать за проблему Flutter выше, чтобы привлечь больше внимания к решению команды Flutter.