Флаттер: синхронизация позиций прокрутки ListView - PullRequest
0 голосов
/ 21 октября 2018

Я пытаюсь дать этому экрану определенное поведение при прокрутке.Каждая строка содержит данные, предоставленные ей с использованием шаблона BLoC.Левая сторона экрана должна прокручиваться только вертикально, тогда как правая сторона должна прокручиваться как по горизонтали, так и по вертикали.В настоящее время я делаю это, имея два отдельных списка для вертикальной прокрутки и разделяя BLoC.Затем виджеты с правой стороны оборачиваются в виде списка, перемещаясь в противоположном направлении.

enter image description here

Мне нужно синхронизировать вертикальный и горизонтальный представления списка (ипотенциально прокручивать представления в будущем) и не смогли успешно обеспечить синхронизацию позиций прокрутки.Как я могу синхронизировать несколько позиций списка?Вот фрагмент кода для того, что я пытаюсь сделать:

class ComposePage extends StatefulWidget {
  @override
  _ComposePageState createState() => _ComposePageState();
}

class _ComposePageState extends State<ComposePage> {
  final TrackingScrollController _scrollController = TrackingScrollController();

  @override
  Widget build(BuildContext context) {
    return Container(
      child: NotificationListener<ScrollNotification>(
        onNotification: (notification) {
          print("SCROLL");

_scrollController.position.setPixels(notification.metrics.pixels);
          for (ScrollPosition position in _scrollController.position)
            position.setPixels(notification.metrics.pixels);
        },
        child: Column(
          verticalDirection: VerticalDirection.up,
          children: <Widget>[
            Expanded(
              flex: 8,
              child: Material(
                type: MaterialType.canvas,
                elevation: 1.0,
                child: _buildBuildComposeContent(_scrollController),
              ),
            ),
            Expanded(
              flex: 1,
              child: Material(
                type: MaterialType.canvas,
                elevation: 20.0,
                child: ControlsHeader(),
              ),
            )
          ],
        ),
      ),
      color: Colors.green,
    );
  }

  _buildBuildComposeContent(TrackingScrollController scrollController) {
    return Container(
      child: Row(
        children: <Widget>[
          Expanded(
            flex: 1,
            child: _buildLabelArea(scrollController),
          ),
          Expanded(
            flex: 7,
            child: _buildEditArea(scrollController),
          ),
        ],
      ),
    );
  }

  Column _buildLabelArea(TrackingScrollController controller) {
    return Column(
      children: [
        Expanded(
          flex: 1,
          child: Container(
            color: Colors.pink,
          ),
        ),
        Expanded(
          flex: 8,
          child: ListView(
            scrollDirection: Axis.vertical,
            controller: controller,
            children: <Widget>[
              BlocProvider(
                bloc: TrackBloc(),
                child: TrackLabel(),
              ),
              BlocProvider(
                bloc: TrackBloc(),
                child: TrackLabel(),
              ),
              BlocProvider(
                bloc: TrackBloc(),
                child: TrackLabel(),
              ),
              BlocProvider(
                bloc: TrackBloc(),
                child: TrackLabel(),
              ),
            ],
          ),
        ),
      ],
    );
  }

  Column _buildEditArea(TrackingScrollController controller) {
    return Column(
      children: <Widget>[
        Expanded(
          flex: 1,
          child: Playhead(),
        ),
        Expanded(
          flex: 8,
          child: Container(
            child: ListView(
              scrollDirection: Axis.vertical,
              controller: controller,
              children: <Widget>[
                BlocProvider(
                  bloc: TrackBloc(),
                  child: TrackView(isEditable: true),
                ),
                BlocProvider(
                  bloc: TrackBloc(),
                  child: TrackView(isEditable: true),
                ),
                BlocProvider(
                  bloc: TrackBloc(),
                  child: TrackView(isEditable: true),
                ),
                BlocProvider(
                  bloc: TrackBloc(),
                  child: TrackView(isEditable: true),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}
...