1

我想获得 CustomScrollView 小部件的整个高度。所以我做了一个下面的代码，但它不工作。

@override
void initState(){
 super.initState();
 WidgetsBinding.instance.addPostFrameCallback((_) => getSizeAndPosition());
}

getSizeAndPosition() {
    RenderBox _customScrollBox =
        _customScrollKey.currentContext.findRenderObject();
    _customScrollSize = _customScrollBox.size;
    _customScrollPosition = _customScrollBox.localToGlobal(Offset.zero);
    print(_customScrollSize.height);
    setState(() {});
  }

@override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _customScrollKey,
      appBar: _appbar(),
      body: CustomScrollView(
        controller: _controller,
        slivers: [
          SliverList(
              delegate: SliverChildListDelegate([
            _titleSection(),
            _thumnail(),
            SizedBox(
              height: 40,
            ),
          ])),
        ],
      ),
    );
  }

这段代码得到的高度没有考虑到customScrollview中列表的高度。我的意思是，_customScrollSize.height和MediaQuery.of(context).size.width是一样的。

我想要这个功能

_controller.addListener(() {
      setState(() {
        if (_controller.offset < 0) {
          scrollHeight = 0;
        } else {
          scrollHeight = _controller.offset;
        }
      });
    });


 Container(
   width: size.width * (scrollHeight / _customScrollSize.height),
   decoration: BoxDecoration(
   border: Border(
           bottom: BorderSide(
           width: 1)),

使用上面的代码，'_customScrollSize.height' 并不能反映整体高度，因此该功能没有正确实现。在这种情况下有什么好的方法可以使用它吗？

4

1 回答 1

0

自定义滚动视图

使用 slivers 创建自定义滚动效果的 ScrollView。

CustomScrollView允许您直接提供条子以创建各种滚动效果，例如列表、网格和扩展标题。例如，要创建一个滚动视图，其中包含一个扩展应用栏，后跟一个列表和一个网格，请使用三个条子的列表：SliverAppBar、SliverList和SliverGrid。

在您的情况下，请删除 appBar 并使用带有自定义滚动视图的 sliverAppBar ，您可以为其他孩子使用sliverfillRemaining小部件

例子

CustomScrollView(
  slivers: <Widget>[
    const SliverAppBar(
      pinned: true,
      expandedHeight: 250.0,
      flexibleSpace: FlexibleSpaceBar(
        title: Text('Demo'),
      ),
    ),
SliverList(
              delegate: SliverChildListDelegate([
            _titleSection(),
            _thumnail(),
            SizedBox(
              height: 40,
            ),
          ])),
...
于 2021-01-18T07:13:31.177 回答