risposta-alla-domanda-sullo-sviluppo-web-bd.com

Google Chrome Mobile Emulator: come mostrare sulla tastiera dello schermo

Sto eseguendo il debug di una versione mobile del nostro sito Web tramite lo strumento di emulazione mobile di Chrome, ma non riesco a capire come far apparire una tastiera su schermo quando si seleziona un campo di testo.

Ho fatto clic sulla casella di testo, ma non viene visualizzata alcuna tastiera. Se lo faccio su un dispositivo mobile, viene visualizzato il metodo di input predefinito (tastiera) e mi consente di digitare.

C'è un modo per replicarlo?

74
Aaron Hellman

Ultimi Chrome hanno aggiunto il supporto per emulare diversi stati del dispositivo:

  • Interfaccia utente del browser predefinita
  • Con Chrome barra di navigazione
  • Con tastiera aperta

Secondo documentazione , tale funzione è disponibile solo durante l'emulazione "dispositivi supportati come Nexus 5X" .

L'elenco completo dei dispositivi emulati che supportano questa funzione è disponibile su Chromium source-code . Attualmente è supportato solo da:

  • Nexus 5
  • Nexus 5X

Nota che la tastiera e la barra di navigazione emulate sono solo immagini statiche (come puoi vedere nella directory del codice sorgente ) e non contengono alcun comportamento interattivo. È un modo abbastanza buono per simulare le dimensioni dello schermo, ma non è un'emulazione perfetta.

Screenshot of Chrome Developer Tools

114

Il più vicino che sono arrivato è usando l'estensione della tastiera virtuale da: "Chrome Virtual Keyboard"

Nota: ho dovuto impostarlo per utilizzare gli eventi touch durante l'utilizzo con un'app Sencha Touch su cui stavo lavorando.

Ce ne sono molti altri, quindi cerca "tastiera virtuale" nell'area chrome estensioni e scegli quello che ti piace.

14
AnthonyVO