Flutter货币转换插件currency_converter_pro的使用
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),
),
],
),
);
}
}
如何工作
- 货币和加密货币下拉菜单:用户可以通过下拉菜单选择源货币和目标货币或加密货币。
- 金额输入:用户可以输入要转换的金额。
- 转换按钮:点击“转换货币”后,应用会获取汇率并显示转换后的金额。
支持的货币和加密货币
该应用支持多种常见货币和加密货币,包括但不限于美元、欧元、日元、比特币、以太坊等。
贡献和支持
欢迎对 Currency Converter Pro
进行贡献,您可以通过提交问题或拉取请求来增强此插件。
许可证
Currency Converter Pro
使用 MIT 许可证发布。您可以自由使用、修改和分发此软件,但需遵守相关条件和免责声明。
更多关于Flutter货币转换插件currency_converter_pro的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于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
插件:
- 导入包:
import 'package:flutter/material.dart';
import 'package:currency_converter_pro/currency_converter_pro.dart';
- 初始化转换器:
在你的应用中,你需要初始化一个CurrencyConverterPro
实例。通常,你可以在应用的顶层(如MyApp
类)中完成这个初始化。
void main() {
WidgetsFlutterBinding.ensureInitialized();
CurrencyConverterPro.initialize(apiKey: '你的API_KEY'); // 替换为你的API_KEY
runApp(MyApp());
}
注意:你需要从currency_converter_pro
的服务提供商那里获取一个API_KEY。
- 使用转换器:
现在你可以在你的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,否则转换请求将会失败。
希望这个示例对你有所帮助!