Integrate with iOS app


Follow these steps for iOS integration

Requirements

  • Xcode 9.0
  • iOS 8.0+

Note: Floatbot-iOS SDK contains a slice for arm64 architecture, and supports only iOS 8.0 and above

For Manual Integration

  • Download the latest floatbot.framework which is provided as a zip-File.
  • Open your Xcode project or workspace.
  • Go to the Build Phases for your app target.
  • Add the frameworks to the Link Binaries With Libraries list.
  • Go to the Build Phases for your app target.
  • Add a New Copy Files Phase by selecting the Add icon. Set the Destination field to Frameworks, and add the framework to the list. Ensure Code Sign on Copy is checked.
  • Add flbAssets.bundle to copy bundle resources of your project

For Cocoa Pods Integration

Step 1 : Create a Podfile in your project's root directory, if it doesn't exist yet

Step 2 : Add the floatbot pod in Podfile under your desired target:


	target 'YOUR-TARGET'
		...
		pod 'floatbot' 
	end

 

Step 3 : Run pod pod repo update && pod install

Step 4 : Open your project using the generated *.xcworkspace file.

BOT_ID and KEY

To configure floatbot iOS SDK in your app, you will need BOT_ID and KEY from the Settings page.

  • Go to Chatbot Section of your Dashboard

chatbot development platform

  • Go to Settings of your Chatbot

customer engagement bot

  • Inside Settings of your chatbot, you will find BOT ID and Token.

chatbot for call center

Configure your project

1) Add following key to your Info.plist file with appropriate message for iOS 11 Compatibility

NSPhotoLibraryAddUsageDescription :Specify the reason for your app to get read-only access to the user’s photo library (To upload files from device)

Starting iOS 11, Apple requires developers to declare access to privacy-sensitive controls ahead of time. To comply with this new privacy requirement, developers must add the required keys to the Info.plist: Warning! Failing this iOS 11 will exit the app by crashing when user tries to access the photo library to save images. For more clarification, click here.

 

2) Enable Background mode for Push notification

Add Cloudkit.framework in Link Binary with Libraries.
Enable iCloud Documents with Xcode, from tab Capabilities.

capabilites

 

3) Enable Background mode for Push notification

Enable Push notification with Xcode, from tab Capabilities.

Push notification

 

Step 1: Import “floatbot.h” in AppDelegate.m

#import <floatbot/floatbot.h>

Step 2: Initialize and configure floatbot for your app.

#define SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(v) ([[[UIDevice currentDevice] systemVersion]  compare:v options:NSNumericSearch] != NSOrderedAscending)

In -[AppDelegate application:didFinishLaunchingWithOptions:] method method add following required methods to configure bot,


[floatbotManager appLaunched];
[[floatbotManager sharedManager] setFLB_BOT_ID:BOT_ID]; 
[[floatbotManager sharedManager] setFLB_KEY:KEY];
[[floatbotManager sharedManager] setBOT_NAME:BOT_NAME];

The above method will set the name of your bot in the app, which will be displayed on the top of chat screen.

To display sessions list, add following optional method

[[floatbotManager sharedManager] setShowSessionList:YES/NO];

This will take user directly to chat screen if value passed is NO


    //SET MOBILE NUMBER WITH COUNTRYCODE (OPTIONAL)
    [[floatbotManager sharedManager] setPHONE_NUMBER_WITH_COUNTRY_CODE:PHONE_NO];

Optionally, you can set the mobile number of the user to identify the user. Note: PHONE_NO passed to above method should be the number prefixed with the country code and without “+”.Eg. 9110000001

To set the hash value for each user, add following method

[[floatbotManager sharedManager] setHash:hashString];

To initialize user and load chat screen, add the following method (i.e. onButtonClick or when app launches or after user is validated), Pass UIViewController object as input parameter

[floatbotManager startChatWithViewController:self];

Step 3:Handle Push notification

To enable floatbot to send push notifications to the application, add this implementation of - application:didRegisterForRemoteNotificationsWithDeviceToken: in your AppDelegate file that captures the device token and sends it to floatbot server

Add below snippet in [AppDelegate application:didFinishLaunchingWithOptions:] method


if(SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(@"8.0"))
{	
	UIUserNotificationSettings *settings =
	[UIUserNotificationSettings settingsForTypes:UIUserNotificationTypeAlert | UIUserNotificationTypeBadge | UIUserNotificationTypeSound categories:nil];
    [[UIApplication sharedApplication] registerUserNotificationSettings:settings];
    [[UIApplication sharedApplication] registerForRemoteNotifications];
}
else
{
	[[UIApplication sharedApplication] registerForRemoteNotificationTypes:(UIRemoteNotificationTypeBadge | UIRemoteNotificationTypeSound | UIRemoteNotificationTypeAlert)];
}
To set push token, add following method
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{ 
   	 [floatbotManager setToken:deviceToken];
}

   


Step 4: Uploading your App’s SSL Push Certificate

To generate APNS certificate refer this :

https://developer.apple.com/library/content/documentation/IDEs/Conceptual/AppDist
ributionGuide/AddingCapabilities/AddingCapabilities.html

1. Go to the Mac OS finder application, and search for “Keychain Access”. Open it. 

2. Find your App’s push certificate in the Certificates section. It will start with the string “"Apple Development iOS Push Services" (“Apple Production iOS push services” in case of production certificate)  

3. Expand the row, and you will find the private key.  

4. Select both the private key and certificate and export it as .p12 file and necessarily set a password. 

5. Upload the saved .p12 file in the field below selecting development environment or production environment depending on whether you are using it for dev or production push services.

Upload your development / production certificate in Settings page

Push Message send for iOS

Theme customization

1) To set incoming message bubble background color

       [[floatbotManager sharedManager] setIncomingMessageBubbleColor:[UIColor redColor]];

2) To set outgoing message bubble background color

       [[floatbotManager sharedManager] setOutgoingMessageBubbleColor:[UIColor redColor]];

3) To set incoming message text color

       [[floatbotManager sharedManager] setOutgoingMessageBubbleColor:[UIColor redColor]];

4) To set outgoing message text color

       [[floatbotManager sharedManager] setOutgoingMessageBubbleColor:[UIColor redColor]];

You can have a look at Sample

Opensource libraries used

  • SDWebImage
  • AFNetworking