Search packages, repositories and app categories

Package detailsv2.0.2

flutter_web3_provider

Flutter web web3 provider.

30-day downloads
80
Likes
20
Pub points
25

Install package

flutter pub add flutter_web3_provider

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A Flutter package that enables integration with web3 technologies for web applications, allowing users to interact with Ethereum-based blockchains directly from their Flutter web apps. It provides a provider pattern implementation to manage blockchain connections, account states, and transaction handling. Designed specifically for the web platform, it simplifies access to wallets like MetaMask and supports standard web3 methods such as signing transactions and reading smart contract data. The package is lightweight and built to work seamlessly within Flutter's state management ecosystem.

Use cases

  • Connecting to Ethereum wallets in web apps
  • Reading data from smart contracts
  • Signing transactions on-chain
  • Managing user wallet accounts
  • Enabling decentralized app (dApp) functionality

Key features

  • Web-only web3 integration
  • Provider-based state management
  • Support for MetaMask and similar wallets
  • Simple API for common web3 operations
  • Built-in connection and disconnection handling

Suitable for

  • Flutter developers building dApps
  • Web-based blockchain applications
  • Projects requiring wallet connectivity
  • Users targeting Ethereum-compatible chains
  • Developers using Flutter's reactive UI framework

Considerations

  • Limited to web platform only
  • Requires browser-based wallet support
  • Depends on external wallet extensions
  • Not suitable for mobile or desktop apps
  • May need additional error handling for network issues

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

flutter_web3_provider

Flutter wrapper for using web3 providers, ie: accessing window.ethereum.

NOTE: This is for web only!

Getting Started

For full example, see: https://github.com/gochain/flutter_web3_provider/blob/main/example/lib/main.dart

Add import import 'package:flutter_web3_provider/ethereum.dart';

Then you can access it just be using the ethereum variable.

if(ethereum != null){
    // then an ethereum provider was injected
    print(ethereum.selectedAddress);
}

Ask user to connect their wallet:

RaisedButton(
    child: Text("Connect Wallet"),
    onPressed: () async {
        var accounts = await promiseToFuture(
            ethereum.request(RequestParams(method: 'eth_requestAccounts')));
        print(accounts);
        String se = ethereum.selectedAddress;
        print("selectedAddress: $se");
        setState(() {
            selectedAddress = se;
        });
    },
)
Using ethers.js

Add ethers.js to web/index.html.

  <script type="module">
    import { ethers } from "https://cdnjs.cloudflare.com/ajax/libs/ethers/6.7.0/ethers.min.js";
    window.ethers = ethers
    // Your code here...
  </script>

Import package:

import 'package:flutter_web3_provider/ethers.dart';

Then create an ethers provider:

// For a read-only provider:
var provider = JsonRpcProvider("https://rpc.gochain.io");
// For a read-write provider (ie: metamask, trust wallet, etc)
var web3 = BrowserProvider(ethereum);

Then you can do things like check balance and submit transactions, etc:

var abalanceF = promiseToFuture(web3.getBalance(ethereum.selectedAddress));

Future tx = promiseToFuture(web3.Signer().sendTransaction(TxParams(
      to: to,
      value: "0x" +
          BigInt.parse(toBase(amount, 18).toString()).toRadixString(16))));

Or use a contract:

const erc20Abi = [
    // Some details about the token
    "function name() view returns (string)",
    "function symbol() view returns (string)",

    // Get the account balance
    "function balanceOf(address) view returns (uint)",

    // Send some of your tokens to someone else
    "function transfer(address to, uint amount)",

    // An event triggered whenever anyone transfers to someone else
    "event Transfer(address indexed from, address indexed to, uint amount)"
];
var contract = Contract(contractAddress, erc20Abi, web3);
// call balanceOf function
var usdcBalanceF = promiseToFuture(
          callMethod(contract, "balanceOf", [ethereum.selectedAddress]));
          
// to make a write transaction, first get the signer (this will use metamask/wallet)
contract = contract.connect(await promiseToFuture(web3.getSigner())); // uses the connected wallet as signer
// then call the function:
var res =
    await promiseToFuture(callMethod(contract, "transfer", [
    '0x39C5190c09ec04cF09C782bA4311C469473Ffe83',
    "0x" + amount.toString()).toRadixString(16)
    ]));

If you need to additional overrides like set gas price or passing the value param, you can add one extra param in the array with those fields, eg:

var res = await promiseToFuture(callMethod(
    contract, "transfer", ['0x39C5190c09ec04cF09C782bA4311C469473Ffe83', "0x" + amount.toString()).toRadixString(16), 
    TxParams(value: "1000000000000000000")]));

NOTES:

  • If you're using the human readable ABI's (ethers.js feature) like above, use uint, not uint256 even if the real abi is a uint256.
  • There are some common functions on the Contract, but you can also call any method using callMethod like above.

Developers

To publish:

make publish

Categories

Dependencies

Dependency list 1 items

  • js^0.7.1

Source repository

Projects using this package

No data available yet.