Add the Flutter plug-in to your app

Overview

To start configuring basic mobile app messaging in Flutter projects for iOS and Android apps, create an example app in Flutter and then configure and build your Android and iOS apps. After configuring basic mobile app messages, you can configure advanced mobile app messaging features.

🚧
Warning:
When Acoustic Mobile App Messaging stores data that you send, the data is not encrypted; therefore, it is recommended that you do not transmit sensitive information in the inbox, in-app, and mobile app messages. The data is not encrypted in our databases or log files or when stored on the device. If you must transmit sensitive information, encrypt the data before sending it and decrypt the data in memory on the device.

Before you begin

Set up the appropriate environment. For more information, see Set up an editor.

📘
Note:
The Acoustic Flutter SDK supports Flutter SDK version >=2.12.0 <3.0.0. Verify the correct Flutter SDK is installed when setting up your environment.

Create a Flutter application

Use the flutter create command to create a new project:

$ flutter create myapp
$ cd myapp

You can also pass other arguments to the flutter create command, such as the project name (pubspec.yml), the organization name, or specify the programming language used for the native platform. For more information, see Create the app.
Example:

$ flutter create --project-name myapp --org dev. Flutter --android-language java --ios-language objc myapp
$ cd myapp

📘
Note:
To add Flutter to an existing application, see Add Flutter to existing app.

Install Acoustic Flutter plug-in

Download the Acoustic Flutter plug-in.
Add your application to the Root/Applications directory in the Flutter plug-in. The Acoustic Flutter plug-in repo is structured as follows:

-Root
 -Applications
  -Sample
  -<add your applications>
 -Plugins
  -<all the plug-ins here>

The Acoustic Flutter plug-in is packaged as separate plug-ins with various peer dependencies. The peer dependencies are listed in the pubspec.yaml file for the respective plug-in.

Link the plug-ins

To link the plug-ins to your application, you can add them as dependencies in your app's pubspec.yaml file as follows:

🚧
Note:
If you are using VSCode, it automatically runs the flutter pub get command which installs the plug-ins to your app.
If you are not using VSCode, you must manually run the flutter pub get command after adding the new dependencies.

dependencies:
  flutter:
    sdk: flutter
  flutter_acoustic_mobile_push:
    path: ../../plugins/flutter_acoustic_mobile_push
  flutter_acoustic_mobile_push_inbox:
    path: ../../plugins/flutter_acoustic_mobile_push_inbox
  flutter_acoustic_mobile_push_beacon:
    path: ../../plugins/flutter_acoustic_mobile_push_beacon
  flutter_acoustic_mobile_push_geofence:
    path: ../../plugins/flutter_acoustic_mobile_push_geofence
  flutter_acoustic_mobile_push_inapp:
    path: ../../plugins/flutter_acoustic_mobile_push_inapp
  flutter_acoustic_mobile_push_location:
    path: ../../plugins/flutter_acoustic_mobile_push_location

📘
Note:
The location plug-in is required if you use the beacon or geofence plug-ins.

📘
Note:
The example paths to the plug-ins assume you placed the app in the same directory as the sample app. If you place your app in a different directory, update the paths accordingly.

Set up your iOS project

When creating a new Flutter project, the iOS platform's default version is 9.0. The Acoustic Flutter plugin requires a minimum version of 12.1.

Update the pod file

To update the iOS platform:

Open the podfile in your app's iOS directory.
Replace # platform :ios, '9.0' with platform :ios, '12.1'.
Change into the iOS directory cd ios.
Install the pods using the pod install command.

Use the plug-ins in your app

You can import the .dart files directly into your application:

import 'package:flutter_acoustic_mobile_push/flutter_acoustic_sdk_push.dart';
import 'package:flutter_acoustic_mobile_push_inbox/inbox/messages/inbox_messages.dart';
import 'package:flutter_acoustic_mobile_push_inapp/flutter_acoustic_mobile_push_inapp.dart';
import 'package:flutter_acoustic_mobile_push_location/location.dart';

For more information about using each plug-in, see examples provided in the sample in the applications/sample/ folder.

Update the project version

To update the project version:

Open your .xcworkspace file.
Select your main app target.
In the General tab, set the Minimum Deployments version to 12.1.

Integrate the SDK into your app

Download the MceConfig file and add it to all your application project's targets. For more information about MceConfig, see Configuration (MceConfig.json).
Set your team and provisioning profile in the Signing and Capabilities tab. You must complete this step before the app has permission to get the APNs deviceToken.
For the pod target and the app target, go to the Build Settings tab and set Set Build Active Architectures Only to No. You must set it to No for both Debug and Release.
Set Push Notification capability in Target Capabilities.
Add App Group capability to your main application target. Be sure to create and check the checkmark for the App Group in the interface.
Add the Keychain Sharing capability to your main application target. Be sure to add a Keychain Group value to the list.
Turn on location updates if you want to use locations or beacons with your app:

Go to the Capabilities tab for your target > Background Modes section.
Select Location updates. For more information, see Device Location Awareness (DLA Device Location Awareness (DLA).

Automated integration

The iOS SDK is compatible with the Swift programming language. Any version of the SDK before v3.6.10 does not work with Swift Application Delegates. You can use a workaround by using an Objective-C delegate class. Usage of the SDK from Swift is demonstrated in the Swift sample project starting with V3.6.10.

The automatic integration method requires a main.swift file to be created in the project. It should contain the following:

import UIKit
import AcousticMobilePush

let argv = UnsafeMutableRawPointer(CommandLine.unsafeArgv).bindMemory(to: UnsafeMutablePointer<Int8>.self, capacity: Int(CommandLine.argc))
let _ = UIApplicationMain(CommandLine.argc, CommandLine.unsafeArgv, nil, NSStringFromClass(MCEAppDelegate.self) )

In order for Swift to use the classes in the SDK, you must import the framework at the top of the Swift files that use it. For more information, see Apple Developer documentation.

import AcousticMobilePush

📘
Note:
When you use Swift, prefix the package name to the appDelegateClass in the MCEconfig file.

{
  "appDelegateClass": "Sample.AppDelegate"
  ... // Rest of MceConfig.json file
}

Add the following import directive to the top of the AppDelegate.

import UserNotifications

Add didFinishLaunchingWithOptions to the application method in your AppDelegate class. This code sets the notification type to badge, sound, and alert. You can remove the unwanted notification types from each OS support level declaration.

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey : Any]? = nil) -> Bool {
        application.registerForRemoteNotifications()

    // iOS 10+ Example static action category:
    let acceptAction = UNNotificationAction(identifier: "Accept", title: "Accept", options: [.foreground])
    let rejectAction = UNNotificationAction(identifier: "Reject", title: "Reject", options: [.destructive])
    let category = UNNotificationCategory(identifier: "example", actions: [acceptAction, rejectAction], intentIdentifiers: [], options: [.customDismissAction])
    
    var categories = Set()
    categories.insert(category)
    
    // iOS 10+ Push Message Registration
    let center = UNUserNotificationCenter.current()
    center.requestAuthorization(options: [.alert, .sound, .carPlay, .badge], completionHandler: { (granted, error) in
        if let error = error {
            print("Could not request authorization from APNS \(error.localizedDescription)")
        }
        center.setNotificationCategories(categories)
    })
    
    return true
}

For more information about integrating the iOS SDK to your app, see Add the iOS SDK to your app

Update the SDK configuration

Open the MceConfig.json file.
Swift requires your class to be in a namespace. For example, update the appDelegateClass value to SwiftSample.AppDelegate in the Swift sample app.
Update the dev and prod entries in the appKey section to match the App Keys created in the web portal.
- The dev entry is used when you run the app from Xcode with a development provisioning profile. The prod entry is used when you run the app with an App Store, Enterprise, or AdHoc provisioning profile.
- If you do not have a production App Key, use apXXXXXXXX for the prod entry.
Update the baseUrl entry to match the server for your App Key. The baseURL was provided when your account was provisioned for mobile app messaging.
If you are not using Geofences or iBeacons, you can remove the location entry and all its children.
If you are using iBeacons, update the UUID in the iBeacon section of the location entry. The UUID should match the UUID for your iBeacons.

For more information, see Configuration (MceConfig.json).

Now you can compile and run the app to start communication with the Acoustic servers. Use the verbose logs in the MceConfig.json file to debug.

Customize push notifications

Push notifications are accessed through a notification channel. You can customize the push notifications by customizing the notification channel function. To access the function:

Go to the root directory of the project > plugins folder.
Go to flutter_acoustic_mobile_push > android >src >main >kotlin > co > acoustic > flutter > sdk > flutter_acoustic_mobile_push and open the MainApplication.kt file.
In the MainApplication.kt file, find the following code:

private fun createNotificationChannel() {

The createNotificationChannel function adds the functionality for push notifications.

Customize this function to customize the push notifications.

Set up your Android project

Add gson package

In the directory for android/app, create a directory labeled libs.
Download the gson 2.2.4 jar from Download gson JAR 2.2.4 with all dependencies.
Unzip the downloaded file.
Place the gson-2.2.4.jar file inside the newly created libs directory.

Update the build.gradle file

Open the build.gradle file located in android/build.gradle and inside of dependencies add classpath "com.google.gms:google-services:4.3.10" .

Delete the section for allprojects with the following:

rootProject.allprojects {
    repositories {
        google()
        mavenCentral()
        jcenter()
        // added `libs` as dependency location
        flatDir {
            dirs 'libs'
        }
    }
}

Update the app's build.gradle file

Open build.gradle located in android/app/build.gradle and after the line apply from:" $flutterRoot/packages/flutter_tools/gradle/flutter.gradle" add the following:

rootProject.allprojects {
		repositories {
				google()
				mavenCentral()
				jcenter()
				// added `libs` as dependency location
				flatDir {
						dirs 'libs'
				}
		}
}

In the android bracket, change compileSdkVersion flutter.compileSdkVersion to compileSdkVersion 33.

Inside the android bracket, add the following:

sourceSets {
		main.java.srcDirs += 'src/main/kotlin'
}

Inside the android bracket, there will be a bracket for defaultConfig change minSdkVersion flutter.minSdkVersion to minSdkVersion 23.
Change targetSdkVersion flutter.targetSdkVersion to targetSdkVersion30. Lastly, after versionNameflutterVersionName, add the following:
```
multiDexEnabled true
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
```

After the bracket for buildTypes, add the following:

packagingOptions {
	exclude 'META-INF/NOTICE'
	exclude 'META-INF/LICENSE'
}

Replace the dependencies with the following:

dependencies {
	implementation fileTree(dir: 'libs', include: ['*.jar, *.aar'])
	implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"

  implementation 'androidx.multidex:multidex:2.0.1' //with androidx libraries
	implementation 'com.google.android.gms:play-services-basement:17.6.0'
  
  testImplementation 'junit:junit:4.12'
	
  // https://developer.android.com/jetpack/androidx/releases/test/#1.2.0
	androidTestImplementation 'androidx.test:runner:1.2.0'
	androidTestImplementation 'androidx.test.espresso:espresso-core:3.2.0'
}

apply plugin: 'com.google.gms.google-services'

Update the AndroidManifest.xml file

Update the AndroidManifest.xml file in android/app/src/main/ and make the following meta-data changes.

After the manifest opening tag, add:

<uses-permission android:name="android.permission.POST_NOTIFICATIONS"/>

Inside of application delete android:name=" ${applicationName}"
Outside of application and before activity add the following: Replace "INSERT-API-KEY-HERE" with your Google Maps Key.
```
<meta-data android:name="com.google.android.geo.API_KEY"
android:value="INSERT-API-KEY-HERE"/>
```

After the meta-data section for android:name=" io.flutter.embedding.android.NormalTheme" add the following:

<meta-data
android:name="io.flutter.embedding.android.SplashScreenDrawable"
android:resource="@drawable/launch_background"
/>

After the intent-filler section for android:name= "android.intent.action.MAIN" add the following:

<intent-filter>
  <action android:name="FLUTTER_NOTIFICATION_CLICK" />
	<category android:name="android.intent.category.DEFAULT" />
</intent-filter>

<intent-filter>
	<action android:name="co.acoustic.flutter.openInboxMessage" />
	<category android:name="android.intent.category.DEFAULT" />
</intent-filter>

After the meta-data section for android:name= "flutterEmbedding," add the following:

<!-- geofence services -->
<service
	android:name="com.pravera.flutter_foreground_task.service.ForegroundService"
	android:foregroundServiceType="location"
	android:stopWithTask="true" />

Create a MceConfig JSON file

Create a directory labeled assets in the android/app/src/main/.
Inside this assets directory, create a file labeled MceConfig.json.
To configure this file, see Configuration (MceConfig.json).

Final Step

Copy your google-services.json file and add it to the android/app/ directory.

Add the Flutter plug-in to your app

Overview

🚧
Warning:

Before you begin

📘
Note:

Create a Flutter application

📘
Note:

Install Acoustic Flutter plug-in

Link the plug-ins

🚧
Note:

📘
Note:

📘
Note:

Set up your iOS project

Update the pod file

Use the plug-ins in your app

Update the project version

Integrate the SDK into your app

Automated integration

📘
Note:

Update the SDK configuration

Customize push notifications

Set up your Android project

Add gson package

Update the build.gradle file

Update the app's build.gradle file

Update the AndroidManifest.xml file

Create a MceConfig JSON file

Final Step

Overview

🚧Warning:

Before you begin

📘Note:

Create a Flutter application

📘Note:

Install Acoustic Flutter plug-in

Link the plug-ins

🚧Note:

📘Note:

📘Note:

Set up your iOS project

Update the pod file

Use the plug-ins in your app

Update the project version

Integrate the SDK into your app

Automated integration

📘Note:

Update the SDK configuration

Customize push notifications

Set up your Android project

Add gson package

Update the build.gradle file

Update the app's build.gradle file

Update the AndroidManifest.xml file

Create a MceConfig JSON file

Final Step

🚧
Warning:

📘
Note:

📘
Note:

🚧
Note:

📘
Note:

📘
Note:

📘
Note: