我可以在<Text>中呈现数字之前对其进行格式化

Question

我<Text>在Flutter app中渲染一个节点,如:

We have total ${_summary['bookCount']} books. 

_summary通过远程API检索,并且bookCount是返回的JSON字段之一.通常超过1,000.

如果我像那样显示书数,那就很简单了1234.我想把它显示为1,234.

目前,我必须使用某些格式化程序手动修改该字段,但这很麻烦.

我正在寻找类似的东西:

We have total ${myNumberFormat(_summary['bookCount'])} books. 

语法,其中myNumberFormat是一个函数.

在我以前的PHP和Twig编程中,可以使用过滤器完成.

非常感谢您的意见.

更新

@拉朱苦

这个解决方案是我所知道的,绝对正确.我正在寻找的是内联"过滤器".

有了这个解决方案,我不喜欢的一些事情,其中​​最重要的是,我必须将我的一行文本分成几个部分: We have {XXX} books, accumulating to {YYY} pages, and {ZZZ} word counts. 这句话至少会被分成7个部分,以便每个数字文本部分可以通过a格式化formatter然后包裹在周围<Text>.

我试图看看是否有更直截了当的方法.

Answer 1

有一个用于格式化数字的Dart包,Dart intl包.要使用该包,请将以下行添加到Dart依赖项:pubspec.yamlfile:

  intl: ">=0.14.0"

以下是我的依赖项与行的相似之处:

dependencies:
  flutter:
    sdk: flutter

  intl: ">=0.14.0"

单击包获取 IntelliJ,或从命令行运行flutter packages get.

确保您的类导入intl包:

import 'package:intl/intl.dart';

在您的代码中,您可以使用NumberFormat类进行格式化:

  final formatter = new NumberFormat("#,###");
  new Text(formatter.format(1234)), // formatted number will be: 1,234

完整的有状态小部件示例:

class NumberFormatExample extends StatefulWidget {
  @override
  _NumberFormatExampleState createState() => new _NumberFormatExampleState();
}

class _NumberFormatExampleState extends State<NumberFormatExample> {
  final formatter = new NumberFormat("#,###");
  int theValue = 1234;

  @override
  Widget build(BuildContext context) {
    return new Text(formatter.format(theValue));
  }
}

Answer 2

以上答案的更新：

首先将intl包添加到您的pubspec.yaml文件中，紧随其后flutter sdk（如下所示）：

    dependencies:
      flutter:
        sdk: flutter
      intl: ^0.16.0

如果你使用flutter_localizations,intl必须高于那个。

现在您可以使用NumberFormat类。

一些例子：

print(NumberFormat.currency().format(123456)); // USD123,456.00

print(NumberFormat.currency(locale: 'eu').format(123456)); // 123.456,00 EUR

print(NumberFormat.currency(name: 'EURO').format(123456)); // EURO123,456.00

print(NumberFormat.currency(locale: 'eu', symbol: '?').format(123456)); // 123.456,00 ?

print(NumberFormat.currency(locale: 'eu', decimalDigits: 3).format(123456)); // 123.456,000 EUR

print(NumberFormat.currency(locale: 'eu', customPattern: '\u00a4 #,##.#').format(123456)); // EUR 12.34.56,00

• 参考及更多信息：https : //www.woolha.com/tutorials/dart-formatting-currency-with-numberformat#supported-locales

• NumberFormat 类 Dart API：https : //api.flutter.dev/flutter/intl/NumberFormat-class.html