Flutter货币格式化插件currency_formatter的使用

发布于 1周前 作者 phonegap100 来自 Flutter

Flutter货币格式化插件currency_formatter的使用

currency_formatter 是一个用于轻松格式化货币的Flutter包。它支持设置自定义货币符号和格式,使用内置的一些主要货币格式或使用系统默认格式。

格式化货币

要设置 double 类型的数据如何被格式化,可以通过创建 CurrencyFormat 对象来实现:

CurrencyFormat euroSettings = CurrencyFormat(
  code: 'eur',
  symbol: '€',
  symbolSide: SymbolSide.left,
  thousandSeparator: '.',
  decimalSeparator: ',',
  symbolSeparator: ' ',
);

其中,symbolSide 可以设置为 SymbolSide.leftSymbolSide.rightSymbolSide.nonethousandSeparatordecimalSeparator 默认值分别为 '.'',',会根据 symbolSide 自动调整。

num 类型数据进行格式化,可以使用 CurrencyFormatter.format() 方法:

num amount = 1910.9347;
String formatted = CurrencyFormatter.format(amount, euroSettings); // 1.910,93 €
String compact = CurrencyFormatter.format(amount, euroSettings, compact: true); // 1,91K €
String threeDecimal = CurrencyFormatter.format(amount, euroSettings, decimal: 3); // 1.910,945 €

解析格式化的货币

要从格式化的字符串中解析出数值,可以使用 CurrencyFormatter.parse() 方法:

num parseFormatted = CurrencyFormatter.parse(formatted, euroSettings); // 1910.93
num parseCompact = CurrencyFormatter.parse(compact, euroSettings); // 1910.0
num parseThreeDecimal = CurrencyFormatter.parse(threeDecimal, euroSettings); // 1910.935

预定义的 CurrencyFormat

该包还预定义了许多货币格式,它们列在 CurrencyFormatter.majorsList 列表中,并作为 CurrencyFormat 类的静态常量定义。

String inUSD = CurrencyFormatter.format(amount, CurrencyFormat.usd); // $ 1,910.93
String inRUB = CurrencyFormatter.format(amount, CurrencyFormatter.fromCode('rub')!); // 1.910,93 ₽
String jpySymbol = CurrencyFormatter.jpy.symbol; // ¥

获取本地 CurrencyFormat

在Flutter中,可以根据设备语言获取默认的 CurrencyFormat

String inSystemCurrency = CurrencyFormatter.format(amount, CurrencyFormat.local ?? CurrencyFormat.usd);

如果你想根据特定的语言环境获取 CurrencyFormat,可以使用 CurrencyFormat.fromLocale() 方法:

String inLocaleCurrency = CurrencyFormatter.format(amount, CurrencyFormat.fromLocale('en_US')!);

通过符号或代码获取 CurrencyFormat

你可以通过货币符号(如果它存在于 CurrencyFormatter.majors 中)使用 CurrencyFormat.fromSymbol() 方法获取 CurrencyFormat

String fromSymbol = CurrencyFormatter.format(amount, CurrencyFormat.fromSymbol('£')!); // £ 1,910.35
String fromCode = CurrencyFormatter.format(amount, CurrencyFormat.fromCode('gbp')!); // £ 1,910.35

使用自定义货币

假设你想无缝地使用以下自定义货币:

CurrencyFormat khr = CurrencyFormat(
  symbol: '៛',
  symbolSide: SymbolSide.right,
);

你可以创建自己的主列表:

const List<CurrencyFormat> myCurrencies = [
  ...CurrencyFormatter.majorsList,
  khr,
];

然后使用它来根据符号或代码获取对应的货币,或者获取本地货币:

CurrencyFormat.fromSymbol('៛', myCurrencies); // khr
CurrencyFormat.fromCode('khr', myCurrencies); // khr

// 自定义本地货币
CurrencyFormat? localCurrency() =>
    CurrencyFormat.fromSymbol(CurrencyFormat.localSymbol, myCurrencies);
// 或者
CurrencyFormat? localCurrency() =>
    CurrencyFormat.fromLocale(null, myCurrencies);

示例代码

以下是完整的示例代码:

import 'package:currency_formatter/currency_formatter.dart';

void main() {
  const CurrencyFormat euroSettings = CurrencyFormat(
    // 欧元格式化设置
    code: 'eur',
    symbol: '€',
    symbolSide: SymbolSide.right,
    thousandSeparator: '.',
    decimalSeparator: ',',
    symbolSeparator: ' ',
  );

  num amount = 1910.9347;

  String formatted =
      CurrencyFormatter.format(amount, euroSettings); // 1.910,93 €
  String compact =
      CurrencyFormatter.format(amount, euroSettings, compact: true); // 1,91K €
  String threeDecimal =
      CurrencyFormatter.format(amount, euroSettings, decimal: 3); // 1.910,935 €

  num parseFormatted =
      CurrencyFormatter.parse(formatted, euroSettings); // 1910.93
  num parseCompact = CurrencyFormatter.parse(compact, euroSettings); // 1910.0
  num parseThreeDecimal =
      CurrencyFormatter.parse(threeDecimal, euroSettings); // 1910.935

  String inUSD =
      CurrencyFormatter.format(amount, CurrencyFormat.usd); // $ 1,910.93
  String inRUB = CurrencyFormatter.format(
      amount, CurrencyFormat.fromCode('rub')!); // 1.910,93 ₽

  String jpySymbol = CurrencyFormat.jpy.symbol; // ¥
  String usdSymbol = CurrencyFormat.fromCode('usd')!.symbol; // $

  String inSystemCurrency = CurrencyFormatter.format(
      amount, CurrencyFormat.local ?? CurrencyFormat.usd);

  String fromSymbol = CurrencyFormatter.format(
      amount, CurrencyFormat.fromSymbol('£')!); // £ 1,910.35

  CurrencyFormat noSpaceSettings =
      CurrencyFormat.usd.copyWith(symbolSeparator: '');
  String noSpace =
      CurrencyFormatter.format(amount, noSpaceSettings); // $1,910.93

  int intAmount = 3;
  String noDecimal = CurrencyFormatter.format(intAmount, euroSettings); // 3 €

  String enforceDecimal = CurrencyFormatter.format(
    intAmount,
    euroSettings,
    enforceDecimals: true,
  ); // 3,00 €

  CurrencyFormat noSymbolFormat =
      euroSettings.copyWith(symbol: '', symbolSeparator: '');
  String noSymbol =
      CurrencyFormatter.format(amount, noSymbolFormat); // 1.910,93

  const CurrencyFormat khr = CurrencyFormat(
    code: 'khr',
    symbol: '៛',
    symbolSide: SymbolSide.right,
  );

  const List<CurrencyFormat> myCurrencies = [
    ...CurrencyFormatter.majorsList,
    khr,
  ];

  CurrencyFormat.fromSymbol('៛'); // null
  CurrencyFormat.fromSymbol('៛', myCurrencies); // khr

  CurrencyFormat? localCurrency() =>
      CurrencyFormat.fromSymbol(CurrencyFormat.localSymbol, myCurrencies);
}

通过上述内容,你可以了解如何在Flutter项目中使用 currency_formatter 插件来格式化和解析货币。希望这对你有所帮助!


更多关于Flutter货币格式化插件currency_formatter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter货币格式化插件currency_formatter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,下面是一个关于如何在Flutter中使用currency_formatter插件进行货币格式化的代码示例。这个插件可以帮助你轻松地将数字格式化为特定货币的字符串表示。

首先,确保你已经将currency_formatter插件添加到了你的pubspec.yaml文件中:

dependencies:
  flutter:
    sdk: flutter
  currency_formatter: ^2.0.0  # 请检查最新版本号

然后,运行flutter pub get来安装插件。

接下来是一个完整的Flutter应用示例,展示如何使用currency_formatter插件:

import 'package:flutter/material.dart';
import 'package:currency_formatter/currency_formatter.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Currency Formatter Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final TextEditingController _controller = TextEditingController();
  final CurrencyFormatter _currencyFormatter = CurrencyFormatter(
    locale: 'en_US',  // 设置地区,例如 'en_US' 或 'zh_CN'
    symbol: '$',      // 设置货币符号
    decimalPlaces: 2, // 设置小数点后的位数
    groupSeparator: ',', // 千位分隔符
    decimalSeparator: '.', // 小数点分隔符
    symbolOnLeft: true, // 货币符号是否在数字左侧
    formatAsBigNumber: false, // 是否以大写形式显示(例如:USD 1,000.00)
  );

  void _onFormattedButtonPressed() {
    final double amount = double.tryParse(_controller.text) ?? 0.0;
    final String formattedAmount = _currencyFormatter.format(amount);
    ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
        content: Text('Formatted Amount: $formattedAmount'),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Currency Formatter Example'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            TextField(
              controller: _controller,
              decoration: InputDecoration(
                labelText: 'Enter amount',
              ),
              keyboardType: TextInputType.numberWithOptions(decimal: true),
            ),
            SizedBox(height: 16.0),
            ElevatedButton(
              onPressed: _onFormattedButtonPressed,
              child: Text('Format Amount'),
            ),
          ],
        ),
      ),
    );
  }
}

在这个示例中:

  1. 我们首先创建了一个CurrencyFormatter实例,并配置了一些基本选项,如地区、货币符号、小数点位数、千位分隔符等。
  2. 然后,我们创建了一个简单的UI,包括一个TextField用于输入金额,以及一个ElevatedButton用于触发格式化操作。
  3. 当用户点击按钮时,我们尝试将输入框中的文本解析为double类型的金额,并使用_currencyFormatter.format方法将其格式化为货币字符串,最后通过SnackBar显示格式化后的金额。

这个示例展示了如何使用currency_formatter插件来格式化货币金额,你可以根据自己的需求调整配置和UI。

回到顶部