如何修复文本小部件溢出问题以在下一行显示溢出的文本？答案

【问题标题】：How to fix Text widget overflow issue to show the overflowed text in next line?如何修复文本小部件溢出问题以在下一行显示溢出的文本？
【发布时间】：2018-07-14 11:01:56
【问题描述】：

我的标题文本小部件溢出并隐藏了我的价格文本小部件，我希望这两个文本小部件在同一行中，当标题包含最大字符数时，我想在下一行显示它，我该如何解决它。我正在附加溢出文本的图像。

这是我的代码：

 new Column(
                children: <Widget>[
                  new Column(

                    children: <Widget>[
                      new Column(
                        children: <Widget>[
                          new Padding(padding: const EdgeInsets.only(top: 5.0)),
                          new Row(
                            mainAxisAlignment:  MainAxisAlignment.spaceBetween,
                            children: <Widget>[

                              new Column(
                                children: <Widget>[
                                  new Text(productList[index].name,

                                    style: new TextStyle(color: Colors.black,
                                        fontSize: 18.0, fontWeight: FontWeight.bold),
                                  )

                                ],
                              ),


                              new Text("€"+productList[index].price.toString(),
                                style: new TextStyle(color: Colors.black,
                                    fontSize: 18.0, fontWeight: FontWeight.bold
                                ),),

                            ],
                          )


                        ],
                      ),

                      new Row(
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: <Widget>[
                          new Flexible(
                              child: new Column(
                                crossAxisAlignment: CrossAxisAlignment.start ,
                                children: <Widget>[

                                  new Text(

                                    productList[index].description,
                                    overflow:  TextOverflow.fade ,),
                                ],
                              ))
                        ],
                      ),

                      new Row(
                        mainAxisAlignment: MainAxisAlignment.end,
                        children: <Widget>[
                         new  ListTileItemAddRemove(productList[index]),


                          new Padding(padding: EdgeInsets.only(bottom: 10.0))
                        ],
                      )


                    ],
                  ),
                  new Divider(color: Colors.black,)
                ],
              ),

【问题讨论】：

标签： dart flutter flutter-layout

【解决方案1】：

这是我解决此问题的方法：

return new Container(

                      child: new Column(
                        children: <Widget>[
                          new Container(
                            margin: EdgeInsets.all(10.0),


                            child: new Column(

                              children: <Widget>[
                                new Column(
                                  children: <Widget>[
                                    new Padding(padding: const EdgeInsets.only(top: 5.0)),
                                    new Row(
                                      mainAxisAlignment:  MainAxisAlignment.spaceBetween,
                                      children: <Widget>[

                                        new Container(
                                          alignment: FractionalOffset.topLeft ,
                                          width: 250.0,
                                          child: new Column(
                                            mainAxisAlignment: MainAxisAlignment.start,
                                            children: <Widget>[
                                              new Text(productList[index].name,

                                                style: new TextStyle(color: Colors.black,
                                                    fontSize: 18.0, fontWeight: FontWeight.bold),
                                              )

                                            ],
                                          ),
                                        ),


                                        new Text("£"+productList[index].price.toString(),
                                          style: new TextStyle(color: Colors.black,
                                              fontSize: 18.0, fontWeight: FontWeight.bold
                                          ),),

                                      ],
                                    )


                                  ],
                                ),

                                new Row(
                                  mainAxisAlignment: MainAxisAlignment.start,
                                  children: <Widget>[
                                    new Flexible(
                                        child: new Column(
                                          crossAxisAlignment: CrossAxisAlignment.start ,
                                          children: <Widget>[

                                            new Text(

                                              productList[index].description,
                                              overflow:  TextOverflow.fade ,),
                                          ],
                                        ))
                                  ],
                                ),

                                new Row(
                                  mainAxisAlignment: MainAxisAlignment.end,
                                  children: <Widget>[
                                    new  ListTileItemAddRemove(productList[index]),


                                    new Padding(padding: EdgeInsets.only(bottom: 10.0))
                                  ],
                                )


                              ],
                            ),
                          ),
                          new Divider(color: Colors.black,)
                        ],
                      ),

                    );

【讨论】：