Lite SDK (Inscripción Android)

Esta página proporciona una guía sobre el Lite SDK Yuno Lite para la inscripción en Android. Este SDK ofrece un proceso de integración simplificado con la funcionalidad de inscripción esencial, por lo que es ideal para los comerciantes que:

• ¿Necesita una implementación rápida con requisitos mínimos de personalización?
• Desea centrarse principalmente en la inscripción en el método de pago
• Prefiera una interfaz de usuario lista para usar que gestione el flujo de inscripción

El Lite SDK incluye características principales como:

• Componentes de interfaz de usuario de inscripción predefinidos
• Proceso de inscripción de tarjetas
• Gestión básica del estado de inscripción
• Gestión de errores esenciales

Para los comerciantes que necesiten funciones más avanzadas, como múltiples métodos de pago, interfaz de usuario personalizada o prevención avanzada del fraude, considere la posibilidad de utilizar nuestro Full SDK completo.

Requisitos

Antes de comenzar la integración de Yuno Android SDK, asegúrate de que tu proyecto cumple los requisitos técnicos. Además, asegúrate de que se cumplen los siguientes requisitos previos:

• Debes tener una cuenta Yuno activa
• Necesitas tus credenciales de la API de Yuno (public-api-key), que puedes obtener en Sección de desarrolladores del panel de Yuno
• Antes de inscribir un método de pago, debe crear un cliente utilizando el endpoint Crear cliente

Paso 1: Crea un cliente

Cree un cliente en el sistema de Yuno utilizando la función Crear endpoint cliente antes de inscribir métodos de pago. Este endpoint devolverá un customer_id que utilizará para asociar los métodos de pago inscritos con el cliente específico.

El endpoint devolverá un customer_session que deberá utilizar al llamar a los métodos de inscripción.

Paso 2: Incluya la biblioteca en tu proyecto

Añade el Lite SDK de Yuno Lite a tu proyecto Android:

Añadir el repositorio

Añade el repositorio Maven de Yuno a la configuración Gradle de tu proyecto:

maven { url "https://yunopayments.jfrog.io/artifactory/snapshots-libs-release" }

Incluya el siguiente código en el archivo build.gradle para añadir la dependencia del SDK de Yuno a la aplicación:

dependencies {
    implementation 'com.yuno.payments:android-sdk:{last_version}'
}

Permisos

El SDK de Yuno incluye el INTERNET por defecto, necesario para realizar solicitudes de red.

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

Paso 3: Initialize el SDK con la clave pública

Initialize el SDK:

1. Obtén tu Clave Pública API desde el Panel de Control de Yuno
2. Cree una clase de aplicación personalizada si aún no lo ha hecho
3. En el onCreate() de tu clase de aplicación, llame a Yuno.initialize() con su clave API:

class CustomApplication : Application() {
  override fun onCreate() {
    super.onCreate()
    Yuno.initialize(
      this,
      PUBLIC_API_KEY,
      config: YunoConfig,
    )
  }
}

Usa la clase de datos YunoConfig para personalizar el comportamiento del SDK. Incluya esta configuración cuando llame a Yuno.initialize(). Las opciones disponibles son:

datos clase YunoConfig(
    val cardFlow: CardFormType = CardFormType.UN_Paso,
    val guardarTarjetaHabilitada: Boolean = false
    val keepLoader: Boolean = false
    val cardFormDeployed: Boolean = false
    val idioma: YunoLanguage? = null
    val estilos: YunoStyles? = null
)

La siguiente tabla describe cada opción de personalización:

También necesitas actualizar tu manifiesto para usar tu aplicación:

<application android:name=".CustomApplication"></application>

Paso 4: Inscribir un nuevo método de pago

El proceso de inscripción consta de dos pasos. Primero, inicializar el proceso para configurar los componentes necesarios. A continuación, inicie el flujo de la interfaz de usuario para que el usuario pueda inscribir un método de pago.

4.1 Initialize proceso de inscripción

Llame al initEnrollment dentro del método onCreate para preparar tu aplicación para gestionar el flujo de inscripción. Se trata de un paso de configuración obligatorio requerido por el sistema operativo Android para registrar el contrato que permite al SDK enviar el estado de inscripción final a tu aplicación.

fun ComponentActivity.initEnrollment(
   callbackEnrollmentState: ((¿Cadena?) -> Unidad)? = null
)

4.2 Iniciar el flujo de inscripción

Llame al startEnrollment para iniciar la interfaz de usuario y comenzar la inscripción de un nuevo método de pago. Puede llamar a este método en cualquier momento después de initEnrollment se ha ejecutado, como cuando un usuario pulsa un botón "Inscribir nuevo método de pago ".

fun Actividad.iniciarInscripción(
    clienteSesión: Cadena,
   countryCode: String
    mostrarEstadoInscripción: Boolean = true,
   callbackEnrollmentState: ((String?) -> Unit)? = null,
    códigoSolicitud: Int
)

En la tabla siguiente se describen los startEnrollment parámetros:

Estado de inscripción de devolución de llamada

El objeto callbackEnrollmentState es una función que devuelve el estado actual del proceso de inscripción. Proporcione esta función solo si desea realizar un seguimiento del estado de la inscripción.

Use el endpoint AppCompatActivity.enrollmentStatus() para comprobar el estado actual de la inscripción en cualquier momento. Esta función es opcional y acepta los mismos parámetros que startEnrollment. El siguiente bloque de código muestra la firma de la función:

fun AppCompatActivity.enrollmentStatus(
    clienteSesión: String,
   countryCode: String
    mostrarEstadoDeInscripción: Boolean = false
   callbackEnrollmentState: ((¿Cadena?) -> Unidad)? = null,
)

📘

Función opcional

Mediante la función enrollmentStatus es opcional. No es un requisito para completar el proceso de inscripción. Más información

🚧

Anulación de la devolución de llamada

Si proporciona una nueva devolución de llamada al llamar a la función enrollmentStatusanulará la llamada de retorno establecida al llamar a la función initEnrollment.

El siguiente bloque de código muestra los posibles estados:

const val ESTADO_INSCRIPCIÓN_SUCCEDIDO =SUCCEEDED"
const val ESTADO_INSCRIPCIÓN_FALLO = "FALLO"
const val ESTADO_INSCRIPCIÓN_PROCESANDO = "PROCESANDO"
const val ESTADO_INSCRIPCIÓN_RECHAZAR = "RECHAZAR"
const val ESTADO_INSCRIPCIÓN_ERROR_INTERNO = "ERROR_INTERNO"
const val ESTADO_INSCRIPCIÓN_CANCELADA_POR_USUARIO = "CANCELADA"

La siguiente tabla proporciona información adicional sobre los posibles estados:

Utilización de la OnActivityResult method

❗️

Método obsoleto

El objeto onActivityResult es una solución obsoleta. Si estás realizando una nueva integración Android, Yuno recomienda usar el método initEnrollment() contrato, que sigue las mejores prácticas de Google.

El método onActivityResult se invoca automáticamente cuando una actividad devuelve un resultado. Puede utilizar esta opción para ejecutar acciones siempre que cambie el estado de la inscripción. Siga estos pasos para procesar el resultado de la inscripción:

📘

Uso del código de pedido predeterminado

Si utiliza el onActivityResult pero no informó a requestCode al llamar al startEnrollment en el Paso 3, debe utilizar el YUNO_ENROLLMENT_REQUEST_CODE proporcionado por Yuno.

1. Anular el onActivityResult método. Esto garantiza que se respeten las llamadas jerárquicas.

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
}

2. Compruebe si el requestCode corresponde a YUNO_ENROLLMENT_REQUEST_CODE. Dado que está ejecutando Yuno en tu aplicación, puede importar el YUNO_ENROLLMENT_REQUEST_CODE para usarlo.

if (requestCode == YUNO_ENROLLMENT_REQUEST_CODE) {
}

3. Si el requestCode coincide, gestiona el resultado de la inscripción. Extrae el estado de inscripción utilizando el método YUNO_ENROLLMENT_RESULT proporcionada por la biblioteca Yuno. Cree una onEnrollmentStateChange para gestionar los cambios de estado.

onEnrollmentStateChange(data?.getStringExtra(YUNO_ENROLLMENT_RESULT))

El siguiente bloque de código muestra un ejemplo de código para utilizar la función OnActivityResult para ejecutar funciones cuando cambia el estado de inscripción:

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)

    if (requestCode == YUNO_ENROLLMENT_REQUEST_CODE) {
        val enrollmentState = data?.getStringExtra(YUNO_ENROLLMENT_RESULT)
        onEnrollmentStateChange(enrollmentState)
    }
}

fun onEnrollmentStateChange(enrollmentState: String?) {
    when (enrollmentState) {
        "SUCCEEDED" -> {
        }
        "FAIL" -> {
        }
    }
}

Paso 5: Obtener el estado de la inscripción

Llame al initEnrollment método en el onCreate de la actividad para registrar una llamada de retorno para obtener el estado final de la inscripción.

Características complementarias

Yuno Android SDK proporciona servicios y configuraciones adicionales que puedes utilizar para mejorar la experiencia de los clientes. Utiliza la personalización del SDK para cambiar la apariencia del SDK para que coincida con tu marca o para configurar el cargador.

styles

Con el styles puede definir estilos visuales globales a través de una opción de personalización YunoStyles objeto. Permite aplicar una imagen de marca consistente en todo el SDK personalizando la apariencia y la tipografía de los botones.

datos clase YunoStyles(
    val BotónEstilos: YunoButtonStyles? = null,
    val fontFamily: ¿FontFamily? = null
)

El objeto YunoButtonStyles El objeto le permite definir configuraciones específicas para la apariencia del botón:

datos clase YunoButtonStyles(
    val backgroundColor: Color? = null,
    val contentColor: Color? = null,
    val cornerRadius: ¿Dp? = null
    val elevación: ¿Dp? = null
    val relleno: ¿Dp? = null
    val fontFamily: FontFamily? = null
    val fontSize: TextUnit? = null
    val fontStyle: FontStyle? = null
)

Use el endpoint YunoConfig descrita en el paso 3, para utilizar la clase de datos styles opción de personalización.

Loader

La funcionalidad del cargador se controla a través del keepLoader en el parámetro YunoConfig que se documenta en línea en la sección de configuración del SDK.

Opciones de renderizado

Puede elegir entre dos opciones de representación de la forma de la tarjeta. Las siguientes capturas de pantalla muestran la diferencia entre cardFormType ONE_STEP y STEP_BY_STEP:

Personalización del SDK

Puede cambiar el aspecto del SDK para adaptarlo a su marca. Para obtener más información, consulte la página de personalización del SDK.

📘

App Demo

Además de los ejemplos de código proporcionados, puedes ver el repositorio de Yuno para completar la implementación de Yuno Android SDKs.

Modo de renderizado (inscripción)

El modo de renderizado del SDK de Yuno te permite integrar el flujo de inscripción con un control total de la interfaz de usuario, manteniendo la validación y la lógica del SDK. El SDK devuelve Android Fragment que puede mostrar tanto en Jetpack Compose (a través de AndroidView) como en los diseños XML tradicionales.

Función principal: startEnrollmentRender

fun Actividad.iniciarRenderizaciónInscripción(
    clienteSesión: String
   countryCode: String
    submitButton: Boolean = false,
    coroutineScope: CoroutineScope,
    oyente: YunoEnrollmentRenderListener
): YunoEnrollmentFragmentController

Parámetros

Valor de retorno

Devuelve un YunoEnrollmentFragmentController para controlar el flujo de inscripción (por ejemplo, enviar formularios).

Ejemplo de uso

class EnrollmentActivity : Activity() {

    private lateinit var fragmentController: YunoEnrollmentFragmentController

    private fun initializeEnrollment() {
        fragmentController = startEnrollmentRender(
            customerSession = "your_customer_session_id",
            countryCode = "US",
            submitButton = false,
            coroutineScope = lifecycleScope,
            listener = enrollmentRenderListener
        )
    }
}

Interfaz: YunoEnrollmentRenderListener

Implementa esta interfaz para recibir fragmentos de inscripción y eventos.

interface YunoEnrollmentRenderListener {
    fun showView(fragment: Fragment, needSubmit: Boolean)
    fun returnStatus(resultCode: Int, paymentStatus: String)
    fun loadingListener(isLoading: Boolean)
}

showView(fragmento: Fragmento, needSubmit: Boolean)

• Recibe el fragmento que se mostrará en su contenedor de interfaz de usuario
• needSubmit indica si debe mostrar su propio botón de envío (cuando submitButton = false)

Ejemplo (XML):

override fun showView(fragment: Fragment, needSubmit: Boolean) {
    supportFragmentManager.beginTransaction()
        .replace(R.id.enrollment_container, fragment)
        .commit()

    clientSubmitButton.isVisible = needSubmit
    if (needSubmit) {
        clientSubmitButton.setOnClickListener { fragmentController.submitForm() }
    }
}

returnStatus(resultCode: Int, paymentStatus: String)

• Evento de estado de inscripción final. Utilízalo para notificar al usuario el éxito o el fracaso

loadingListener(isLoading: Boolean)

• Carga de callback de estado para mostrar/ocultar spinners y desactivar/activar UI

override fun loadingListener(isLoading: Boolean) {
    progressBar.isVisible = isLoading
    clientSubmitButton.isEnabled = !isLoading
}

Interfaz: YunoEnrollmentFragmentController

Devuelto por startEnrollmentRender para controlar el flujo de inscripción.

interfaz YunoEnrollmentFragmentController {
    fun submitForm()
}

val fragmentController = iniciarEnrollmentRender(
    sesión_cliente = "tu_id_sesión_cliente",
   countryCode = "US",
    submitButton = false,
    coroutineScope = lifecycleScope,
    listener = enrollmentRenderListener
)

3. Controle el flujo (sométase cuando sea necesario):

fragmentController.submitForm()

Ventajas del modo Render

Flexibilidad de la interfaz de usuario

• Compatible con Compose (a través de AndroidView) y XML
• Control total sobre dónde y cómo se muestran las vistas
• Fácil de adaptar al sistema de diseño de tu aplicación

Control del caudal

• Temporización de envío personalizada mediante submitForm()

Consideraciones importantes

• Corbata coroutineScope a su ciclo de vida Actividad/Fragmento (por ejemplo, lifecycleScope)
• En needSubmit = true, cree su propio botón de envío y llame a submitForm()
• En Compose, coloque el fragmento en un AndroidView contenedor