Guide FloatChat

Floatchat- User Guid

Native Android

 

1. Getting Started #

1.1 Open the Floatchat portal and navigate to Configure > Deploy.

1.2 Click on the Website Chatbot tab to access the Widget Script. You will find an initialization script in the following format:

“`html

<script>FloatChat.init({ “bot_key”: “<bot_key>”, “e”: “p”, “welcome_msg”: true, “branding_key”: “<branding_key>” });</script>

“`

Make a note of the ‘bot_key’ and ‘branding_key’ values from the widget script. You can find the <bot name> in the Configure > Bot Details tab of the portal.

2. Gradle Configuration #

To include Floatchat in your project, follow the Gradle configuration steps below:

Step 1: Add the JitPack repository to your build file. Add it at the end of repositories in the root build.gradle file:

“`groovy

allprojects {

    repositories {

        …

        maven { url ‘https://jitpack.io’ }

    }

}

“`

Step 2: Add the dependency in your app-level build.gradle file:

“`groovy

dependencies {

    implementation ‘com.gitlab.Floatchat.shared-microservices:android-chatbot-base:1.5.3’

}

“`

For the latest version of Floatchat, please refer to: [Floatchat on JitPack](https://jitpack.io/private#com.gitlab.Floatchat.shared-microservices/android-chatbot-base)

Note: If your project uses the Glide library, make sure to use version 4.9.0 or above:

“`groovy

implementation ‘com.github.bumptech.glide:glide:4.11.0’

“`

3. Initializing and Launching the Bot #

After importing the dependency, initialize and launch the bot in your application where you want to use it. The initialization code will look as follows:

“`java

import com.floatchat.botsdk.ui.ChatBotConfig;

ChatBotConfig.getInstance().init(“<bot_key>”, “<bot_name>”, true, “<branding_key>”, <activity>, “<bot_user_id>”, “<bot_chat_history>”, <show_done>, “<language_alignment>”, “<header_title_font>”, “<header_description_font>”, <send_button_drawable>, <send_button_bitmap_drawable>);

ChatBotConfig.getInstance().launchBot(“<request_code_for_callback>”);

“`

Here’s an explanation of the parameters: #

– ‘bot_key’: Obtain this from the Floatchat Admin portal.

– ‘bot_name’: The name of the bot to be displayed to users.

– ‘true’: A boolean value indicating whether the welcome message should be displayed.

– ‘branding_key’: Set it to either ‘default’ or the branding_key received during White Label setup.

– ‘activity’: The app context used for shared preferences.

– ‘bot_user_id’: A unique identifier for the user.

– ‘bot_chat_history’: The limit for chat history maintained by the app.

– ‘show_done’: Set to true to enable the done button for callback, and false to disable it.

– ‘language_alignment’: Choose the text alignment for conversations (LTR or RTL).

– ‘header_title_font’: Set a custom font for the bot’s header title (should be of type Typeface).

– ‘header_description_font’: Set a custom font for the bot’s header description (should be of type Typeface).

– ‘send_button_drawable’: Set a custom drawable for the bot’s send button (should be of type Integer).

– ‘send_button_bitmap_drawable’ (optional): Set a custom bitmap drawable for the bot’s send button (should be of type Integer).

To create a Typeface object, follow these steps: #

1. Add the font.ttf file to the assets folder in your app.

2. Create a Typeface from the assets:

“`java

Typeface typeface = Typeface.createFromAsset(getAssets(), “<font.ttf>”);

“`

To launch the bot activity and start a chat with the bot, simply call the launchBot() function. For full-screen window:

“`java

ChatBotConfig.getInstance().launchBot(“<request_code_for_callback>”);

“`

For pop-up windows: #

  1. Create a blank activity that will hold the Bot Fragment.
  2. Start the activity using startActivityForResult:

“`java

startActivityForResult(new Intent(this, <your_custom_activity>.class), “<request_code_for_callback>”);

“`

Inside the activity, add the following code to open the bot: #

“`java

import com.floatchat.botsdk.ui.ChatFragment;

ChatBotConfig.getInstance().init(“<bot_key>”, “<bot_name>”, true, “<branding_key>”, <activity>, “<bot_user_id>”, “<bot_chat_history>”, <show_done>, “<language_alignment>”, “<header_title_font>”, “<header_description_font>”, <send_button_drawable>, <send_button_bitmap_drawable>);

getSupportFragmentManager().beginTransaction().add(R.id.frame_container, new ChatFragment()).commit();

“`

In the above code, ‘frame_container’ refers to the parent layout ID of your custom activity, and ChatFragment is the bot fragment to be inflated.

Add the “botTheme” style to your custom activity.

4. Done Button Callback #

You will receive a callback in your activity’s overridden onActivityResult method. It will look like this:

“`java

@Override

protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {

    super.onActivityResult(requestCode, resultCode, data);

    if (resultCode == RESULT_OK) {

        if (requestCode == REQUEST_CODE_CALLBACK) {

            if (data != null) {

                ChatResult result = (ChatResult) data.getSerializableExtra(“RESULT_DATA”);

                Toast.makeText(this, result.getExitUrl(), Toast.LENGTH_SHORT).show();

            }

        }

    }

}

“`

The data received will have a specific pattern model: #

“`java

public class ChatResult implements Serializable {

    private String exitUrl;

    public String getExitUrl() {

        return exitUrl;

    }

    public void setExitUrl(String exitUrl) {

        this.exitUrl = exitUrl;

    }

}

“`

Sample Demo App: #

You can find a demo app for the Floatchat SDK at the following link:

[Demo App](https://branding-resources.s3.ap-south-1.amazonaws.com/default/android-sdk-app/FlaotchatFreshTest.zip)

What are your feelings
Scroll to Top