Flutter untuk Android

Anda dapat menyiapkan aplikasi seluler agar berfungsi dengan Contact Center AI Platform (CCAI Platform) dengan berbagai cara, termasuk dengan Flutter. Halaman ini menunjukkan cara mengintegrasikan Android SDK ke dalam aplikasi Android menggunakan Flutter.

Sebelum memulai

Sebelum mengikuti petunjuk di halaman ini, Anda harus mengikuti petunjuk di Mengintegrasikan menggunakan Flutter terlebih dahulu.

Mengintegrasikan SDK ke dalam aplikasi Android

Untuk mengintegrasikan SDK ke dalam aplikasi Android, ikuti langkah-langkah berikut:

1. Dalam file android/build.gradle di direktori contoh Flutter, perbarui minSdkVersion ke 21 atau yang lebih baru.

2. Di file android/src/main/AndroidManifest.xml, tambahkan kode berikut:

   <application>
     <activity
       android:name="co.ujet.android.activity.UjetActivity"
       android:exported="true">
       <intent-filter>
         <action android:name="android.intent.action.VIEW"/>
         <category android:name="android.intent.category.DEFAULT"/>
         <category android:name="android.intent.category.BROWSABLE"/>
         <!-- TODO: Change to your custom URL scheme. Config from Portal > Developer Settings > Mobile App > Enable Send SMS to Download App > Android App > URL -->
         <data
           android:host="co.ujet.flutter_example_app"
           android:path="/smartchannel"
           android:scheme="ujet" />
       </intent-filter>
     </activity>
   
     <meta-data
           android:name="co.ujet.android.companyKey"
           android:value="@string/ujet_company_key"/>
     <meta-data
         android:name="co.ujet.android.companyName"
         android:value="@string/ujet_company_name"/>
     <meta-data
         android:name="co.ujet.android.subdomain"
         android:value="@string/ujet_subdomain"/>
     <meta-data
         android:name="co.ujet.android.companyUrl"
         android:value="@string/ujet_company_url"/>
   </application>
   

3. Di tag <application>, perbarui nilai android:name menjadi .Application, seperti dalam contoh kode berikut:

   <!--Change the value of android:name to .Application -->
   <application
     android:name=".Application"
     android:label="Demo Application"
     android:icon="@mipmap/ic_launcher">
   

4. Update android/build.gradle, seperti dalam contoh kode berikut:

   allprojects {
     repositories {
       google()
       mavenCentral()
       maven {
         url "https://sdk.ujet.co/android/"
       }
     }
   }
   

5. Update android/app/build.gradle, seperti dalam contoh kode berikut:

   dependencies {
     // Use UJET SDK version 2.6.0 or latest to support recent push notification changes.
     def ujetSdkVersion = "x.y.z"
     implementation "co.ujet.android:ujet-android:$ujetSdkVersion"
     implementation "co.ujet.android:cobrowse:$ujetSdkVersion"
   }
   

6. Perbarui res/values/strings.xml, seperti dalam contoh kode berikut. Buat ini jika belum ada.

   <resources>
     <string name="ujet_company_key">YOUR_COMPANY_KEY</string>
     <string name="ujet_company_name">YOUR_COMPANY_NAME</string>
   
     <!-- If your tenant / portal url ends with "ujet.co" then set ujet_subdomain string only (ignore
         ujet_company_url), otherwise set ujet_company_url only (ignore ujet_subdomain) following below instructions. -->
     <!-- To get subdomain, extract string content between 'https://' and first '.' of your tenant/portal URL.
         Example, If your tenant url is https://XXX.YYY.ZZZ/ then subdomain will be XXX -->
     <string name="ujet_subdomain">YOUR_SUBDOMAIN</string>
   
     <!-- Use tenant url as company url here, it should be in format of https://XXX.YYY.ZZZ/api/v2
         (here XXX should match with your subdomain) -->
     <string name="ujet_company_url">YOUR_COMPANY_URL</string>
   </resources>
   

7. Buat project Firebase atau, jika Anda sudah memilikinya, daftarkan aplikasi ini. Download file google-service.json dan letakkan di project Anda di direktori berikut: example/android/app/.

Mendaftarkan modul

Untuk mendaftarkan modul, buka MainActivity.kt dan lakukan inisialisasi UJETModule, seperti pada contoh kode berikut:

class MainActivity : FlutterActivity() {
    override fun configureFlutterEngine(@NonNull flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)

        //Register and Initialize UJETModule
        UJETModule.init(flutterEngine.dartExecutor.binaryMessenger, applicationContext)
    }
}

Menyiapkan notifikasi push Android

Ikuti langkah-langkah berikut jika Anda ingin mengintegrasikan notifikasi push secara native. Pastikan Anda telah menyalin dan menempelkan direktori firebase ke project Android Anda seperti yang diarahkan dalam Mengintegrasikan SDK ke aplikasi Android.

Untuk menyiapkan notifikasi push Android, ikuti langkah-langkah berikut:

1. Tambahkan dependensi firebase untuk notifikasi push di file build.gradle level aplikasi Anda, seperti pada contoh kode berikut:

   dependencies {
     implementation platform("com.google.firebase:firebase-bom:32.8.0")
     implementation 'com.google.firebase:firebase-messaging'
   }
   

2. Update AndroidManifest.xml, seperti dalam contoh kode berikut:

   <application>
     <service
       android:name=".firebase.MyFirebaseMessagingService"
       android:exported="false">
       <intent-filter>
         <action android:name="com.google.firebase.MESSAGING_EVENT" />
       </intent-filter>
     </service>
   </application>
   

3. Tambahkan plugin google-services di tingkat root project Anda di build.gradle, seperti dalam contoh kode berikut:

   plugins {
     id 'com.google.gms.google-services' version '4.3.8' apply false
   }
   

4. Tambahkan plugin google-services di tingkat aplikasi project Anda di build.gradle, seperti pada contoh kode berikut:

   plugins {
     id "com.android.application"
     id "kotlin-android"
     id "dev.flutter.flutter-gradle-plugin"
     id 'com.google.gms.google-services'  // google-services plugin
   }
   

5. Buat MyFirebaseMessagingService yang menerapkan FirebaseMessagingService, seperti dalam contoh kode berikut:

   class MyFirebaseMessagingService: FirebaseMessagingService() {
         private var firebaseTokenManager: FirebaseTokenManager? = null
   
         override fun onCreate() {
             super.onCreate()
             firebaseTokenManager = FirebaseTokenManager(this)
         }
   
         override fun onNewToken(token: String) {
             firebaseTokenManager?.updateToken(token)
         }
   
         override fun onMessageReceived(message: RemoteMessage) {
             if (Ujet.canHandlePush(message.data)) {
                 Log.d("Firebase", "Handle the push message by UJET")
             } else {
                 // Handle your notifications
             }
         }
     }
   

6. Buat FirebaseTokenManager, seperti dalam contoh kode berikut:

     class FirebaseTokenManager(context: Context) {
         private val sharedPreferences = context.getSharedPreferences("${context.packageName}_preferences", Context.MODE_PRIVATE)
         private var token: String? = null
   
         fun getToken(): String? {
             token = sharedPreferences.getString("firebaseToken", null)
             if (token == null) {
                 FirebaseMessaging.getInstance().token.addOnCompleteListener { task: Task<String?> ->
                     if (!task.isSuccessful || task.result == null) {
                         return@addOnCompleteListener
                     }
                     token = task.result
                     updateToken(token)
                 }
             }
             return token
         }
   
         fun updateToken(token: String?) {
             sharedPreferences
                 .edit()
                 .putString("firebaseToken", token)
                 .apply()
         }
     }