有没有办法检测到小部件正在使布局溢出?

时间:2018-09-25 15:11:09

标签: flutter flutter-layout

我正在尝试优雅地处理能够运行我的应用程序的多种尺寸的电话和设备。

在iPhone SE上,屏幕并不是真的很宽,所以当布局溢出时,我想隐藏一些标签(仅保留图标)。

Screenshot that shows the problem

以下是使用的代码:

  Widget likeDislikeLine() {
    return Padding(
      padding: EdgeInsets.only(top: 0.0, bottom: 0.0),
      child: ButtonBar(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          OutlineButton.icon(
            textColor: Colors.black,
            icon: Icon(Icons.favorite_border, size: 18.0),
            label: Text('J’aime'),
            onPressed: () {
              // Follow segment
            },
          ),
          OutlineButton.icon(
            textColor: Colors.black,
            icon: Icon(Icons.not_interested, size: 18.0),
            label: LayoutBuilder(
                builder: (BuildContext context, BoxConstraints constraints) {
              String label = 'Je n’aime pas';
              TextPainter tp = TextPainter(
                text: TextSpan(text: label),
                textDirection: TextDirection.ltr,
              );
              tp.layout(maxWidth: double.infinity);
              print("${tp.width}, ${constraints.maxWidth}");

              return tp.width < constraints.maxWidth
                  ? Text(label)
                  : const SizedBox();
            }),
            onPressed: () {
              // Ignore segment
            },
          )
        ],
      ),
    );
  }

如何检测当前行是否“溢出”,以便隐藏一些标签?我试图为此使用LayoutBuilder,但没有成功:它总是返回一个约束maxWidth等于double.Infinity的约束。

0 个答案:

没有答案