如何在Text Widget Flutter中使用换行符

时间:2019-09-18 12:32:33

标签: flutter

如何在Flutter中显示多行文本?

Text("Text1\n Text2\n Text3",maxLines: 20, style: TextStyle(fontSize: 16.0 ,fontWeight:FontWeight.bold,color: Colors.black) , )

5 个答案:

答案 0 :(得分:3)

对我来说,当从本地 sqlite 数据库获取文本中带有 '\n' 的数据时,这有效:

    var response = await db.getDataFromDB();
    return Text(message.replaceAll('\\n', '\n'))

答案 1 :(得分:2)

您可以使用三引号

参考链接https://api.dartlang.org/stable/2.5.0/dart-core/String-class.html

      child: Container(
         child :  Text('''
                          Text1
                          Text2
                          Text3''',maxLines: 20, style: TextStyle(fontSize: 16.0 ,fontWeight:FontWeight.bold,color: Colors.black) , )
      ),

方法2动态字符串:

        var readLines = ['Test1', 'Test2', 'Test3'];
        String getNewLineString() {
           StringBuffer sb = new StringBuffer();
           for (String line in readLines) {
              sb.write(line + "\n");
           }
           return sb.toString();
        }


        child: Container(
           child: Text(
          getNewLineString(),
          maxLines: 20,
          style: TextStyle(
              fontSize: 16.0,
              fontWeight: FontWeight.bold,
              color: Colors.black),
        )),

答案 2 :(得分:2)

只需使用此

Text('${userInfo.name}'
                        '\n${userInfo.email}'
                        '\n${userInfo.mobilenumber}',maxLines: 20, style: TextStyle(fontSize: 16.0 ,fontWeight:FontWeight.bold,color: Colors.black) , )

答案 3 :(得分:1)

如果要用Flutter外部的字符串换行,则应在flutter内部修改该字符串。

因此,如果您从API获得字符串'已收到订单! \ n在排队等候!并且中断线不起作用,在颤动中,您应该替换颤动中的'\ n'

var response = await getMessageFromServer();
String message = getMessage(response);
return Text(message.replaceAll('\n', '\n'))

这样,您将看到'\ n'的颜色在颤动中是如何变化的。

我更喜欢对API使用'/ n',然后在混乱的情况下替换。all('/ n','\ n')

答案 4 :(得分:0)

我发现的另一种选择是使用 RichText 小部件,如下所示:

RichText(
  text: TextSpan(
    text: 'A line with a newline character\n',
    children: [
      TextSpan(
        text: 'A second line',
      ),
    ],
  ),
),