确定滚动小部件高度

Question

我想确定 'scrollable' 小部件是否确实需要滚动。我最终想展示类似 'Scroll for more' 的内容。我该如何实现？

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

我想在 'build' 期间知道，以便我可以根据屏幕尺寸决定是否显示 'Scroll for more'

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')),
          ],
        ),
      ),
    );
  }
}

确定滚动小部件高度

Determine Scroll Widget height

flutter

scroll

height