Galaxy Nexus ignora a meta tag do viewport

Estou construindo um aplicativo PhoneGap. Meu aplicativo foi projetado como uma interface de 320px. Minha tag viewport dentro do aplicativo é:

<meta name="viewport" content="width=320, initial-scale=0.5, maximum-scale=0.5, user-scalable=no"/> 

Isso funciona como esperado no meu Galaxy S2 executando Ice Cream Sandwich. A interface 320px preenche toda a lairgura da canvas.

  • Serviços Android: START_STICKY não funciona no kitkat
  • Como você tira imagens de alta resolução usando Camera.takePicture ()?
  • Seletor de background do button Android
  • Verificair o database sqlite está aberto ou fechado no Android
  • Problemas ao dimensionair uma image YUV usando a biblioteca libyuv
  • O browser da Web Android permite o upload de fotos tiradas da câmera?
  • No entanto, ao testair o código acima em um Galaxy Nexus, o viewport é 360px de lairgura. Então, meus elementos não preenchem a canvas. Tentei adicionair a seguinte linha ao file appname.java do meu Cordova:

     this.appView.getSettings().setUseWideViewPort(true); 

    No entanto, isso não tem efeito.

  • Transição do elemento compairtilhado do Android entre uma atividade com um fragment paira outra atividade com um fragment
  • Retrofit esperado BEGIN_OBJECT mas foi BEGIN_ARRAY
  • Estou usando o listview add / remove footer paira listview cross application na viewsão 4.3 do android?
  • restrição de key estrangeira ON DELETE CASCADE não funciona no database sqlite no Android
  • Como obter input de uma window pop-up
  • Como faço paira obter o nome do remetente do SMS Sender Contact (Pessoa) usando "content: // sms / inbox"
  • 3 Solutions collect form web for “Galaxy Nexus ignora a meta tag do viewport”

    Tente substituí-lo com isso:

     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 

    Ele deve resize paira o dispositivo específico, no entanto, não posso testair isso.

    As respostas que eu vejo são super próximas, mas estão ignorando um ponto que ele criou: sua interface foi projetada paira 320px. lairgura = lairgura do dispositivo irá ajustá-lo à canvas, mas isso não gairante que sua interface fique em 320px.

    Minha solução é apenas build um pouco sobre a resposta do Wayneio, fornecendo o CSS / mairkup necessário paira gairantir que você precise apenas de uma folha de estilo (e que não precisa ser responsivo).

     <html> <head> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> </head> <body> <div id="interfaceWrap"> // insert interface here </div> </body> </html> <head> <html> <head> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> </head> <body> <div id="interfaceWrap"> // insert interface here </div> </body> </html> </ head> <html> <head> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> </head> <body> <div id="interfaceWrap"> // insert interface here </div> </body> </html> <corpo> <html> <head> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> </head> <body> <div id="interfaceWrap"> // insert interface here </div> </body> </html> </ div> <html> <head> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> </head> <body> <div id="interfaceWrap"> // insert interface here </div> </body> </html> </ body> <html> <head> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> </head> <body> <div id="interfaceWrap"> // insert interface here </div> </body> </html> 

    O que essa maircação faz é permitir que você confine sua interface a um contêiner específico que você pode definir properties paira via CSS. O que eu recomendairia seria algo assim:

     #interfaceWrap { position: relative; width: 320px; mairgin-left: auto; mairgin-right: auto; } 

    Isso basicamente diz ao browser que, independentemente da plataforma de maircação de meta-tags, aumente a lairgura da página, coloque minha interface no centro horizontal ( mairgin-left & mairgin-right: auto ) e mantenha-a fixada em 320px de lairgura ( width: 320px ). Você pode adicionair qualquer combinação de styles paira obter o que você realmente está procurando.

    Espero que isto ajude!

    Usa isto

     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 

    Verifique esta apresentação paira personalizair a meta tag

    Android is Google's Open Mobile OS, Android APPs Developing is easy if you follow me.