Inserción de un modelo de datos personalizado en la biblioteca de interfaz de usuario para una aplicación
Azure Communication Services usa un modelo independiente de identidad en el que los desarrolladores pueden traer sus propias identidades. Los desarrolladores pueden obtener su modelo de datos y vincularlo a identidades de Azure Communication Services. El modelo de datos de un usuario probablemente incluye información como el nombre para mostrar, la imagen de perfil o el avatar, y otros detalles. Los desarrolladores usan esta información para compilar sus aplicaciones y plataformas.
La biblioteca de interfaz de usuario facilita la inserción de un modelo de datos de usuario en los componentes de la interfaz de usuario. Al representar los componentes de la interfaz de usuario, muestran a los usuarios la información proporcionada en lugar de la información genérica de Azure Communication Services.
Requisitos previos
- Una cuenta de Azure con una suscripción activa. Cree una cuenta gratuita.
- Un recurso de Communication Services implementado. Cree un recurso de Communication Services.
- Un token de acceso de usuario para habilitar el cliente de llamada. Obtenga un token de acceso de usuario.
- Opcional: Finalización del inicio rápido para empezar a trabajar con los compuestos de la biblioteca de interfaz de usuario.
Configuración de la inyección
Para obtener documentación detallada e inicios rápidos sobre la biblioteca de interfaz de usuario web, consulte el libro gráfico de la biblioteca de interfaz de usuario web.
Para más información, consulte Modelo de datos de usuario personalizado en la biblioteca de interfaz de usuario web.
Para obtener más información, consulte la biblioteca de interfaz de usuario de Android de código abierto y el código de aplicación de ejemplo.
Personalización de la vista del participante local
La biblioteca de interfaz de usuario ofrece a los desarrolladores la posibilidad de proporcionar una experiencia personalizada con respecto a la información de los participantes. En el inicio, puede insertar datos de participantes locales opcionalmente. Estos datos locales no se comparten con el servidor y puede usarlos para personalizar el nombre para mostrar y el avatar del usuario local.
Opciones locales
CallCompositeLocalOptions es el modelo de datos que puede tener CallCompositeParticipantViewData y CallCompositeSetupScreenViewData. Representa el participante local.
De forma predeterminada, para los participantes remotos, la biblioteca de interfaz de usuario muestra displayName información insertada en RemoteOptions. Esta información se envía al servidor back-end de Azure Communication Services. Si CallCompositeParticipantViewData se inserta, el participante displayName y avatar la información se muestran en todos los componentes del avatar localmente.
Del mismo modo, para CallCompositeSetupScreenViewDatay title subtitle en CallCompositeSetupScreenViewData sobrescribir el título y el subtítulo de la barra de navegación en la pantalla de eliminación previa, respectivamente. De forma predeterminada, la biblioteca de interfaz de usuario muestra el programa de instalación como título y nada como subtítulo.
Datos de la vista de participantes locales
CallCompositeParticipantViewData es una clase que establece displayName, avatarBitmapy scaleType para el control de avatar. Esta clase se pasa a CallCompositeLocalOptions para personalizar la información de vista de los participantes locales. Esta clase se mantiene en el CallCompositeLocalOptions objeto que representa las opciones usadas localmente en el dispositivo que realiza la llamada.
Esta instancia de difiere de displayName la displayName información que se pasa a través CallCompositeRemoteOptionsde :
- La
CallCompositeParticipantViewDatainstancia dedisplayNamesolo se usa localmente como invalidación. - La
CallCompositeRemoteOptionsinstancia dedisplayNamese pasa al servidor y se comparte con otros participantes.
Si no proporciona la CallCompositeParticipantViewData instancia de displayName, la aplicación usa la CallCompositeRemoteOptions instancia de displayName.
Configuración de datos de vista de pantalla
CallCompositeSetupScreenViewData es un objeto que establece title y subtitle para la barra de navegación en la pantalla de configuración de llamadas. Si subtitle no está definido, el subtítulo está oculto. Aquí es title necesario establecer subtitle, pero subtitle es opcional cuando title se establece . Esta clase se almacena localmente y su información no se envía al servidor.
Uso
Para usar CallCompositeLocalOptions, pase la instancia de CallCompositeParticipantViewData y/o CallCompositeSetupScreenViewDatae inserte CallCompositeLocalOptions en callComposite.launch.
val participantViewData: CallCompositeParticipantViewData = CallCompositeParticipantViewData()
.setAvatarBitmap((Bitmap) avatarBitmap)
.setScaleType((ImageView.ScaleType) scaleType)
.setDisplayName((String) displayName)
val setupScreenViewData: CallCompositeSetupScreenViewData = CallCompositeSetupScreenViewData()
.setTitle((String) title)
.setSubtitle((String) subTitle)
val localOptions: CallCompositeLocalOptions = CallCompositeLocalOptions()
.setParticipantViewData(participantViewData)
.setSetupScreenViewData(setupScreenViewData)
callComposite.launch(callLauncherActivity, remoteOptions, localOptions)
| Vista de configuración | Vista de experiencia de llamada |
|---|---|
|
|
Personalización de la vista de participantes remotos
En algunos casos, es posible que quiera proporcionar invalidaciones locales para que los participantes remotos permitan avatares y títulos personalizados.
El proceso es similar al proceso de participante local, pero los datos se establecen cuando los participantes se unen a la llamada. Como desarrollador, tendría que agregar un agente de escucha cuando los participantes remotos se unan a la llamada y, a continuación, llamar a un método para establecer CallCompositeParticipantViewData para esos usuarios remotos.
Uso
Para establecer los datos de vista de los participantes remotos, establezca setOnRemoteParticipantJoinedHandler. En la unión a participantes remotos, use setRemoteParticipantViewData para callComposite insertar datos de visualización de los participantes remotos. El identificador de participante CommunicationIdentifier identifica de forma única a un participante remoto.
Llama a para setRemoteParticipantViewData devolver un resultado de CallCompositeSetParticipantViewDataResult, que tiene los siguientes valores:
CallCompositeSetParticipantViewDataResult.SUCCESSCallCompositeSetParticipantViewDataResult.PARTICIPANT_NOT_IN_CALL
callComposite.addOnRemoteParticipantJoinedEventHandler { remoteParticipantJoinedEvent ->
remoteParticipantJoinedEvent.identifiers.forEach { identifier ->
// get displayName, bitmap for identifier
callComposite.setRemoteParticipantViewData(identifier,
CallCompositeParticipantViewData().setDisplayName("displayName")) // setAvatarBitmap for bitmap
}
}
| Lista de participantes |
|---|
|
Para obtener más información, consulte la biblioteca de interfaz de usuario de iOS de código abierto y el código de aplicación de ejemplo.
Inserción de datos de vista de participante local
La biblioteca de interfaz de usuario ofrece a los desarrolladores la capacidad de proporcionar una experiencia personalizada. En el inicio, puede insertar opciones de datos locales opcionales. Este objeto puede contener una imagen de interfaz de usuario que representa el avatar que se va a representar y un nombre para mostrar opcionalmente en su lugar. Ninguna de estas informaciones se envía a Azure Communication Services. Se mantiene localmente en la biblioteca de interfaz de usuario.
Opciones locales
LocalOptions es un modelo de datos que consta de ParticipantViewData y SetupScreenViewData.
Para ParticipantViewData, de forma predeterminada, la biblioteca de interfaz de usuario muestra displayName información insertada en RemoteOptions. Esta información se envía al servidor back-end de Azure Communication Services. Si ParticipantViewData se inserta, el participante displayName y avatar la información se muestran en todos los componentes del avatar.
Para SetupScreenViewData, de forma predeterminada, la biblioteca de interfaz de usuario muestra el programa de instalación como título y nada como subtítulo. La title información y subtitle en SetupScreenViewData sobrescribe el título y el subtítulo de la barra de navegación en la pantalla de eliminación previa, respectivamente.
Datos de la vista de participantes locales
ParticipantViewData es un objeto que establece la imagen de interfaz displayName de usuario y avatar para los componentes de avatar. Esta clase se inserta en la biblioteca de interfaz de usuario para establecer la información del avatar. Se almacena localmente y nunca se envía al servidor.
Configuración de datos de vista de pantalla
SetupScreenViewData es un objeto que establece title y subtitle para la barra de navegación en la pantalla de eliminación previa (también conocida como vista de configuración). Si define SetupScreenViewData, también debe proporcionar title porque es un campo obligatorio. Sin embargo, subtitle no es necesario.
Si no define subtitle, está oculto. Esta clase se almacena localmente y su información no se envía al servidor.
Uso
// LocalOptions (data not sent to the server)
let localParticipantViewData = ParticipantViewData(avatar: <Some UIImage>,
displayName: "<DISPLAY_NAME>")
let localSetupScreenViewData = SetupScreenViewData(title: "<NAV_TITLE>",
subtitle: "<NAV_SUBTITLE>")
let localOptions = LocalOptions(participantViewData: localParticipantViewData,
setupScreenViewData: localSetupScreenViewData)
// RemoteOptions (data sent to the server)
let remoteOptions = RemoteOptions(for: .groupCall(groupId: UUID()),
credential: <Some CommunicationTokenCredential>,
displayName: "<DISPLAY_NAME>")
// Launch
callComposite.launch(remoteOptions: remoteOptions, localOptions: localOptions)
| Vista de configuración | Vista de experiencia de llamada |
|---|---|
|
|
Inserción de datos de vista de participantes remotos
En la unión a participantes remotos, puede insertar los datos de vista para el participante remoto. Estos datos de vista de participante pueden contener una imagen de interfaz de usuario que representa el avatar que se va a representar y un nombre para mostrar opcionalmente en su lugar. Ninguna de estas informaciones se envía a Azure Communication Services. Se mantiene localmente en la biblioteca de interfaz de usuario.
Uso
Para establecer los datos de vista de los participantes remotos, establezca onRemoteParticipantJoined la finalización del controlador de eventos. En la unión a participantes remotos, use set(remoteParticipantViewData:, for:, completionHandler:) para CallComposite insertar datos de visualización de los participantes remotos. El identificador CommunicationIdentifier del participante identifica de forma única un participante remoto. Use el controlador de finalización opcional para devolver el resultado de la operación set.
callComposite.events.onRemoteParticipantJoined = { [weak callComposite] identifiers in
for identifier in identifiers {
// map identifier to displayName
let participantViewData = ParticipantViewData(displayName: "<DISPLAY_NAME>")
callComposite?.set(remoteParticipantViewData: participantViewData,
for: identifier) { result in
switch result {
case .success:
print("Set participant view data succeeded")
case .failure(let error):
print("Set participant view data failed with \(error)")
}
}
}
}
| Lista de participantes |
|---|
|