首页 文章

如何同步singlechildscrollview和listview flutter的滚动？

提问于
浏览 次
1

如何组合singlechildscrollview和listview的滚动？我正在尝试创建一个布局，其中包含一个包含一些小部件和列表视图的列的单子列表视图 . 如何组合滚动视图的滚动控制器和列表视图 . （即我希望列表视图仅在其他窗口小部件滚出显示时滚动，并且仅在列表视图到达顶部时再次显示 . ） For instance: 在Instagram应用程序中，您有小部件，如userimage，username，followers count，following count等等，然后有一个列表视图列出用户的帖子 . 滚动已连接 . 我如何实现这一目标???

我想要的

What I Want

我以前的代码

My previous code

实施安德烈·图尔科夫斯基法典后

After Implementing Andrey Turkovsky's Code

listview flutter

1 回答

  • 1

    当嵌套列表视图到达顶部时，我可以编写用于滚动父级的解决方案 . 这是我代码的一部分 - 我有2个元素的ListView . 第二个是另一个ListView

    class _ConferenceScaffoldState extends CommonScaffoldState<ConferenceScaffold> {

    final ScrollController controller = ScrollController();
    final GlobalKey widgetKey = GlobalKey();
    /* widgetKey is for widget in buildHeaderRow() */
    StreamController<bool> _streamController = StreamController<bool>();

    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text(conference_title),
          centerTitle: true,
        ),
        body: getBody(),
      );
    }

    Widget getBody() {
    controller.addListener((){
      if (widgetKey.currentContext != null) {
        double height = widgetKey.currentContext.size.height;
        _streamController.add(controller.offset >= height);
      }
    });
      return ListView(
        controller: controller,
        children: <Widget>[buildHeaderRow(), buildPagerRow()],
      );
    }

    Widget buildPagerRow() => _EventSpeakerPager(scrollCallback, _streamController.stream);

    scrollCallback(double position) => controller.position.jumpTo(controller.position.pixels - position);

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

  typedef ScrollCallback = void Function(double position);

  class _EventSpeakerPager extends StatefulWidget {
    _EventSpeakerPager(this.callback, this.stream);

    final ScrollCallback callback;
    final Stream<bool> stream;

    @override
    State<StatefulWidget> createState() => _EventSpeakerPagerState();
  }

  class _EventSpeakerPagerState extends State<_EventSpeakerPager> {
    final GlobalKey tabKey = GlobalKey();
    bool isChildScrollEnabled = false;

  @override
  void initState() {
    super.initState();
    widget.stream.distinct().listen((bool data) {
      setState(() {
        isChildScrollEnabled = data;
      });
    });
  }

    @override
    Widget build(BuildContext context) {
      ListView eventList = ListView.builder(
        physics: isChildScrollEnabled ? AlwaysScrollableScrollPhysics() : NeverScrollableScrollPhysics(),
        controller: ScrollController(),
        itemBuilder: (buildContext, position) {
          if (position.isOdd) return CommonDivider();
          return buildEventRow(getEventList()[position ~/ 2], false, null);
        },
        itemCount: getEventList().length * 2,
      );
      return Listener(
        onPointerMove: (event) {
          double pixels = eventList.controller.position.pixels;
          if (event.delta.dy > 0.0 && pixels == 0.0) widget.callback(event.delta.dy);
        },
        child: ...,
      );
    }
  }

    UPD 添加了用于更改子流的滚动物理的解决方案

    回复于

相关问题