Flutter is Google’s new open-source technology for creating native Android and iOS apps with a single codebase. Since it has ready-made and custom widgets, it’s easy to build the UI.

Flutter has many advantages so the flutter apps implementation will be common. Integrating the IBM Watson on the flutter app will be more beneficial and helps to handle the end-user queries most effectively.

Setup an account in Kommunicate

Login to your Kommunicate dashboard and navigate to the Bot Integration section.

If you do not have an account, you can create one here for free.

Locate the IBM Watson section and click on Integrate Bot.

Now, navigate to your IBM cloud console and copy thee API key, URL, and Watson Assistant ID. Here are the steps to locate these sections.

  1. Login to your IBM Cloud account and navigate to Resource List.
  2. Under the Services panel, select your IBM Watson Assistant.
  3. From the Credentials section Copy API key and URL
  4. Next, click on Launch Watson Assistant button to see the list of all assistants.
  5. Click on the (…) menu button of the assistant that you want to integrate and open Settings.
  6. Select API details tab.
  7. Copy Assitant ID from the API details section.

You can also refer to this blog for IBM Watson integration with Kommunicate.

You can check your newly created bot in the below section:

  • Dashboard →Bot Integration → Manage Bots: You can check all your integrated bots here.

Once you create a bot then you can set it as a default bot in the conversation routing rules section as shown below.

  • Click on ⚙️ Settings >> Conversation rules >> Routing rules for bots >> Then click on bot like below and select your bot

Now, this bot will reply in all the conversations.

Install and setup IBM Watson chatbot into Flutter App

Kommunicate Flutter SDK allows you to add customizable live chat to your applications. It supports many hybrid platforms that are currently in the market. It provides a fast and expressive way to build native apps on both IOS and Android.

Prerequisites

Apps using Kommunicate can target Xcode 11 or later and AndroidX is required.

Add Flutter SDK to your app

1. Add the below dependency in your pubspec.yaml file:1dependencies: 2 # other dependencies 3 kommunicate_flutter: ^1.1.3

2. Install the package as flutter pub get

3. Import kommunicate_flutter in your .dart file to use the methods from Kommunicate:1import 'package:kommunicate_flutter/kommunicate_flutter.dart';

For iOS, navigate to your App/iOS directory from the terminal and run the below command:1pod install

Note: Kommunicate iOS requires min iOS platform version 10 and uses dynamic frameworks. Make sure you have the below settings at the top of your iOS/Podfile:

1platform :ios, '10.0' 2use_frameworks!

Get your Application ID

You can get the Application ID from the install section of Kommunicate Dashboard.

  • Go to ⚙️Settings >> INSTALL >> Install >> Your App ID:

Launch conversation

Kommunicate provides build conversation function to create and launch conversation directly. It saves your extra steps of authentication, creation, initialization, and launch. You can customize the process by building the conversation object according to your requirements.

To launch the conversation you need to create a conversation object. This object is passed to the build conversation function and based on the parameters of the object the conversation is created/launched.

Below is an example to launch a conversation.

dynamic conversationObject = {
     'appId': '<APP_ID>',// The [APP_ID](https://dashboard.kommunicate.io/settings/install) obtained from kommunicate dashboard.
     };

    KommunicateFlutterPlugin.buildConversation(conversationObject)
        .then((clientConversationId) {
      print("Conversation builder success : " + clientConversationId.toString());
    }).catchError((error) {
      print("Conversation builder error : " + error.toString());
    });

That’s all! Run the Flutter app and chat with the IBM Watson chatbot. 

You can easily integrate IBM Watson chatbot into Flutter apps in a few simple steps.

In case you need more information, you can check out the Kommunicate documentation.

Kommunicate Sample application: Download the sample app from here which includes ready-to-use Kommunicate Flutter SDK.

Go ahead and explore the Flutter integration with IBM Watson chatbot.

Bonus: Build chatbot and activate in Flutter app

Author

Write A Comment