Personalização da interface do usuário — Android

Estas são as configurações que você pode fazer para personalizar a interface do usuário dos vídeos do OpenTok:

Adicionar um nome a um stream publicado

Você pode especificar o nome da editora chamando a função name() método do objeto Publisher.Builder quando você instanciar o objeto Publisher:

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

Você pode usar esse nome para identificar o cliente que está publicando o fluxo. A classe Stream possui um name propriedade. Quando você inscrever-se em um canal, você pode exibir esse nome em um elemento da interface do usuário.

Não utilize informações pessoais no campo “nome” do editor — o nome do editor pode ser exibido para outros participantes da sessão e também pode aparecer na Ferramenta de Inspeção e nos registros internos da Vonage; portanto, você nunca deve usar informações confidenciais ou pessoais não criptografadas no nome do editor. Veja as melhores práticas de segurança.

Adicionar um botão de silenciar para um editor

Não há nenhum elemento padrão da interface do usuário para silenciar o microfone do apresentador. No entanto, é possível adicionar um elemento, como um botão, que acione o setPublishAudio() método do objeto PublisherKit quando o usuário clica nele. Passe false para silenciar o editor:

mPublisher.setPublishAudio(false);

Passe para true para publicar áudio.

mPublisher.setPublishAudio(true);

Adicionar um botão de silenciar para um assinante

Não há nenhum elemento padrão da interface do usuário para silenciar o áudio do assinante. No entanto, é possível adicionar um elemento, como um botão, que chame a função setSubscribeToAudio() método do objeto SubscriberKit quando o usuário clica nele. Passe false para silenciar o assinante

mSubscriber.setSubscribeToAudio(false);

Passe para true para se inscrever no áudio (se houver uma transmissão de áudio):

mSubscriber.setSubscribeToAudio(true);

Adicionar um botão para ativar/desativar a câmera do editor

Não há nenhum elemento padrão da interface do usuário para alternar a câmera utilizada pelo editor. No entanto, é possível adicionar um elemento, como um botão, que chame a swapCamera método do objeto Publisher:

mPublisher.swapCamera();

Observe que o cameraPosition A propriedade não está disponível na classe PublisherKit. Se você estiver usando a classe PublisherKit para implementar um capturador de vídeo personalizado, você pode definir a câmera a ser usada no código personalizado de captura de vídeo.

Ajustar a interface do usuário quando o vídeo estiver ativado ou desativado

Quando o vídeo de um assinante é desativado, o SubscriberKit.VideoListener.onVideoDisabled(subscriber, reason) o método é chamado. Quando isso ocorre, você pode adicionar um elemento da interface do usuário (como um ícone) para indicar que o vídeo foi desativado:

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

Quando o vídeo de um assinante é reativado, o SubscriberKit.VideoListener.onVideoEnabled(subscriber, reason) o método é chamado. Quando isso ocorre, você pode remover um elemento da interface do usuário (como um ícone) que indique que o vídeo foi reativado:

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

Em sessões que utilizam o Roteador de mídia OpenTok (sessões com o modo de mídia definido como “routed”), o SubscriberKit.VideoListener também pode chamar os seguintes métodos:

  • onVideoDisableWarning(assinante) — O OpenTok Media Router detectou que a qualidade da transmissão diminuiu e o vídeo será desativado caso a qualidade continue a piorar.
  • onVideoDisableWarningLifted(assinante) — O OpenTok Media Router constatou que a qualidade da transmissão melhorou a ponto de a interrupção do vídeo não representar um risco imediato.

Você também pode querer exibir e remover uma notificação na interface do usuário (como um ícone) quando essas mensagens forem enviadas.

Observe que, ao publicar um stream, você ativa ou desativa o recurso de fallback de áudio para emissores e assinantes. O recurso de fallback de áudio desativa o vídeo (tanto nos emissores quanto nos assinantes) quando as condições da rede ou da CPU não permitem a exibição do vídeo. Consulte Opção alternativa de áudio (Android).

Se você ativar o fallback de áudio do editor, os métodos de retorno de chamada do PublisherKit.VideoListener são invocados para eventos relacionados ao fallback de áudio do editor:

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

É possível exibir indicadores da interface do usuário em resposta a esses eventos.

Exibição de um elemento indicador quando uma sessão está sendo arquivada

Quando a gravação de uma sessão é iniciada (ou se você se conectar a uma sessão que está sendo gravada), o Session.ArchiveListener.onArchiveStarted(session, name) método é chamado. Quando a gravação é interrompida, o Session.ArchiveListener.onArchiveStopped(session, name) o método é chamado. Você pode adicionar um elemento de interface do usuário, como um ícone exibido na visualização do editor, para indicar que um vídeo está sendo gravado:

@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
}

Ajuste da interface do usuário com base nos níveis de áudio

O SubscriberKit.AudioLevelListener.onAudioLevelUpdated(subscriber, audioLevel) e PublisherKit.AudioLevelListener.onAudioLevelUpdated(publsiher, audioLevel) As mensagens são enviadas em intervalos regulares com o nível de áudio do assinante e do emissor. Você pode usar o audioLevel valor para atualizar a exibição em um medidor de nível de áudio:

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

Observação: O nível de áudio de um emissor não fica disponível até que seu fluxo seja publicado em uma sessão. Para obter uma prévia do áudio antes que o emissor comece a transmitir para a sessão, use um driver de áudio personalizado.

Por padrão, por motivos de privacidade, quando todos os editores estão silenciados, a captura de áudio é interrompida e o microfone é liberado. Isso significa que não haverá mais atualizações no nível de áudio até que uma instância do editor reative o áudio. A partir da versão 2.31.0, o editor conta com uma propriedade que permite que a captura de áudio continue mesmo quando silenciado.

Ao instanciar uma nova instância do publisher, o desenvolvedor pode ativar esse comportamento:

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

Observação: Ao ativar esse recurso, o microfone será utilizado mesmo quando o emissor estiver silenciado.

Utilizando um renderizador de vídeo personalizado

As classes `Subscriber` e `Publisher` implementam um renderizador de vídeo padrão que exibe o stream e fornece controles da interface do usuário para mostrar o nome do stream e silenciar o microfone ou a câmera. É possível usar as classes `SubscriberKit` e `PublisherKit` para implementar um renderizador de vídeo personalizado.

O SDK do OpenTok para Android inclui uma classe chamada BaseVideoRenderer. Sobrescreva essa classe para criar um renderizador de vídeo personalizado.

Após instanciar um objeto PublisherKit, você pode definir um renderizador de vídeo personalizado chamando o setRenderer() método do objeto PublisherKit:

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

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

A classe SubscriberKit também possui um setRenderer() método.

O onFrame() O método da classe BaseVideoRenderer é chamado quando um novo quadro fica disponível:

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

O frame é um objeto BaseVideoRenderer.Frame. Esse objeto inclui um getBuffer() que retorna o buffer de bytes contendo os dados do quadro de vídeo. Você pode usar esse buffer de bytes para adicionar a imagem do quadro de vídeo à visualização do editor.

Como exemplo, consulte a classe `OpenTokVideoRenderer` no aplicativo de exemplo `OpenTokHelloWorld`.

Você também pode configurar um editor para usar um capturador de vídeo personalizado.