Observação
O acesso a essa página exige autorização. Você pode tentar entrar ou alterar diretórios.
O acesso a essa página exige autorização. Você pode tentar alterar os diretórios.
Utilize a ferramenta Sensores para emular a entrada do sensor de qualquer dispositivo.
Visão geral
A ferramenta Sensores permite-lhe fazer o seguinte:
- Substituir geolocalização
- Simular a orientação do dispositivo
- Simular eventos táteis ao clicar
- Emular o estado do detetor inativo
- Emular simultaneidade de hardware
- Emular pressão da CPU
Para simular um viewport de um dispositivo móvel e limitar a rede e a CPU, veja Emular dispositivos móveis (Emulação do Dispositivo).
Abrir a ferramenta Sensores
Abra uma página Web, como a página de demonstração da aplicação TODO , numa nova janela ou separador.
Clique com o botão direito do rato na página Web e, em seguida, selecione Inspecionar.
O DevTools é aberto.
Prima Esc uma ou duas vezes para que o painel Vista Rápida esteja aberto na parte inferior de DevTools.
No painel Vista Rápida , clique no botão Mais ferramentas e, em seguida, selecione Sensores.
A ferramenta Sensores é aberta no painel Vista Rápida na parte inferior das DevTools.
Abra a ferramenta Sensores com o Menu de Comandos
Dependendo do seu sistema operativo, prima o seguinte para abrir o Menu de Comandos:
- No Windows, Linux ou ChromeOS, Controlo+Shift+P.
- No MacOS, Comando+Shift+P.
Escreva sensores, selecione Mostrar Sensores e, em seguida, prima Enter.
A ferramenta Sensores é aberta na Vista Rápida na parte inferior do DevTools.
Substituir geolocalização
Muitos sites tiram partido da localização do utilizador para proporcionar uma experiência mais relevante aos seus utilizadores. Por exemplo, um site de meteorologia pode mostrar a previsão local para a área de um utilizador, assim que o utilizador tiver concedido permissão ao site para aceder à respetiva localização. Para aceder à geolocalização de um utilizador a partir do seu site, veja API de Geolocalização, na MDN.
Se estiver a criar uma IU que muda consoante a localização do utilizador, é provável que queira certificar-se de que o site se comporta corretamente em diferentes locais do mundo.
Para substituir a geolocalização, abra a ferramenta Sensores e, na lista Localização , selecione uma das seguintes opções:
- Uma das cidades predefinidas, como Tóquio.
- Outro para introduzir coordenadas de longitude e latitude personalizadas.
- Selecione Localização indisponível para ver o comportamento do site quando a localização do utilizador não está disponível.
Simular a orientação do dispositivo
Os dispositivos móveis têm sensores que podem detetar a orientação física. Sites como jogos baseados na Web ou aplicações de mapeamento podem utilizar a orientação do dispositivo para proporcionar uma melhor experiência. Para saber mais sobre como detetar a orientação do dispositivo, veja Eventos de orientação do dispositivo, no MDN.
Se estiver a criar uma IU que é alterada consoante a orientação do dispositivo do utilizador, tem de testar a IU em orientações diferentes do dispositivo.
Para simular orientações diferentes do dispositivo, abra a ferramenta Sensores e, em seguida, na lista Orientação , selecione uma das seguintes opções:
Uma das orientações predefinidas, como Vertical de cabeça para baixo:
Orientação personalizada, para fornecer a sua própria orientação exata.
Depois de selecionar Orientação personalizada, os campos alfa, beta e gama são ativados. Para compreender como estes eixos funcionam, consulte:
- DeviceOrientationEvent: propriedade alfa
- DeviceOrientationEvent: propriedade beta
- DeviceOrientationEvent: propriedade gama
Depois de selecionar Orientação personalizada, também pode definir uma orientação personalizada ao arrastar o Modelo de Orientação. Mantenha premida a tecla Shift antes de arrastar, para rodar ao longo do eixo alfa:
Simular eventos táteis ao clicar
Para testar eventos táteis no seu site, mesmo que esteja a testar num dispositivo sem ecrã tátil:
Abra uma página Web, como a página de demonstração da aplicação TODO , numa nova janela ou separador.
Clique com o botão direito do rato na página Web e, em seguida, selecione Inspecionar.
O DevTools é aberto.
Prima Esc uma ou duas vezes para que o painel Vista Rápida esteja aberto na parte inferior de DevTools.
No painel Vista Rápida , clique no botão Mais ferramentas e, em seguida, selecione Sensores.
A ferramenta Sensores é aberta no painel Vista Rápida na parte inferior das DevTools.
Na ferramenta Sensores , desloque-se para baixo até ao menu pendente Toque e, em seguida, selecione Forçar ativado:
Clique no botão Recarregar DevTools na parte superior de DevTools.
Emular o estado do detetor inativo
A API de Deteção inativa permite-lhe detetar utilizadores inativos e reagir em alterações de estado inativo. Com as DevTools, pode emular alterações de estado inativo para o estado do utilizador e o estado do ecrã em vez de aguardar que o estado inativo real seja alterado.
Para emular estados inativos:
Abra uma página Web, como a Demonstração de deteção de inatividade, numa nova janela ou separador.
Clique com o botão direito do rato na página e, em seguida, selecione Inspecionar.
O DevTools é aberto.
Prima Esc uma ou duas vezes para que a Vista Rápida seja aberta na parte inferior de DevTools.
Na barra de ferramentas Vista Rápida , clique no botão Mais ferramentas e, em seguida, selecione Sensores.
A ferramenta Sensores é aberta no painel Vista Rápida .
Na página de demonstração, clique no botão Iniciar deteção de estado inativo .
Apenas na primeira vez, é aberta uma caixa de diálogo Permitir .
Clique no botão Permitir .
É concedida a permissão de deteção de inatividade à página de demonstração.
Em DevTools, na ferramenta Sensores , desloque-se para baixo até ao menu pendente Emular estado do Detetor Inativo e, em seguida, selecione uma opção:
- Sem emulação inativa
- Utilizador ativo, ecrã desbloqueado
- Utilizador ativo, ecrã bloqueado
- Utilizador inativo, ecrã desbloqueado
- Utilizador inativo, ecrã bloqueado
A página de demonstração apresenta os estados de utilizador e ecrã emulados:
Consulte também:
Emular simultaneidade de hardware
Para emular o desempenho do seu site em dispositivos com diferentes números de núcleos de processador, pode substituir o valor comunicado pela propriedade navigator.hardwareConcurrency . Algumas aplicações utilizam esta propriedade para controlar o grau de paralelismo da respetiva aplicação, por exemplo, para controlar o tamanho do conjunto Emscripten pthread .
Para emular a simultaneidade do hardware:
Abra uma página Web, como a página de demonstração da aplicação TODO , numa nova janela ou separador.
Clique com o botão direito do rato na página Web e, em seguida, selecione Inspecionar.
O DevTools é aberto.
Prima Esc uma ou duas vezes para que o painel Vista Rápida esteja aberto na parte inferior de DevTools.
No painel Vista Rápida , clique no botão Mais ferramentas e, em seguida, selecione Sensores.
A ferramenta Sensores é aberta no painel Vista Rápida na parte inferior das DevTools.
Na ferramenta Sensores , desloque-se para baixo até à caixa de verificação Simultaneidade do hardware e, em seguida, selecione-a.
Na caixa de entrada de número, introduza o número de núcleos que pretende emular:
Atenção: exceder o valor predefinido pode degradar o desempenho.
Para reverter para o valor predefinido, clique no botão Repor (
).
Emular pressão da CPU
A pressão da CPU ou da computação é um conjunto de estados comunicados que lhe dão uma ideia da quantidade de carga de trabalho em que a computação do sistema está a ser submetida e se está perto do limite. Estas informações permitem-lhe adaptar a sua aplicação em tempo real, por exemplo, videoconferências ou videojogos, para tirar partido de todo o poder de processamento disponível, mantendo o sistema reativo ao adaptar as cargas de trabalho em tempo real.
A ferramenta Sensores permite-lhe emular os estados que podem ser comunicados pela API de Pressão de Computação.
Para emular a pressão da CPU no seu site:
Abra uma página Web, como a página de demonstração da aplicação TODO , numa nova janela ou separador.
Clique com o botão direito do rato na página Web e, em seguida, selecione Inspecionar.
O DevTools é aberto.
Prima Esc uma ou duas vezes para que o painel Vista Rápida esteja aberto na parte inferior de DevTools.
No painel Vista Rápida , clique no botão Mais ferramentas e, em seguida, selecione Sensores.
A ferramenta Sensores é aberta no painel Vista Rápida na parte inferior das DevTools.
Na ferramenta Sensores , desloque-se para baixo até à secção de pressão da CPU e, em seguida, selecione um dos estados de pressão legíveis por humanos:
- Sem substituição
- Nominal
- Justo
- Grave
- Crítico
Na parte superior de DevTools, clique no botão Recarregar DevTools :
Consulte também
MDN:
API de Pressão de Computação na MDN.
- Estados de pressão na API de Pressão de Computação.
Demonstrações:
Web.dev:
Emscripten:
Observação
Partes desta página são modificações baseadas no trabalho criado e compartilhado pelo Google e usadas de acordo com os termos descritos na Licença Pública Creative Commons Atribuição 4.0 Internacional. A página original é encontrada aqui e é da autoria de Kayce Bascos e Sofia Emelianova.
Este trabalho é licenciado ao abrigo de uma Licença Internacional creative Commons Attribution 4.0.