Personnalisation de l'interface utilisateur — Android

Voici les réglages que vous pouvez effectuer pour personnaliser l'interface utilisateur des vidéos OpenTok :

Ajouter un nom à un flux publié

Vous pouvez spécifier le nom de l'éditeur en appelant la fonction name() de l'objet Publisher.Builder lorsque vous utilisez la méthode instanciation de l'objet Publisher:

mPublisher = new Publisher.Builder(context)
  .name("Bob's video")
  .build();

Vous pouvez utiliser ce nom pour identifier le client qui publie le flux. La classe Stream possède un élément name propriété. Lorsque vous s'abonner à un fluxvous pouvez afficher ce nom dans un élément de l'interface utilisateur.

Ne pas utiliser d'informations personnelles dans le champ "nom" de l'éditeur. — Le nom de l'éditeur peut être visible par les autres participants à la session et peut également apparaître dans l'outil « Inspector » ainsi que dans les journaux internes de Vonage ; par conséquent, vous ne devez en aucun cas utiliser d'informations sensibles ou personnelles non chiffrées dans le nom de l'éditeur. Consultez les bonnes pratiques en matière de sécurité.

Ajout d'un bouton de mise en sourdine pour un éditeur

Il n'y a pas d'élément d'interface utilisateur par défaut pour couper le microphone de l'éditeur. Cependant, vous pouvez ajouter un élément, tel qu'un bouton, qui appelle la fonction setPublishAudio() de l'objet PublisherKit lorsque l'utilisateur clique dessus. Passer en false pour mettre l'éditeur en sourdine :

mPublisher.setPublishAudio(false);

Entrer true pour publier des documents audio.

mPublisher.setPublishAudio(true);

Ajout d'un bouton de mise en sourdine pour un abonné

Il n'y a pas d'élément d'interface utilisateur par défaut pour couper le son de l'abonné. Cependant, vous pouvez ajouter un élément, tel qu'un bouton, qui appelle la fonction setSubscribeToAudio() de l'objet SubscriberKit lorsque l'utilisateur clique dessus. Transmettre à false pour mettre l'abonné en sourdine

mSubscriber.setSubscribeToAudio(false);

Entrer true pour s'abonner à l'audio (s'il y a un flux audio) :

mSubscriber.setSubscribeToAudio(true);

Ajout d'un bouton permettant de basculer l'appareil photo de l'éditeur

Il n'y a pas d'élément d'interface utilisateur par défaut pour basculer la caméra utilisée par l'éditeur. Cependant, vous pouvez ajouter un élément, tel qu'un bouton, qui appelle la fonction swapCamera de l'objet Publisher :

mPublisher.swapCamera();

Il convient de noter que le cameraPosition n'est pas disponible dans la classe PublisherKit. Si vous utilisez la classe PublisherKit pour mettre en œuvre un capteur vidéo personnalisévous pouvez définir la caméra utilisée dans le code de capture vidéo personnalisé.

Ajustement de l'interface utilisateur lorsque la vidéo est activée ou désactivée

Lorsque la vidéo d'un abonné est désactivée, l'application SubscriberKit.VideoListener.onVideoDisabled(subscriber, reason) est appelée. Dans ce cas, vous pouvez ajouter un élément d'interface utilisateur (tel qu'une icône) pour indiquer que la vidéo a été désactivée :

@Override
public void onVideoDisabled(SubscriberKit subscriber, String reason) {
    // Display the video disabled indicator
}

Lorsque la vidéo d'un abonné est réactivée, la fonction SubscriberKit.VideoListener.onVideoEnabled(subscriber, reason) est appelée. Dans ce cas, vous pouvez supprimer un élément de l'interface utilisateur (tel qu'une icône) qui indique que la vidéo est réactivée :

@Override
public void onVideoEnabled(SubscriberKit subscriber, String reason) {
    // Display the video disabled indicator
}

Dans les sessions qui utilisent l'option Routeur multimédia OpenTok (sessions dont le mode média est réglé sur routé), le SubscriberKit.VideoListener peut également appeler les méthodes suivantes :

  • onVideoDisableWarning(subscriber) — Le routeur multimédia OpenTok a détecté une baisse de la qualité du flux ; la vidéo sera désactivée si cette baisse se poursuit.
  • onVideoDisableWarningLifted(abonné) — Le routeur multimédia OpenTok a déterminé que la qualité du flux s'est suffisamment améliorée pour que la désactivation de la vidéo ne présente plus de risque immédiat.

Vous pouvez également afficher et supprimer une notification de l'interface utilisateur (telle qu'une icône) lorsque ces messages sont envoyés.

Notez que lorsque vous publiez un flux, vous activez ou désactivez la fonction de repli audio pour les éditeurs et les abonnés. La fonction de repli audio désactive la vidéo (chez les éditeurs et les abonnés) lorsque les conditions du réseau ou de la CPU ne permettent pas la diffusion vidéo. Voir Solution de secours audio (Android).

Si vous activez la solution de secours audio de l'éditeur, les méthodes de rappel de la PublisherKit.VideoListener sont invoquées pour les événements liés au repli audio de l'éditeur :

  • PublisherKit.VideoListener.onVideoDisabled(publisher, reason)
  • PublisherKit.VideoListener.onVideoDisabled(publisher, reason)
  • PublisherKit.VideoListener.onVideoDisableWarning(publisher)
  • PublisherKit.VideoListener.onVideoDisableWarningLifted(publisher)

Vous pouvez afficher des indicateurs d'interface utilisateur en réponse à ces événements.

Affichage d'un élément indicateur lorsqu'une session est en cours d'archivage

Lorsqu'une archive d'une session commence à enregistrer (ou si vous vous connectez à une session en cours d'enregistrement), l'icône Session.ArchiveListener.onArchiveStarted(session, name) est appelée. Lorsque l'enregistrement s'arrête, la méthode Session.ArchiveListener.onArchiveStopped(session, name) est appelée. Vous pouvez ajouter un élément d'interface utilisateur, tel qu'une icône affichée dans une vue éditeur, pour indiquer qu'une vidéo est en cours d'enregistrement :

@Override
public void onArchiveStarted(Session session, String id, String name) {
    // Display the archive indicator
}

@Override
public void onArchiveStopped(Session session, String id, String name) {
    // Hide the archive indicator
}

Ajustement de l'interface utilisateur en fonction des niveaux audio

Les SubscriberKit.AudioLevelListener.onAudioLevelUpdated(subscriber, audioLevel) et PublisherKit.AudioLevelListener.onAudioLevelUpdated(publsiher, audioLevel) Les messages sont envoyés à intervalles réguliers avec le niveau audio de l'abonné et de l'éditeur. Vous pouvez utiliser la fonction audioLevel pour actualiser l'affichage d'un indicateur de niveau audio :

@Override
public void onAudioLevelUpdated(
        SubscriberKit subscriber, float audioLevel) {
    // Adjust an audio meter UI element based on the audioLevel value.
}

Remarque : Le niveau audio d'un éditeur n'est disponible qu'une fois que son flux a été publié dans une session. Pour prévisualiser l'audio avant que l'éditeur ne commence à diffuser son flux vers la session, utilisez un pilote audio personnalisé.

Par défaut, pour des raisons de confidentialité, lorsque tous les éditeurs sont en sourdine, la capture audio s'arrête et le microphone est relâché. Cela signifie qu'il n'y aura plus de mises à jour du niveau audio jusqu'à ce qu'une instance d'éditeur active à nouveau l'audio. À partir de la version 2.31.0, l'éditeur est doté d'une propriété permettant de poursuivre la capture audio lorsque le son est coupé.

Lors de l'instanciation d'une nouvelle instance d'éditeur, le développeur peut activer ce comportement :

mPublisher = new Publisher.Builder(this).name(mUsername).allowAudioCaptureWhileMuted(true).build();

Note : En activant ce comportement, le microphone sera utilisé même si l'éditeur est en sourdine.

Utilisation d'un moteur de rendu vidéo personnalisé

Les classes Subscriber et Publisher mettent en œuvre un moteur de rendu vidéo standard qui rend le flux et fournit des commandes d'interface utilisateur pour l'affichage du nom du flux et la coupure du microphone ou de la caméra. Vous pouvez utiliser les classes SubscriberKit et PublisherKit pour mettre en œuvre un moteur de rendu vidéo personnalisé.

Le SDK Android d'OpenTok comprend une classe `BaseVideoRenderer`. Redéfinissez cette classe pour créer un moteur de rendu vidéo personnalisé.

Après avoir instancié un objet PublisherKit, vous pouvez définir un moteur de rendu vidéo personnalisé en appelant la fonction setRenderer() de l'objet PublisherKit :

mPublisher = new PublisherKit(MyClass.this, "publisher");

// Use a custom video renderer.
// MyVideoRenderer extends BaseVideoRenderer
mRenderer = new MyVideoRenderer();
mPublisher.setRenderer(new mRenderer);

La classe SubscriberKit possède également une fonction setRenderer() méthode.

Les onFrame() de la classe BaseVideoRenderer est appelée lorsqu'une nouvelle image est disponible :

    public void onFrame(Frame frame) {
        // The new frame is available.
    }

Les frame est un objet BaseVideoRenderer.Frame. Cet objet comprend un getBuffer() qui renvoie le tampon d'octets contenant les données de l'image vidéo. Vous pouvez utiliser ce tampon d'octets pour ajouter l'image de la trame vidéo à la vue de l'éditeur.

Pour un exemple, voir la classe OpenTokVideoRenderer dans l'exemple d'application OpenTokHelloWorld.

Vous pouvez également configurer un éditeur pour qu'il utilise un capteur vidéo personnalisé.