如何在Text Widget Flutter中使用新行字符

hkmswyz6  于 2023-10-22  发布在  Flutter
关注(0)|答案(7)|浏览(149)

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

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

8nuwlpux1#

方法1使用三重引号

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

方法2使用**\n**这里是动态字符串的示例:

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),
        )),

方法3使用静态文本,\n

Text('Welcome\nto\nMyWorld\nHello\nWorld\n');

有关更多信息,请参阅此链接https://api.dartlang.org/stable/2.5.0/dart-core/String-class.html

siotufzp

siotufzp2#

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

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

eanckbw93#

如果你想用一个来自Flutter外部的字符串来断线,你应该修改Flutter内部的字符串。
所以如果你从API得到一个字符串“订单已收到!\n排队等候!'和断线不工作,在Flutter你应该更换'\n'内Flutter

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

这样,您将看到'\n'的颜色在flutter中有何不同。
我更喜欢使用“/n”作为API,然后在flutter中替换.all(“/n”,“\n”)

pu82cl6c

pu82cl6c4#

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

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

ipakzgxi5#

只是用这个

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

mfuanj7w6#

您可以在Text()小部件中编写多行文本,只需用单独的引号(““)将每行文本括起来。像这样,看截图。

n7taea2i

n7taea2i7#

“\n”和“\n”的行为不同。注意“和”之间的区别很重要

相关问题