如何使用 flutter 文本小部件进行文本换行？

Question

我有一个RenderFlex overflowed by 72 pixels on the right issue

当用户的文本很长时，由第一个 Text() 小部件引起。我什至尝试使用 Textoverflow，但这也没有做任何事情。

所以我尝试按照这里的建议用 Flexible 包装它但是它不起作用。知道我做错了什么吗？

Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                widget.p.description,
                style: TextStyle(
                  fontWeight: FontWeight.w800,
                ),
                overflow: TextOverflow.ellipsis,
              ),
              SizedBox(height: 4.0),
              Row(
                children: [
                  Text(
                    timeago.format(widget.p.timestamp.toDate()),
                    style: TextStyle(),
                  ),
                  SizedBox(width: 3.0),
                  StreamBuilder(
                    stream: lRef
                        .where('pId', isEqualTo: widget.p.pId)
                        .snapshots(),
                    builder:
                        (context, AsyncSnapshot<QuerySnapshot> snapshot) {
                      if (snapshot.hasData) {
                        QuerySnapshot snap = snapshot.data;
                        List<DocumentSnapshot> docs = snap.docs;
                        return buildCount(context, docs?.length ?? 0);
                      } else {
                        return buildCount1(context, 0);
                      }
                    },
                  ),
                ],
              ),
            ],
          ),

Answer 1

您必须将文本包装到 SizedBox 中，然后您还可以通过编辑文本小部件的 maxLines 属性来设置多行：

示例：

SizedBox(
    //You can define in as your screen's size width,
    //or you can choose a double 
    //ex:
    //width: 100,
    width: MediaQuery.of(context).size.width, //this is the total width of your screen
    child: Text(
      widget.p.description,
      style: TextStyle(
        fontWeight: FontWeight.w800,
      ),
      overflow: TextOverflow.ellipsis,
    ),
  );

您还可以定义文本的行数，如下所示：

SizedBox(
    //You can define in as your screen's size width,
    //or you can choose a double 
    //ex:
    //width: 100,
    width: MediaQuery.of(context).size.width, //this is the total width of your screen
    child: Text(
      widget.p.description,
      maxLines: 5,
      style: TextStyle(
        fontWeight: FontWeight.w800,
      ),
      overflow: TextOverflow.ellipsis,
    ),
  );

如何使用 flutter 文本小部件进行文本换行？

How do I text wrap with flutter text widget?

word-wrap

flutter