问题描述
我已经阅读了数十篇关于 TextOverflow.ellipsis
不工作的堆栈溢出帖子,并且几乎每个帖子都只是说“将其包装在一个扩展的小部件中”
那是行不通的。我尝试将扩展小部件放在文本小部件、行小部件、容器小部件周围......没有任何效果。一旦我添加了 Expanded Widget,我就会收到一个错误,因为
已经有一个 Expanded Widget请帮助。我会失去理智我发现的唯一“解决方案”是在文本小部件周围的容器上设置宽度,这不是我想要的,因为我希望文本容器能够灵活适应屏幕大小。
错误:
RenderBox was not laid out: RenderConstrainedBox#96e5e relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:Flutter/src/rendering/Box.dart': Failed assertion: line 1930 pos 12: 'hasSize'
代码:
Expanded(
child: Container(
padding: EdgeInsets.fromLTRB(_centeredPadding,_paddingTop,24),child: Row(
mainAxisAlignment: center ? MainAxisAlignment.center : MainAxisAlignment.spaceBetween,crossAxisAlignment: size == 'mobile' ? CrossAxisAlignment.start : CrossAxisAlignment.center,children: [
Row(
children: [
Container(
margin: EdgeInsets.only(right: 15),child: ClipRRect(
borderRadius: BorderRadius.circular(100),child: Image(
width: _iconSize,image: Assetimage('assets/images/users/user-3.png'),),Text(
'Really long name does not fit',overflow: TextOverflow.ellipsis,style: textStyle,],IconButton(
icon: Icon(Icons.settings),padding: EdgeInsets.only(left: 14,right: 16),onpressed: () {
Navigator.pushNamed(context,'home/settings');
},);
重申一下,这不是解决方案:
Expanded(
child: Text(
'Really long name does not fit',
Picture of the non-working code
解决方法
您可能遇到了错误的小部件嵌套问题(Row、in Row、in Row)...
这是您尝试仅使用一行获得的结果的简化示例。
根据您的需要进行调整。
import 'package:flutter/material.dart';
class CustomHeader extends StatelessWidget {
const CustomHeader({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(10.0),child: Row(
children: [
CircleAvatar(
radius: 30.0,backgroundColor: Colors.blue,),SizedBox(width: 10.0),Expanded(
child: Text(
'Really long name does not fit' * 3,// Yes,you can multiply strings in dart :)
overflow: TextOverflow.ellipsis,style: TextStyle(
fontWeight: FontWeight.bold,Icon(Icons.settings),Container(
padding: EdgeInsets.all(5.0),decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10.0),color: Colors.cyan[700],child: Text(
'Give',style: TextStyle(
color: Colors.white,],);
}
}