Algunos de los glyphicons Bootstrap3 no se muestran correctamente en la vista previa de phonegap android
Por favor, eche un vistazo a esta captura de pantalla adjunta . Es mi aplicación de prueba PhoneGap – tomada en un Galaxy S4.
Debería ver que los iconos de timbre, marcador, maletín y cámara (y más) no se muestran como se esperaba.
- Dropdowns de Bootstrap de Twitter Unclickable en tabletas
- Css-fix para la pantalla de saltar hacia arriba y hacia abajo cuando se desplaza en los dispositivos Android
- Twitter Bootstrap no funciona en Android WebView
- ¿Qué UI usar para Cordova Android / iPhone desarrollo de aplicaciones
- Twitter Bootstrap modal en dispositivos móviles
Aquí están mis observaciones:
- Todos los iconos se pueden mostrar correctamente en los navegadores (cromo, safari), tanto en PC como en dispositivos móviles
- Todos los iconos se pueden mostrar correctamente en la misma aplicación para ios (comprobado en iphone / ipad, ios7)
El "signo de interrogación" sólo se puede ver en una aplicación de Android.
¿Alguien sabe la razón por qué?
- Bootstrap 2.3 Problemas de menú plegables en Android Mobile
- Bootstrap navbar sensible a la lista desplegable no responde al tacto
- Diferentes diseños de cuadrícula para retrato y paisaje en bootstrap
- Tipo de entrada = número no es posible insertar números negativos en el teléfono móvil
- ¿Hay herramientas de interfaz de usuario personalizadas para Android?
- Bootstrap de Twitter: no se cambia el tamaño de la barra de navegación en el cambio de orientación (solo con el navegador de acciones de Android)
- Forzar la ocultación de la barra de direcciones en Chrome en Android
- Twitter Bootstrap desplegable en ipad y android no funciona incluso con el hack
Es un problema con las secuencias de escape. Si puede mantener de manera fiable un archivo CSS codificado con UTF-8, podría anular los valores predeterminados de Bootstrap para usar los glifos reales no escindidos.
(Dependiendo de su navegador, el código siguiente aparecerá para contener un montón de cajas.) Copiar el código y pegarlo en un documento UTF-8 debería conservar los valores.
@charset "UTF-8"; .glyphicon-bell:before { content: "🔔"; } .glyphicon-bookmark:before { content: "🔖"; } .glyphicon-briefcase:before { content: "💼"; } .glyphicon-calendar:before { content: "📅"; } .glyphicon-camera:before { content: "📷"; } .glyphicon-fire:before { content: "🔥"; } .glyphicon-lock:before { content: "🔒"; } .glyphicon-paperclip:before { content: "📎"; } .glyphicon-pushpin:before { content: "📌"; } .glyphicon-wrench:before { content: "🔧"; }
También puede cambiar las secuencias de escape para solucionar este problema, pero el soporte del navegador varía. Si solo tiene como objetivo Android / BlackBerry, lo siguiente debería funcionar correctamente:
.glyphicon-bell:before { content: "\d83d\dd14"; } .glyphicon-bookmark:before { content: "\d83d\dd16"; } .glyphicon-briefcase:before { content: "\d83d\dcbc"; } .glyphicon-calendar:before { content: "\d83d\dcc5"; } .glyphicon-camera:before { content: "\d83d\dcf7"; } .glyphicon-fire:before { content: "\d83d\dd25"; } .glyphicon-lock:before { content: "\d83d\dd12"; } .glyphicon-paperclip:before { content: "\d83d\dcce"; } .glyphicon-pushpin:before { content: "\d83d\dccc"; } .glyphicon-wrench:before { content: "\d83d\dd27"; }
Podría ser debido a la incompatibilidad entre la versión del archivo bootstrap min .css y los archivos de glifo.
- Lona: intentando usar un mapa de bits reciclado de Android
- Obtener objeto IntentSender para el método createChooser en Android