通过

你当前正在访问 Microsoft Azure Global Edition 技术文档网站。 如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站，请访问 https://docs.azure.cn。

在应用程序的 UI 库中注入自定义数据模型

  • 项目

Azure 通信服务使用与标识无关的模型，开发人员可以在其中自带标识。 开发人员可以获取其数据模型并将其链接到Azure 通信服务标识。 用户的数据模型最有可能包括显示名称、个人资料图片或头像等信息，以及其他详细信息。 开发人员使用此信息生成其应用程序和平台。

UI 库使你可以轻松地将用户数据模型注入 UI 组件。 呈现 UI 组件时，它们向用户显示所提供的信息，而不是来自Azure 通信服务的泛型信息。

先决条件

设置注入

有关 Web UI 库的详细文档和快速入门，请参阅 Web UI 库情节手册。

若要了解详细信息，请参阅 Web UI 库中的自定义用户数据模型 。

有关详细信息，请参阅 开源 Android UI 库 和 示例应用程序代码。

本地参与者视图自定义

UI 库使开发人员能够提供有关参与者信息的自定义体验。 在启动时，可以选择注入本地参与者数据。 此本地数据不会与服务器共享，你可以使用它自定义本地用户的显示名称和头像。

本地选项

CallCompositeLocalOptions 是可以具有 CallCompositeParticipantViewData 和 CallCompositeSetupScreenViewData 的数据模型。 它表示本地参与者。

默认情况下，对于远程参与者，UI 库显示 displayName 注入 RemoteOptions的信息。 此信息将发送到Azure 通信服务后端服务器。 如果 CallCompositeParticipantViewData 注入，则参与者 displayName 和 avatar 信息会显示在本地所有头像组件中。

同样，对于CallCompositeSetupScreenViewDatatitle和subtitle覆盖CallCompositeSetupScreenViewData导航栏的标题和副标题，分别在预提示屏幕上。 默认情况下，UI 库将安装程序显示为标题，不显示为副标题。

本地参与者查看数据

CallCompositeParticipantViewData是一个类，用于设置displayNameavatarBitmap和scaleType用于虚拟形象控件。 将此类传递给 CallCompositeLocalOptions 此类，以便自定义本地参与者的视图信息。 此类保存在对象中 CallCompositeLocalOptions ，该对象表示在进行调用的设备上本地使用的选项。

此实例displayName与通过以下方式CallCompositeRemoteOptions传递的信息不同displayName：

  • displayName实例CallCompositeParticipantViewData仅在本地用作替代。
  • displayName实例CallCompositeRemoteOptions传递到服务器并与其他参与者共享。

如果未提供 CallCompositeParticipantViewData 实例 displayName，则应用程序使用 CallCompositeRemoteOptions 实例 displayName。

设置屏幕视图数据

CallCompositeSetupScreenViewData 是一个对象，用于设置 title 呼叫 subtitle 设置屏幕上的导航栏。 如果未 subtitle 定义，则隐藏副标题。 title此处需要设置subtitle，但在subtitle设置时title是可选的。 此类是本地存储的，不会将其信息发送到服务器。

使用情况

若要使用CallCompositeLocalOptions，请传递和/或CallCompositeSetupScreenViewData的CallCompositeParticipantViewData实例并注入CallCompositeLocalOptions到 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)
设置视图 通话体验视图
Screenshot of Android data custom model injection. Screenshot of Android data custom model injection with name.

远程参与者视图自定义

在某些情况下，你可能想要为远程参与者提供本地替代，以允许自定义头像和游戏。

此过程类似于本地参与者进程，但在参与者加入呼叫时设置数据。 作为开发人员，在远程参与者加入呼叫时，需要添加侦听器，然后调用为这些远程用户设置 CallCompositeParticipantViewData 的方法。

使用情况

若要设置远程参与者的视图数据，请设置 setOnRemoteParticipantJoinedHandler。 在远程参与者加入时，用于setRemoteParticipantViewDatacallComposite为远程参与者注入视图数据。 参与者标识符 CommunicationIdentifier 唯一标识远程参与者。

调用以 setRemoteParticipantViewData 返回具有以下值的结果 CallCompositeSetParticipantViewDataResult：

  • CallCompositeSetParticipantViewDataResult.SUCCESS
  • CallCompositeSetParticipantViewDataResult.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
                }
            }
参与者列表
Screenshot of Android remote participant view data injection.

有关详细信息，请参阅 开源 iOS UI 库 和 示例应用程序代码。

本地参与者查看数据注入

UI 库使开发人员能够提供自定义体验。 在启动时，可以注入可选的本地数据选项。 此对象可以包含一个 UI 图像，该图像表示要呈现的虚拟形象和显示名称（可选）显示。 此信息都不会发送到Azure 通信服务。 它在本地保存在 UI 库中。

本地选项

LocalOptions 是一个数据模型，由 ParticipantViewData 和 SetupScreenViewData.

对于 ParticipantViewData，默认情况下，UI 库显示 displayName 注入 RemoteOptions的信息。 此信息将发送到Azure 通信服务后端服务器。 如果 ParticipantViewData 注入，则参与者 displayName 和 avatar 信息将显示在所有虚拟形象组件中。

对于SetupScreenViewData，默认情况下，UI 库将安装程序显示为标题，不显示为副标题。 subtitle前titleSetupScreenViewData提示屏幕上的标题和副标题分别覆盖导航栏的标题和副标题。

本地参与者查看数据

ParticipantViewData 是一个对象，用于设置 displayName 虚拟形象组件的 UI avatar 图像。 此类将注入 UI 库以设置虚拟形象信息。 它存储在本地，永远不会发送到服务器。

设置屏幕视图数据

SetupScreenViewData 是一个对象，用于设置 title 和 subtitle 设置预筛选屏幕上的导航栏（也称为设置视图）。 如果定义 SetupScreenViewData，则还必须提供 title ，因为它是必填字段。 但是， subtitle 不需要。

如果未定义 subtitle，则隐藏它。 此类是本地存储的，不会将其信息发送到服务器。

使用情况

// 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)
设置视图 通话体验视图
Screenshot of iOS data custom model injection. Screenshot of iOS data custom model injection with name.

远程参与者视图数据注入

在远程参与者加入时，可以为远程参与者注入视图数据。 此参与者视图数据可以包含一个 UI 图像，该图像表示要呈现的虚拟形象和要改为显示的显示名称。 此信息都不会发送到Azure 通信服务。 它在本地保存在 UI 库中。

使用情况

若要设置远程参与者的视图数据，请为事件处理程序设置 onRemoteParticipantJoined 完成。 在远程参与者加入时，用于set(remoteParticipantViewData:, for:, completionHandler:)CallComposite为远程参与者注入视图数据。 参与者标识符 CommunicationIdentifier 唯一标识远程参与者。 可以使用可选的完成处理程序返回集操作的结果。

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)")
      }
    }
  }
}
参与者列表
Screenshot of iOS remote participants view data injection.

后续步骤