flutter - 如何将文本小部件长度固定为特定长度，然后应继续中断到下一行

Question

我有一个包含文本的文本小部件，文本不会溢出，但我想将其修复为特定长度然后多行。

因此，如果我将长度固定为 5，则立即超过 5 或达到 5，他应该中断到下一行

这是我的代码：

ListView.builder(
                        shrinkWrap: true,
                        itemCount: recentChats.length,
                        itemBuilder: (context, index) {
                          //final sender = recentChats[index].sender;
                          final auth = recentChats[index].sender.id;
                          final msg = recentChats[index].content;
                          //final timestamp = recentChats[index].time;
                          bool check = auth == 1 ? true : false;
                          return Padding(
                            padding: EdgeInsets.symmetric(
                              horizontal: 15,
                              vertical: 10,
                            ),
                            child: Column(
                              crossAxisAlignment: check
                                  ? CrossAxisAlignment.end
                                  : CrossAxisAlignment.start,
                              children: [
                                Container(
                                  padding: EdgeInsets.all(10),
                                  decoration: BoxDecoration(
                                    color: check ? Colors.indigo : Colors.white,
                                    borderRadius: check
                                        ? BorderRadius.only(
                                            bottomLeft: Radius.circular(30),
                                            topLeft: Radius.circular(30),
                                            topRight: Radius.circular(30),
                                          )
                                        : BorderRadius.only(
                                            bottomRight: Radius.circular(30),
                                            topLeft: Radius.circular(30),
                                            topRight: Radius.circular(30),
                                          ),
                                  ),
                                  child: Text(
                                    msg,
                                    style: GoogleFonts.raleway(
                                      textStyle: TextStyle(
                                        color:
                                            check ? Colors.white : Colors.black,
                                      ),
                                    ),
                                  ),
                                )
                              ],
                            ),
                          );
                        }),

我想要达到的目标：

我尝试使用 maxLine 但没有达到我想要的......

这就是我的代码得到的

谢谢

标签： flutterdartflutter-layout

Answer 1

尝试将您的文本包装在ConstrainedBox：

//...
child: ConstrainedBox(
        constraints: BoxConstraints(maxWidth: 50), //<-- set the max width here
        child: Text(
          msg,
          style: GoogleFonts.raleway(
            textStyle: TextStyle(
              color: check ? Colors.white : Colors.black,
            ),
          ),
        ),
      ),
//...