首页 > 解决方案 > 如何解决文本溢出

问题描述

我正在尝试从数据库中检索数据..有问题的包含 128 个字,这显示我溢出了 533 pl...我该如何解决..下面是我的代码

#

文字代码

Padding(
                        padding: EdgeInsets.only(top: 2.0,),
                        child:Text(questonnd.question,textAlign: TextAlign.justify,overflow: TextOverflow.fade, style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Colors.blueGrey,),),
                      ),

我的完整代码

new GestureDetector(
      child: new Card(
        elevation: 2.0,
        margin: const EdgeInsets.all(5.0),
        child:
        new Stack(
          alignment: Alignment.center,
          children: <Widget>[
            new Align(
              child: new Row(
                children: <Widget>[
                  Column(
                    children: <Widget>[
                      Text(questonnd.rate.toString()),
                      Stack(
                        children: <Widget>[
                          Padding(padding: EdgeInsets.all(6.0),
                            child:  new Container(
                              child: Center(
                                child: Text("${questonnd.comment}"),
                              ),
                              width: 20.0,
                              height: 20.0,
                              decoration: new BoxDecoration(
                                shape: BoxShape.circle,
                                image: new DecorationImage(
                                    fit: BoxFit.fill,
                                    image: new AssetImage("assets/comment.png")),
                              ),
                              margin: const EdgeInsets.symmetric(
                                  horizontal: 20.0),
                            ),)
//
                        ],
                      ),
                    ],
                  ),

                  Column(
                    children: <Widget>[
                      Padding(
                        padding: EdgeInsets.only(top: 2.0,),
                        child:Text(questonnd.question,textAlign: TextAlign.justify,overflow: TextOverflow.fade, style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Colors.blueGrey,),),
                      ),
                      Row(
                        children: <Widget>[
                          questonnd.releventTag!=null?new Container(
                            decoration: new BoxDecoration(
                                color: Colors.greenAccent,
                                shape: BoxShape.rectangle,
                                borderRadius: BorderRadius.circular(6.0)
                            ),
                            margin: const EdgeInsets.symmetric(
                                horizontal: 20.0),
                            child: Padding(padding: EdgeInsets.all(3.0),
                              child: Text(questonnd.releventTag,style: TextStyle(color: Colors.white),),),
                          ):questonnd.releventTag2!=null?new Container(
                            decoration: new BoxDecoration(
                                color: Colors.black54,
                                shape: BoxShape.rectangle,
                                borderRadius: BorderRadius.circular(2.0)
                            ),
                            margin: const EdgeInsets.symmetric(
                                horizontal: 20.0),
                            child: Padding(padding: EdgeInsets.all(3.0),
                              child: Text(questonnd.releventTag2,style: TextStyle(color: Colors.white),),),
                          ):questonnd.releventTag3!=null?new Container(
                            decoration: new BoxDecoration(
                                color: Colors.black54,
                                shape: BoxShape.rectangle,
                                borderRadius: BorderRadius.circular(2.0)
                            ),
                            margin: const EdgeInsets.symmetric(
                                horizontal: 20.0),
                            child: Padding(padding: EdgeInsets.all(3.0),
                              child: Text(questonnd.releventTag3,style: TextStyle(color: Colors.white),),),
                          ):new Container(),
                          questonnd.releventTag4!=null?Row(
                            children: <Widget>[
                              Icon(Icons.message),
                              Text(questonnd.releventTag4.toString())
                            ],
                          ):new Container()

                        ],
                      ),
                      questonnd.releventTag5!=null?Padding(padding: EdgeInsets.all(2.0),
                        child: Row(
                          children: <Widget>[
                            Icon(Icons.remove_red_eye),
                            Text(questonnd.releventTag5.toString())
                          ],
                        ),):new Container()


                    ],
                  )
                ],
              ),
              alignment: Alignment.bottomCenter,
            ),
          ],
        ),
      ),
      onTap: () {
        Navigator.of(context).push(new MaterialPageRoute(builder: (context)=>new Fullscreenquestion(questionNd: questonnd,)));
      },
    );
  }
} 

标签: flutterflutter-layout

解决方案


您应该尝试将您的孩子包裹成Container一个固定宽度的。它在这里发生在我身上:Flutter-wrapping text,虽然它需要一些解决方法来以独立于平台的方式设置宽度,但它也可以工作。


推荐阅读