Flutter para Android

Puedes configurar apps para dispositivos móviles para que funcionen con Contact Center AI Platform (CCAI Platform) de varias maneras, incluso con Flutter. En esta página, se muestra cómo integrar el SDK de Android en una app para Android con Flutter.

Antes de comenzar

Antes de seguir las instrucciones de esta página, primero debes seguir las instrucciones en Integración con Flutter.

Integra el SDK en una app para Android

Para integrar el SDK en una app para Android, sigue estos pasos:

1. En el archivo android/build.gradle del directorio de ejemplo de Flutter, actualiza minSdkVersion a 21 o una versión posterior.

2. En el archivo android/src/main/AndroidManifest.xml, agrega lo siguiente:

   <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. En la etiqueta <application>, actualiza el valor android:name a .Application, como en el siguiente muestra de código:

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

4. Actualiza android/build.gradle, como en el siguiente muestra de código:

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

5. Actualiza android/app/build.gradle, como en el siguiente muestra de código:

   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. Actualiza res/values/strings.xml, como en el siguiente muestra de código. Crea este directorio si no existe.

   <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. Crea un proyecto de Firebase o, si ya tienes uno, registra esta app. Descarga el archivo google-service.json y colócalo en tu proyecto en el siguiente directorio: example/android/app/.

Registra el módulo

Para registrar el módulo, abre MainActivity.kt y, luego, inicializa UJETModule, como se muestra en el siguiente muestra de código:

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

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

Cómo configurar las notificaciones push de Android

Sigue estos pasos si deseas integrar las notificaciones push de forma nativa. Asegúrate de haber copiado y pegado el directorio de Firebase en tu proyecto de Android, como se indica en Integra el SDK en una app para Android.

Para configurar las notificaciones push de Android, sigue estos pasos:

1. Agrega una dependencia de Firebase para las notificaciones push en tu archivo build.gradle a nivel de la app, como en el siguiente muestra de código:

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

2. Actualiza AndroidManifest.xml, como en el siguiente muestra de código:

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

3. Agrega un complemento de google-services en el nivel raíz de tu proyecto en build.gradle, como en la siguiente muestra de código:

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

4. Agrega un complemento de google-services a nivel de la app de tu proyecto en build.gradle, como en el siguiente muestra de código:

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

5. Crea MyFirebaseMessagingService que implemente FirebaseMessagingService, como en el siguiente muestra de código:

   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. Crea FirebaseTokenManager, como en el siguiente muestra de código:

     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()
         }
     }