Integrating MetaMask with Flutter Mobile Application

Question

I want to add feature in my mobile app to send ether from one address to another address and for this I need to integrate metamask with my flutter mobile application. What package can I use for this purpose? I want to send ether through metamask but using UI of my application.

How can I do this?

Answer 1

We are actively maintaining a flutter template for creating web3 mobile apps: https://github.com/Nuxify/Sophon

The template uses walletconnect_dart and web3_dart and also got an example when connecting, reading, and writing to a Goerli smart contract.

Answer 2

Metamask supports WalletConnect protocol so you can use walletconnect_dart package to connect your app to Metamask wallet and then use the same package to sign/send transactions signed by Metamask.

Answer 3

I implemented this in my app. Here's the code. Hope this helps I have used the walletconnect_dart package to open the wallet from where the user can connect their wallet to the app and url_launcher to open the wallet

Future<void> connectWallet() async {
    final connector = WalletConnect(
      bridge: 'https://bridge.walletconnect.org',
      clientMeta: const PeerMeta(
        name: 'any name',
        description: 'any description',
        url: 'any url',
        icons: [
          'logo url'
        ],
      ),
    );

    // Subscribe to events
    connector.on('connect', (session) {
      debugPrint("connect: " + session.toString());

      address = sessionStatus?.accounts[0];
      chainId = sessionStatus?.chainId;

      debugPrint("Address: " + address!);
      debugPrint("Chain Id: " + chainId.toString());
    });

    connector.on('session_request', (payload) {
      debugPrint("session request: " + payload.toString());
    });

    connector.on('disconnect', (session) {
      debugPrint("disconnect: " + session.toString());
    });

    // Create a new session
    if (!connector.connected) {
      sessionStatus = await connector.createSession(
        chainId: 137, //pass the chain id of a network. 137 is Polygon
        onDisplayUri: (uri) {
          AppMehtods.openUrl(uri); //call the launchUrl(uri) method
        },
      );
    }
  }

Answer 4

In flutter, there is web3dart that works for mobile app

https://github.com/simolus3/web3dart

In react, there is moralis

https://github.com/MoralisWeb3/react-moralis