Voltar aos recursos
Painel webScreen Mirror5 min de leitura

Espelhamento de Tela no Painel Web

Veja e controle a tela do seu Android em um navegador — canvas ao vivo, tela cheia, modos de qualidade HD/Suave, controle remoto completo (toques, deslizes, rolagens, teclas de navegação), gravação e capturas de tela com um clique.

A visualização de Espelhamento de Tela no painel web renderiza a tela do seu Android em uma aba do navegador — e é o único lugar onde este recurso tem uma interface de usuário real. No lado do telefone não há uma tela dedicada de Espelhamento de Tela; um serviço em segundo plano começa a transmitir assim que você inicia uma sessão pelo navegador, e todos os controles estão aqui.

Como o stream é decodificado com WebCodecs e pintado em um <canvas>, a página deve ser servida em um contexto seguro (HTTPS ou localhost). O servidor local do PlainApp já atende a este requisito — mas se você de alguma forma carregou o painel por HTTP simples em um endereço que não seja localhost, a página mostra um aviso de precisa de HTTPS com um link para a URL segura em vez de tentar iniciar o stream.

Captura: Espelhamento de Tela

Principais recursos

  • Espelho de canvas ao vivo — os quadros são decodificados com WebCodecs e pintados em um elemento <canvas>. Sem plugin, sem cliente nativo — apenas o navegador.
  • Controle remoto completo — uma vez que o controle é ativado, clicar, arrastar e rolar no canvas é traduzido em toques reais, pressionamentos longos, deslizes e rolagens no telefone, normalizados para as coordenadas reais da tela. Botões dedicados enviam Voltar, Início e Recentes.
  • Modo tela cheia — expanda o canvas para preencher a tela; pressione Esc (ou o alternador na barra de ferramentas) para sair.
  • Modos de qualidade HD / Suave — alterne a qualidade no meio da sessão: HD prioriza nitidez, Suave troca resolução por menor latência em Wi-Fi congestionado.
  • Captura de tela — um clique baixa um .png do quadro atual.
  • Gravação de sessão — grave o canvas localmente em um arquivo de vídeo, com um cronômetro de gravação na barra de ferramentas.
  • Espelhamento de áudio — solicite passagem de áudio do telefone e silencie/ative o som independentemente no navegador.
  • Reiniciar e pausar — pause o stream para parar de consumir largura de banda sem encerrar a sessão, ou reinicie o serviço de espelhamento do telefone se ele travar.

Passo a passo

  1. Abra a página de Espelhamento de Tela na barra lateral do painel. Se o telefone não estiver espelhando no momento, clique em Iniciar para solicitar que o telefone comece a transmitir.
  2. Veja o espelho ao vivo — assim que o telefone conceder a permissão de captura de tela, os quadros aparecem no canvas dentro de um ou dois segundos.
  3. Ative o controle remoto na barra de ferramentas, depois clique, arraste ou role no canvas para interagir com o telefone como se o estivesse segurando — além de botões dedicados Voltar/Início/Recentes.
  4. Mude para tela cheia clicando no botão de tela cheia; pressione Esc para retornar ao layout do painel.
  5. Altere a qualidade com o alternador HD/Suave na barra de ferramentas — a mudança entra em vigor no próximo keyframe.
  6. Capture uma tela ou inicie uma gravação pela barra de ferramentas, e Pare quando terminar para encerrar a sessão.

Dicas e truques

  • Silencie o áudio na barra de ferramentas se estiver espelhando em um espaço compartilhado — isso afeta apenas seu navegador, não o alto-falante do telefone.
  • Pause sem desconectar clicando no botão de play/pause — útil quando você precisa ler uma tela estática sem consumir largura de banda com atualizações.
  • Reinicie o aplicativo na barra de ferramentas se o serviço de espelhamento no telefone tiver travado — isso o reinicia sem reinicializar o telefone.
  • As coordenadas do controle remoto são normalizadas para a resolução real do vídeo, então o controle ainda se alinha corretamente mesmo se você redimensionou a janela do navegador ou entrou em tela cheia.

Notas de privacidade e segurança

  • O painel web é servido sobre HTTPS com um certificado autoassinado, com todo o tráfego adicionalmente criptografado com XChaCha20-Poly1305 sobre TLS.
  • O painel web limita-se à sua rede local — não é acessível pela Internet a menos que você configure explicitamente o encaminhamento de portas.
  • A API WebCodecs exige este contexto seguro — a página mostra um aviso de precisa de HTTPS se ele estiver ausente.
  • A entrada de controle remoto só é aceita enquanto você a ativou explicitamente para a sessão — fechar ou parar o espelhamento revoga imediatamente.

Recursos relacionados