Flutter货币转换插件currency_converter_pro的使用

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

Flutter货币转换插件currency_converter_pro的使用

currency_converter_pro 是一个简单且用户友好的Flutter应用插件,允许用户在不同货币和加密货币之间进行转换。它提供了实时汇率数据,并支持异步操作以确保流畅的用户体验。

特性

  • 多货币和加密货币支持:在一个API调用中无缝转换法定货币和加密货币。
  • 多货币支持:支持多种货币如USD, INR, EUR, GBP等。
  • 易于集成:简单的API用于将货币转换功能集成到Flutter应用中。
  • 异步操作:非阻塞方式进行货币转换。
  • 加密货币转换:支持比特币、以太坊等多种加密货币。
  • 实时汇率:提供实时数据以确保准确的货币转换。
  • 用户友好API:简单直观的API设计,便于集成。
  • 示例应用:包含完整的示例应用展示如何实现货币转换功能。

开始使用

1. 添加依赖

pubspec.yaml 文件中添加以下依赖:

dependencies:
  currency_converter_pro: ^0.0.7

2. 安装依赖

在终端运行以下命令安装依赖:

flutter pub get

然后导入包:

import 'package:currency_converter_pro/currency_converter_pro.dart';

3. 货币转换使用示例

货币转换

final _currencyConverterProPlugin = CurrencyConverterPro();
final result = await _currencyConverterProPlugin.convertCurrency(
  amount: 1.0,
  fromCurrency: 'usd',
  toCurrency: 'inr',
);

加密货币转换

final _currencyConverterProPlugin = CurrencyConverterPro();
final result = await _currencyConverterProPlugin.convertCrypto(
  amount: 1.0,
  fromCurrency: 'bitcoin',
  toCurrency: 'ethereum',
);

完整代码示例

以下是一个完整的示例应用,展示了如何使用 currency_converter_pro 插件进行货币和加密货币转换:

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:currency_converter_pro/currency_converter_pro.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: ConverterTabs(),
    );
  }
}

class ConverterTabs extends StatelessWidget {
  const ConverterTabs({super.key});

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Scaffold(
        appBar: AppBar(
          title: const Text('Currency and Crypto Converter'),
          bottom: const TabBar(
            tabs: [
              Tab(text: 'Currency'),
              Tab(text: 'Crypto'),
            ],
          ),
        ),
        body: const TabBarView(
          children: [
            CurrencyConverterScreen(),
            CryptoConverterScreen(),
          ],
        ),
      ),
    );
  }
}

class CurrencyConverterScreen extends StatefulWidget {
  const CurrencyConverterScreen({super.key});

  @override
  State<CurrencyConverterScreen> createState() => _CurrencyConverterScreenState();
}

class _CurrencyConverterScreenState extends State<CurrencyConverterScreen> {
  final TextEditingController _amountController = TextEditingController();
  String _convertedAmount = '';
  String _fromCurrency = 'usd';
  String _toCurrency = 'inr';
  final List<String> _currencies = ['usd', 'inr', 'eur', 'gbp', 'jpy', 'aud', 'cad'];

  Future<void> _convertCurrency() async {
    final double amount = double.tryParse(_amountController.text) ?? 0;
    try {
      final _currencyConverterProPlugin = CurrencyConverterPro();
      final result = await _currencyConverterProPlugin.convertCurrency(
        amount: amount,
        fromCurrency: _fromCurrency,
        toCurrency: _toCurrency,
      );
      setState(() {
        _convertedAmount = result.toStringAsFixed(2);
      });
    } catch (e) {
      setState(() {
        _convertedAmount = 'Error: $e';
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          const Text(
            'Currency Converter',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, color: Colors.blue),
            textAlign: TextAlign.center,
          ),
          const SizedBox(height: 20),
          Row(
            children: [
              Expanded(
                child: DropdownButtonFormField<String>(
                  value: _fromCurrency,
                  items: _currencies.map((String currency) {
                    return DropdownMenuItem<String>(
                      value: currency,
                      child: Text(currency.toUpperCase()),
                    );
                  }).toList(),
                  onChanged: (value) {
                    setState(() {
                      _fromCurrency = value ?? 'usd';
                    });
                  },
                  decoration: const InputDecoration(
                    labelText: 'From Currency',
                    border: OutlineInputBorder(),
                  ),
                ),
              ),
              const SizedBox(width: 10),
              const Icon(Icons.swap_horiz, size: 30, color: Colors.blue),
              const SizedBox(width: 10),
              Expanded(
                child: DropdownButtonFormField<String>(
                  value: _toCurrency,
                  items: _currencies.map((String currency) {
                    return DropdownMenuItem<String>(
                      value: currency,
                      child: Text(currency.toUpperCase()),
                    );
                  }).toList(),
                  onChanged: (value) {
                    setState(() {
                      _toCurrency = value ?? 'inr';
                    });
                  },
                  decoration: const InputDecoration(
                    labelText: 'To Currency',
                    border: OutlineInputBorder(),
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(height: 20),
          TextField(
            controller: _amountController,
            keyboardType: TextInputType.number,
            decoration: const InputDecoration(
              labelText: 'Enter Amount',
              border: OutlineInputBorder(),
              prefixIcon: Icon(Icons.confirmation_number, color: Colors.blue),
            ),
          ),
          const SizedBox(height: 20),
          ElevatedButton(
            onPressed: _convertCurrency,
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.blue,
              padding: const EdgeInsets.symmetric(vertical: 16.0),
            ),
            child: const Text(
              'Convert Currency',
              style: TextStyle(fontSize: 18, color: Colors.white),
            ),
          ),
          const SizedBox(height: 20),
          Text(
            _convertedAmount.isEmpty
                ? 'Converted Amount will appear here'
                : 'Converted Amount: $_convertedAmount $_toCurrency',
            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Colors.blue),
            textAlign: TextAlign.center,
          ),
        ],
      ),
    );
  }
}

class CryptoConverterScreen extends StatefulWidget {
  const CryptoConverterScreen({super.key});

  @override
  _CryptoConverterScreenState createState() => _CryptoConverterScreenState();
}

class _CryptoConverterScreenState extends State<CryptoConverterScreen> {
  final _currencyConverterProPlugin = CurrencyConverterPro();
  double amount = 1.0;
  double convertedAmount = 0.0;
  String fromCrypto = 'bitcoin';
  String toCrypto = 'ethereum';

  final List<String> cryptoList = [
    'bitcoin',
    'ethereum',
    'litecoin',
    'ripple',
    'cardano',
    'dogecoin',
  ];

  Future<void> convert() async {
    convertedAmount = await _currencyConverterProPlugin.convertCrypto(fromCrypto, toCrypto, amount);
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        children: [
          const Text(
            'Crypto Currency Converter',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, color: Colors.blue),
            textAlign: TextAlign.center,
          ),
          const SizedBox(height: 20),
          Row(
            children: [
              Expanded(
                child: DropdownButtonFormField<String>(
                  value: fromCrypto,
                  items: cryptoList.map((String crypto) {
                    return DropdownMenuItem<String>(
                      value: crypto,
                      child: Text(crypto.toUpperCase()),
                    );
                  }).toList(),
                  onChanged: (value) {
                    setState(() {
                      fromCrypto = value ?? 'bitcoin';
                    });
                  },
                  decoration: const InputDecoration(
                    labelText: 'From Crypto',
                    border: OutlineInputBorder(),
                  ),
                ),
              ),
              const SizedBox(width: 10),
              const Icon(Icons.swap_horiz, size: 30, color: Colors.blue),
              const SizedBox(width: 10),
              Expanded(
                child: DropdownButtonFormField<String>(
                  value: toCrypto,
                  items: cryptoList.map((String crypto) {
                    return DropdownMenuItem<String>(
                      value: crypto,
                      child: Text(crypto.toUpperCase()),
                    );
                  }).toList(),
                  onChanged: (value) {
                    setState(() {
                      toCrypto = value ?? 'ethereum';
                    });
                  },
                  decoration: const InputDecoration(
                    labelText: 'To Crypto',
                    border: OutlineInputBorder(),
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(height: 20),
          TextField(
            decoration: const InputDecoration(
              labelText: 'Enter Amount',
              border: OutlineInputBorder(),
              prefixIcon: Icon(Icons.confirmation_number, color: Colors.blue),
            ),
            keyboardType: TextInputType.number,
            onChanged: (value) {
              amount = double.tryParse(value) ?? 0.0;
            },
          ),
          const SizedBox(height: 20),
          SizedBox(
            width: MediaQuery.of(context).size.width,
            child: ElevatedButton(
              onPressed: convert,
              style: ElevatedButton.styleFrom(
                backgroundColor: Colors.blue,
                padding: const EdgeInsets.symmetric(vertical: 16.0),
              ),
              child: const Text(
                'Cypto Convert Currency',
                style: TextStyle(fontSize: 18, color: Colors.white),
              ),
            ),
          ),
          const SizedBox(height: 20),
          Text(
            'Equivalent: ${convertedAmount.toStringAsFixed(6)} $toCrypto',
            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Colors.blue),
          ),
        ],
      ),
    );
  }
}

如何工作

  1. 货币和加密货币下拉菜单:用户可以通过下拉菜单选择源货币和目标货币或加密货币。
  2. 金额输入:用户可以输入要转换的金额。
  3. 转换按钮:点击“转换货币”后,应用会获取汇率并显示转换后的金额。

支持的货币和加密货币

该应用支持多种常见货币和加密货币,包括但不限于美元、欧元、日元、比特币、以太坊等。

贡献和支持

欢迎对 Currency Converter Pro 进行贡献,您可以通过提交问题或拉取请求来增强此插件。

许可证

Currency Converter Pro 使用 MIT 许可证发布。您可以自由使用、修改和分发此软件,但需遵守相关条件和免责声明。


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

1 回复

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


当然,下面是一个关于如何使用Flutter的currency_converter_pro插件来进行货币转换的代码示例。这个插件允许你从一种货币转换到另一种货币,并获取实时的汇率信息。

首先,确保你的Flutter项目已经添加了currency_converter_pro依赖。在你的pubspec.yaml文件中添加以下依赖:

dependencies:
  flutter:
    sdk: flutter
  currency_converter_pro: ^最新版本号 # 请替换为实际的最新版本号

然后运行flutter pub get来获取依赖。

接下来,在你的Flutter应用中,你可以按照以下步骤使用currency_converter_pro插件:

  1. 导入包
import 'package:flutter/material.dart';
import 'package:currency_converter_pro/currency_converter_pro.dart';
  1. 初始化转换器

在你的应用中,你需要初始化一个CurrencyConverterPro实例。通常,你可以在应用的顶层(如MyApp类)中完成这个初始化。

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  CurrencyConverterPro.initialize(apiKey: '你的API_KEY'); // 替换为你的API_KEY
  runApp(MyApp());
}

注意:你需要从currency_converter_pro的服务提供商那里获取一个API_KEY。

  1. 使用转换器

现在你可以在你的UI组件中使用这个转换器了。下面是一个简单的例子,展示如何转换货币:

class CurrencyConversionScreen extends StatefulWidget {
  @override
  _CurrencyConversionScreenState createState() => _CurrencyConversionScreenState();
}

class _CurrencyConversionScreenState extends State<CurrencyConversionScreen> {
  String fromCurrency = 'USD';
  String toCurrency = 'EUR';
  double amount = 1.0;
  String convertedAmount = '';

  Future<void> convertCurrency() async {
    try {
      double result = await CurrencyConverterPro.convert(
        from: fromCurrency,
        to: toCurrency,
        amount: amount,
      );
      setState(() {
        convertedAmount = result.toStringAsFixed(2);
      });
    } catch (e) {
      print('Error converting currency: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Currency Converter'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextField(
              decoration: InputDecoration(labelText: 'Amount'),
              keyboardType: TextInputType.numberWithOptions,
              onChanged: (value) {
                setState(() {
                  amount = double.tryParse(value) ?? 1.0;
                });
              },
            ),
            SizedBox(height: 16),
            DropdownButtonFormField<String>(
              value: fromCurrency,
              hint: Text('From Currency'),
              onChanged: (value) {
                setState(() {
                  fromCurrency = value!;
                });
              },
              items: [
                'USD', 'EUR', 'JPY', 'GBP', // 添加更多货币代码
              ].map<DropdownMenuItem<String>>((String value) {
                return DropdownMenuItem<String>(
                  value: value,
                  child: Text(value),
                );
              }).toList(),
            ),
            SizedBox(height: 16),
            DropdownButtonFormField<String>(
              value: toCurrency,
              hint: Text('To Currency'),
              onChanged: (value) {
                setState(() {
                  toCurrency = value!;
                });
              },
              items: [
                'USD', 'EUR', 'JPY', 'GBP', // 添加更多货币代码
              ].map<DropdownMenuItem<String>>((String value) {
                return DropdownMenuItem<String>(
                  value: value,
                  child: Text(value),
                );
              }).toList(),
            ),
            SizedBox(height: 16),
            ElevatedButton(
              onPressed: convertCurrency,
              child: Text('Convert'),
            ),
            SizedBox(height: 16),
            Text('Converted Amount: $convertedAmount'),
          ],
        ),
      ),
    );
  }
}

在这个例子中,我们创建了一个简单的UI,用户可以输入金额,选择源货币和目标货币,然后点击“Convert”按钮进行转换。转换结果会显示在下方的文本字段中。

确保你已经在CurrencyConverterPro.initialize中提供了有效的API_KEY,否则转换请求将会失败。

希望这个示例对你有所帮助!

回到顶部