ListTile susbtitle renderflex溢出

Question

我有像这样的ListTile副标题：

     subtitle:Flexible(flex:1,child:Row(children: [
                    (widget.condiments!=null)?Padding(
                 child:Text(condimentList,style: TextStyle(color:Colors.grey)),
                   padding: EdgeInsets.only(top: 10)):null,
               ])),
 trailing:  Row(             
            mainAxisSize: MainAxisSize.min,     
            children: <Widget>[
              IconButton(
              icon: Icon(Icons.delete))])

我收到以下错误：

A RenderFlex overflowed by 244 pixels on the right.
The relevant error-causing widget was
Row

我希望用Flexible包装它应该可以解决这个问题，但我似乎不太知道如何解决它。

Answer 1

只需对文本进行扩展即可，不需要对行使用换行。

在dartpad上检查UI输出。

ListTile(
      title: const Text('Test'),
      trailing: Row(mainAxisSize: MainAxisSize.min, children: <Widget>[
        IconButton(onPressed: () {}, icon: const Icon(Icons.delete))
      ]),
      subtitle: Row(children: const [
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(5),
          child: Text(
            'This is a test & this will have a very long paragragh to check the errors once. This is a test & this will have a very long paragragh to check the errors once.',
          ),
        ))
      ]),
    );

展开后的UI输出：

​

​

未展开的UI输出：

​

​

Answer 2

SizedBox(
  width : MediaQuery.of(context).size.width,
  child:  Row(children: [
                (widget.condiments!=null)?Padding(
             child:Text(condimentList,style: TextStyle(color:Colors.grey)),
               padding: EdgeInsets.only(top: 10)),
           ]),
):null;