我正在尝试优雅地处理能够运行我的应用程序的多种尺寸的电话和设备。
在iPhone SE上,屏幕并不是真的很宽,所以当布局溢出时,我想隐藏一些标签(仅保留图标)。
以下是使用的代码:
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
的约束。