如何获得全尺寸高度的自定义滚动视图小部件在扑动?

Question

我想获得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。"高度"不反映整体高度，因此该功能无法正确实现。在这种情况下，有什么好的方法来使用它吗?

Answer 1

CustomScrollView

创建自定义滚动效果的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,
),
])),
...