确定滚动小部件高度

Question

我想确定“可滚动”小部件是否确实需要滚动。我最终想展示类似“Scroll for more”之类的东西。我如何做到这一点？

我可以使用 LayoutBuilder 和 ScrollController 的组合。但是，ScrollController 仅在任何事件发生后才给我 maxScrollExtent 和 minScrollExtent - 例如用户尝试滚动

我想在“构建”期间知道，以便我可以根据屏幕尺寸确定是否显示“滚动更多”

class _MyHomePageState extends State<MyHomePage> {
  int value = 0;
  String text = 'You have pushed the button 0 times\n';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
              flex: 9,
              child: SingleChildScrollView(
                child: Text(text),
              ),
            ),
            Expanded(
              flex: 1,
                child: Text('Scroll for more')),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            value += 1;
            text = text + 'You have pushed the button $value times \n';
          });
        },
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), 
    );
  }
}

我要动态显示

            Text('Scroll for more'),

仅在 SingleChildScrollView 需要滚动以查看整个内容时。请注意，我只是以上面的代码为例。

在我的真实案例中，我在 SingleChildScrollView 中有一个 StreamBuilder，我无法确定有多少数据将从流中流入。我也没有任何按钮或点击或任何手势来访问控制器和 setState

提前感谢您的帮助

Answer 1

class _MyHomePageState extends State<MyHomePage> {
  bool showMore = false;
  final scrollController = ScrollController();

  @override
  Widget build(BuildContext context) {
    SchedulerBinding.instance.addPostFrameCallback((_) {
      setState(() {
        showMore = scrollController.position.maxScrollExtent > 0;
      });
    });
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
              flex: 9,
              child: SingleChildScrollView(
                controller: scrollController,
                child: SizedBox(height: 650, child: Text('blah')),
              ),
            ),
            if (showMore) Expanded(flex: 1, child: Text('Scroll for more')),
          ],
        ),
      ),
    );
  }
}