• Flutter调用以太坊区块链智能合约 (私链)

    该案例适用于Flutter调用以太坊solidity智能合约

    前言

    一、需要使用哪些开发工具？

    1. Remix IDE
    2. android studio
    3. ubuntu
    4. truffle

    二、操作步骤（如果出现问题看最后的总结）

    1.搭建Flutter Project

     首先打开Android studio开发工具，按照如下步骤进行新建项目

     

     然后会自动生成一个Flutter项目的demo,点击如下配置文件，该文件右上角会出现 Pub get

     然后可以运行该demo了。

    2.集成Truffle框架

       1、首先确保你的truffle已经安装，在Terminal控制台进行 truffle version

    2、接着truffle init 会生成几个文件夹

     3、在contract编写自己的智能合约并部署，注意修改truffle-config.js文件的配置

     3.Copy代码

       首先在lib文件夹下面新建如下文件夹并进行下面的dart代码复制

    1. main.dart 
      1. import 'package:flutter/material.dart';
      2. import 'package:flutter_basic_dapp/pages/home_page.dart';
      3. import 'package:flutter_dotenv/flutter_dotenv.dart';
      4.  
      5. Future main() async {
      6.   await dotenv.load(fileName: ".env");
      7.   runApp(MyApp());
      8. }
      9.  
      10. class MyApp extends StatelessWidget {
      11.   const MyApp({Key? key}) : super(key: key);
      12.  
      13.   @override
      14.   Widget build(BuildContext context) {
      15.     return MaterialApp(
      16.       debugShowCheckedModeBanner: false,
      17.       home: HomePage(),
      18.     );
      19.   }
      20. }
      21.  
      22.

    2.  ethereum_utils.dart

      1. import 'dart:convert';
      2.  
      3. import 'package:flutter/services.dart';
      4. import 'package:flutter_dotenv/flutter_dotenv.dart';
      5. import 'package:http/http.dart';
      6. import 'package:web3dart/web3dart.dart';
      7.  
      8. var apiUrl = "http://192.168.1.161:8545"; //Replace with your API  
      9. var httpClient = Client();
      10. var web3client = Web3Client(apiUrl, httpClient);
      11.  
      12. class EthereumUtils {
      13.   final contractAddress = dotenv.env['CONTRACT_ADDRESS'];
      14.  
      15.   Future getBalance() async {
      16.     final contract = await getDeployedContract();
      17.     final etherFunction = contract.function("getBalance");
      18.     final result = await web3client.call(contract: contract, function: etherFunction, params: []);
      19.     List<dynamic> res = result;
      20.     return res[0];
      21.   }
      22.  
      23.   Future<String> sendBalance(int amount) async {
      24.     var bigAmount = BigInt.from(amount);
      25.     EthPrivateKey privateKeyCred = EthPrivateKey.fromHex(dotenv.env['METAMASK_PRIVATE_KEY']!);
      26.     DeployedContract contract = await getDeployedContract();
      27.     final etherFunction = contract.function("sendBalance");
      28.     final result = await web3client.sendTransaction(
      29.         privateKeyCred,
      30.         Transaction.callContract(
      31.           contract: contract,
      32.           function: etherFunction,
      33.           parameters: [bigAmount],
      34.           maxGas: 100000,
      35.         ),chainId: 20220824,
      36.         fetchChainIdFromNetworkId: false);
      37.     return result;
      38.   }
      39.  
      40.   Future<String> withDrawBalance(int amount) async {
      41.     var bigAmount = BigInt.from(amount);
      42.     EthPrivateKey privateKeyCred = EthPrivateKey.fromHex(dotenv.env['METAMASK_PRIVATE_KEY']!);
      43.     DeployedContract contract = await getDeployedContract();
      44.     final etherFunction = contract.function("withDrawBalance");
      45.     final result = await web3client.sendTransaction(
      46.         privateKeyCred,
      47.         Transaction.callContract(
      48.           contract: contract,
      49.           function: etherFunction,
      50.           parameters: [bigAmount],
      51.           maxGas: 100000,
      52.         ),chainId: 20220824,
      53.         fetchChainIdFromNetworkId: false);
      54.     return result;
      55.  
      56.   }
      57.  
      58.   Future getDeployedContract() async {
      59.     String abiStringFile = await rootBundle.loadString("assets/artifacts/BasicDapp.json");
      60.     var jsonAbi = jsonDecode(abiStringFile);
      61.     final contract = DeployedContract(ContractAbi.fromJson(jsonEncode(jsonAbi["abi"]), "BasicDapp"), EthereumAddress.fromHex(contractAddress!));
      62.     return contract;
      63.   }
      64. }

    3.  home_page.dart

      1. import 'package:flutter/material.dart';
      2. import 'package:flutter_basic_dapp/models/ethereum_utils.dart';
      3. import 'package:flutter_basic_dapp/widgets/button_container_widget.dart';
      4. import 'package:syncfusion_flutter_sliders/sliders.dart';
      5.  
      6. class HomePage extends StatefulWidget {
      7.   const HomePage({Key? key}) : super(key: key);
      8.  
      9.   @override
      10.   State createState() => _HomePageState();
      11. }
      12.  
      13. class _HomePageState extends State<HomePage> {
      14.  
      15.   EthereumUtils ethUtils = EthereumUtils();
      16.  
      17.   double? _value = 0.0;
      18.  
      19.   var _data;
      20.  
      21.  
      22.   @override
      23.   void initState() {
      24.     ethUtils.getBalance().then((value) {
      25.       _data = value;
      26.       setState(() {
      27.  
      28.       });
      29.     });
      30.     super.initState();
      31.   }
      32.   @override
      33.   Widget build(BuildContext context) {
      34.     return Scaffold(
      35.       backgroundColor: Colors.deepPurple.withOpacity(.9),
      36.       appBar: AppBar(
      37.         title: Text(" "),
      38.       ),
      39.       body: Container(
      40.         margin: EdgeInsets.symmetric(horizontal: 20, vertical: 30),
      41.         // child: SingleChildScrollView(
      42.          child: Column(
      43.           mainAxisAlignment: MainAxisAlignment.spaceAround,
      44.           children: [
      45.             Container(
      46.               width: MediaQuery.of(context).size.width,
      47.               height: MediaQuery.of(context).size.height * 0.13,
      48.               decoration: BoxDecoration(
      49.                 color: Colors.deepPurple..withOpacity(.4),
      50.                 borderRadius: BorderRadius.circular(10),
      51.               ),
      52.               child: Center(
      53.                 child: Padding(
      54.                   padding: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
      55.                   child: Column(
      56.                     children: [
      57.                       Text("Current Balance", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold, color: Colors.white),),
      58.                       SizedBox(height: 12,),
      59.                       _data == null ? CircularProgressIndicator() : Text("${_data}", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 30, color: Colors.white),)
      60.                     ],
      61.                   ),
      62.                 ),
      63.               ),
      64.             ),
      65.             SizedBox(height: 40,),
      66.             SfSlider(
      67.               value: _value,
      68.               onChanged: (value) {
      69.                 setState(() {
      70.                   _value = value;
      71.                 });
      72.               } ,
      73.               interval: 1,
      74.               activeColor: Colors.white,
      75.               enableTooltip: true,
      76.               stepSize: 1.0,
      77.               showLabels: true,
      78.               min: 0.0,
      79.               max: 10.0,
      80.             ),
      81.             SizedBox(height: 40,),
      82.             CustomContainerButtonWidget(title: "Get Balance", color: Colors.green, onTap: () {
      83.               ethUtils.getBalance().then((value) {
      84.                 _data = value;
      85.                 setState(() {
      86.  
      87.                 });
      88.               });
      89.             }),
      90.             SizedBox(height: 40,),
      91.             CustomContainerButtonWidget(title: "Send Balance", color: Colors.deepPurpleAccent,
      92.                 onTap: () async {
      93.                   await ethUtils.sendBalance(_value!.toInt());
      94.                   if (_value == 0) {
      95.                     incorrectValueDialogBox(context);
      96.                   } else {
      97.                     sendDialogBox(context);
      98.                   }
      99.                 }),
      100.             SizedBox(height: 40,),
      101.             CustomContainerButtonWidget(title: "WithDraw", color: Colors.deepOrange,
      102.                 onTap: () async {
      103.                   await ethUtils.withDrawBalance(_value!.toInt());
      104.  
      105.                   if (_value == 0) {
      106.                     incorrectValueDialogBox(context);
      107.                   } else {
      108.                     withDrawDialogBox(context);
      109.                   }
      110.                 }),
      111.           ],
      112.         ),
      113.     // ),
      114.       ),
      115.     );
      116.   }
      117.  
      118.   incorrectValueDialogBox(BuildContext context) {
      119.     return showDialog(
      120.         context: context,
      121.         builder: (BuildContext context) {
      122.           return AlertDialog(
      123.             title: Text(
      124.               'Invalid Value',
      125.               textAlign: TextAlign.center,
      126.               style: TextStyle(
      127.                 fontSize: 18.0,
      128.               ),
      129.             ),
      130.             content: const Text('Please put a value greater then 0.',
      131.                 textAlign: TextAlign.center,
      132.                 style: TextStyle(
      133.                   color: Colors.black87,
      134.                 )),
      135.             actions: [
      136.               ElevatedButton(
      137.                 child: Text('OK'),
      138.                 onPressed: () {
      139.                   Navigator.of(context).pop();
      140.                 },
      141.               ),
      142.             ],
      143.           );
      144.         });
      145.   }
      146.  
      147.   sendDialogBox(BuildContext context) {
      148.     return showDialog(
      149.         context: context,
      150.         builder: (BuildContext context) {
      151.           return AlertDialog(
      152.             title: Padding(
      153.               padding: const EdgeInsets.all(10.0),
      154.               child: Text(
      155.                 "Thanks for your Transaction",
      156.                 textAlign: TextAlign.center,
      157.                 style: TextStyle(
      158.                   fontSize: 20.0,
      159.                 ),
      160.               ),
      161.             ),
      162.             actions: [
      163.               ElevatedButton(
      164.                 child: Text('Cancel'),
      165.                 onPressed: () {
      166.                   Navigator.of(context).pop();
      167.                 },
      168.               ),
      169.             ],
      170.           );
      171.         });
      172.   }
      173.  
      174.   withDrawDialogBox(BuildContext context) {
      175.     return showDialog(
      176.         context: context,
      177.         builder: (BuildContext context) {
      178.           return AlertDialog(
      179.             title: Padding(
      180.               padding: const EdgeInsets.all(10.0),
      181.               child: Text(
      182.                 "Thanks for your Withdrawal",
      183.                 textAlign: TextAlign.center,
      184.                 style: TextStyle(
      185.  
      186.                   fontSize: 20.0,
      187.                 ),
      188.               ),
      189.             ),
      190.             actions: [
      191.               ElevatedButton(
      192.                 child: Text('Cancel'),
      193.                 onPressed: () {
      194.                   Navigator.of(context).pop();
      195.                 },
      196.               ),
      197.             ],
      198.           );
      199.         });
      200.   }
      201. }

    4. button_container_widget.dart

      1.  
      2. import 'package:flutter/material.dart';
      3.  
      4. class CustomContainerButtonWidget extends StatelessWidget {
      5.   final String title;
      6.   final Color color;
      7.   final VoidCallback onTap;
      8.   final int? value;
      9.   const CustomContainerButtonWidget({Key? key, required this.title, required this.color, required this.onTap, this.value}) : super(key: key);
      10.  
      11.   @override
      12.   Widget build(BuildContext context) {
      13.     return InkWell(
      14.       onTap: onTap,
      15.       child: Container(
      16.         height: 60,
      17.         width: MediaQuery.of(context).size.width * 0.6,
      18.         decoration: BoxDecoration(
      19.           color: color,
      20.         ),
      21.         child: Center(
      22.           child: Text(
      23.             title, textAlign: TextAlign.left,
      24.             style: TextStyle(
      25.                 fontSize: 20,
      26.                 fontWeight: FontWeight.bold,
      27.                 color: Colors.white
      28.             ),
      29.           ),
      30.         ),
      31.       ),
      32.     );
      33.   }
      34. }

    5. pubspec.yaml

      1. name: flutter_basic_dapp
      2. description: A new Flutter project.
      3.  
      4. # The following line prevents the package from being accidentally published to
      5. # pub.dev using `flutter pub publish`. This is preferred for private packages.
      6. publish_to: 'none' # Remove this line if you wish to publish to pub.dev
      7.  
      8. # The following defines the version and build number for your application.
      9. # A version number is three numbers separated by dots, like 1.2.43
      10. # followed by an optional build number separated by a +.
      11. # Both the version and the builder number may be overridden in flutter
      12. # build by specifying --build-name and --build-number, respectively.
      13. # In Android, build-name is used as versionName while build-number used as versionCode.
      14. # Read more about Android versioning at https://developer.android.com/studio/publish/versioning
      15. # In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
      16. # Read more about iOS versioning at
      17. # https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
      18. version: 1.0.0+1
      19.  
      20. environment:
      21.   sdk: ">=2.16.1 <3.0.0"
      22.  
      23. # Dependencies specify other packages that your package needs in order to work.
      24. # To automatically upgrade your package dependencies to the latest versions
      25. # consider running `flutter pub upgrade --major-versions`. Alternatively,
      26. # dependencies can be manually updated by changing the version numbers below to
      27. # the latest version available on pub.dev. To see which dependencies have newer
      28. # versions available, run `flutter pub outdated`.
      29. dependencies:
      30.   flutter:
      31.     sdk: flutter
      32.   flutter_dotenv: ^5.0.2
      33.   http: ^0.13.4
      34.   web3dart: ^2.3.5
      35.   syncfusion_flutter_sliders: ^19.4.56
      36.  
      37.  
      38.   # The following adds the Cupertino Icons font to your application.
      39.   # Use with the CupertinoIcons class for iOS style icons.
      40.   cupertino_icons: ^1.0.2
      42. dev_dependencies:
      43.   flutter_test:
      44.     sdk: flutter
      46.   # The "flutter_lints" package below contains a set of recommended lints to
      47.   # encourage good coding practices. The lint set provided by the package is
      48.   # activated in the `analysis_options.yaml` file located at the root of your
      49.   # package. See that file for information about deactivating specific lint
      50.   # rules and activating additional ones.
      51.   flutter_lints: ^1.0.0
      53. # For information on the generic Dart part of this file, see the
      54. # following page: https://dart.dev/tools/pub/pubspec
      56. # The following section is specific to Flutter.
      57. flutter:
      59.   # The following line ensures that the Material Icons font is
      60.   # included with your application, so that you can use the icons in
      61.   # the material Icons class.
      62.   uses-material-design: true
      64.   # To add assets to your application, add an assets section, like this:
      65.   assets:
      66.     - .env
      67.     - assets/artifacts/.
      70.   # An image asset can refer to one or more resolution-specific "variants", see
      71.   # https://flutter.dev/assets-and-images/#resolution-aware.
      73.   # For details regarding adding assets from package dependencies, see
      74.   # https://flutter.dev/assets-and-images/#from-packages
      76.   # To add custom fonts to your application, add a fonts section here,
      77.   # in this "flutter" section. Each entry in this list should have a
      78.   # "family" key with the font family name, and a "fonts" key with a
      79.   # list giving the asset and other descriptors for the font. For
      80.   # example:
      81.   # fonts:
      82.   #   - family: Schyler
      83.   #     fonts:
      84.   #       - asset: fonts/Schyler-Regular.ttf
      85.   #       - asset: fonts/Schyler-Italic.ttf
      86.   #         style: italic
      87.   #   - family: Trajan Pro
      88.   #     fonts:
      89.   #       - asset: fonts/TrajanPro.ttf
      90.   #       - asset: fonts/TrajanPro_Bold.ttf
      91.   #         weight: 700
      92.   #
      93.   # For details regarding fonts from package dependencies,
      94.   # see https://flutter.dev/custom-fonts/#from-packages

    6. 新建一个 .env文件

      1. METAMASK_WALLET_ADDRESS = 0x94B6D5dC903c96299C16bdBe45652A61a2334424
      2. METAMASK_PRIVATE_KEY = ee4923c9c3154ccc71697c048ad079c600e09b8a730f1c80b8931ca0c519dc3f
      3. CONTRACT_ADDRESS = 0x0585c0f265D6073d7D46ed339Eaf2b8035982655
      METAMASK_WALLET_ADDRESS是钱包地址
METAMASK_PRIVATE_KEY是账户私钥
CONTRACT_ADDRESS是智能合约地址(在Remix中可以获取，truffle框架进行编译也可以进行获取)

     智能合约

    1. // SPDX-License-Identifier: MIT
    2. pragma solidity >=0.7.0 < 0.9.0;
    3.  
    4.   contract BasicDapp {
    5.  
    6.     uint balance;
    7.  
    8.     constructor() {
    9.         balance = 0;
    10.     }
    11.  
    12.     function sendBalance(uint amount) public {
    13.         balance += amount;
    14.     }
    15.  
    16.     function withDrawBalance(uint amount) public {
    17.         require(balance > amount ,"Not Enough Balance");
    18.         balance -= amount;
    19.     }
    20.  
    21.     function getBalance() public view returns (uint){
    22.         return balance;
    23.     }
    24.  
    25.   }

     运行截图：

    总结

    特别注意的地方：

    1、新建一个 .env文件（有一个点)，在flutter项目目录下。里面的配置需要按照自己私链的配置及metamask连上私链配置

    2、在models文件夹下的etherum_utils.dart中，这个需要修改为自己私链的ip加端口。

     3、分别代表私钥和智能合约函数名

     4、这个需要修改为链的chainid

     5、这个是truffle编译成的json文件所在目录

     

  • 相关阅读:
    FIX - 克隆虚拟机NAT模式网络不通、不稳定、vMnet8网络故障、网卡冲突、ssh连接慢
    使用Flink批处理实现WordCount
    安卓高级编程之实现类似三星系统的设置界面，并用lucene建立搜索系统
    Github每日精选（第14期）：在线富文本编辑器Editor.js
    自动化测试面试题解析，半小时通透
    一次业务代码的流式重构
    C++项目实战--线程池代码讲解
    [架构之路-19]：目标系统 - 硬件平台 - 案例1 - 用单片机STM8/STM32搭建目标系统（以无线传感器LoRa终端为例）
    天河超算，安装Hypre
    mysql的存储过程
  • 原文地址：https://blog.csdn.net/weixin_46085718/article/details/127427616