Flutter - 如何在水平 ListView 中获取 FlatButton 的宽度

Question

我想在水平 ListView 中获得 FlatButton 的宽度，但我只能获得Width: Infinity 。

我可以成功地在隔离的 FlatButton 中获得宽度，但是当 FlatButton 在 ListView 内部时，我不能，但我不知道为什么。 当 FlatButton 在 ListView 中时，你能帮我获取它的宽度吗？

谢谢。

@override
  Widget build(BuildContext context) {


    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter App'),
      ),
      body: Container(
        height: 70.0,
        child: ListView(
          scrollDirection: Axis.horizontal,
          children: <Widget>[
            _flatButtonStoreWidth(),
            _flatButtonStoreWidth(),
            _flatButtonStoreWidth(),
            _flatButtonStoreWidth(),
            _flatButtonStoreWidth(),

          ],
        ),
      ),
    );
  }

Widget _flatButtonStoreWidth (){

return FlatButton (
  child: LayoutBuilder(
    builder: (BuildContext context, BoxConstraints constraints) {
      double _width = constraints.maxWidth;
      print('Width: $_width');
      return Text('This is a FlatButton');
    },
  ),
  onPressed: (){},
);

}

Answer 1

那是因为具有水平轴的 ListView 具有无限宽度。 您必须为每个 FlatButton 提供宽度。

FlatButton 从父级获取其大小。 在这种情况下，父级提供无限宽度。 因此你应该自己调整按钮的大小

Answer 2

要在 ListView 中获取对象的宽度，您应该：

1. 给小部件一个GlobalKey 。
2. 构建完成后，通过GlobalKey访问上下文。
3. 使用context您可以通过context.size获取大小。
4. 您可以从Size对象获取宽度。

以下是供您参考的工作代码：

Widget _flatButtonStoreWidth() {
    GlobalKey globalKey = GlobalKey();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      double _width = globalKey.currentContext.size.width;
      print('Width: $_width');
    });
    return FlatButton(
      key: globalKey,
      child: Text('This is a FlatButton'),
      onPressed: () {},
    );
  }

我希望这会有所帮助，如有任何疑问，请发表评论。 如果此答案对您有帮助，请接受并投票。