Aliasing del borde de radio de WebView de Android

Cuando se utiliza border-radius en mi emulador de Android, veo la fealdad de esta manera:

Radio feo de la frontera http://beautifulpixel.com/assets/5554_FastAndSmall-20100726-130326.png

¿Hay -webkit-border-radius manera de conseguir que Android muestre esquinas redondeadas a través de -webkit-border-radius de una manera más agradable? La mayoría de los navegadores de escritorio modernos y Mobile Safari parecen antialias sus esquinas, pero no renderizador de Android.

Realmente espero que no tenga que hacer esto con imágenes, y hay un truco increíble para obtener curvas bonitas con solo una declaración de css de radio de borde.

De hecho, absolutamente necesario demasiado truco para hacer que el radio de la frontera se vea más suave en el navegador de Android, así que llegar a esta solución simple pero eficaz. Acabo de agregar cuadro-sombra como se muestra a continuación a mi clase css:

 -webkit-box-shadow: 0 0 1px #000; 

Hay un pequeño problema de sólo añadir esta línea de código a su css: sí … se centrará todos los navegadores -webkit, haciendo que el radio de la frontera parezca (ligeramente) menos agudo.

En el momento en que escribo esto no he pensado aún en la solución perfecta, pero puedes hacer buen uso de las consultas de medios que limitan la regla si usas la propiedad 'max-width' (para limitar el rango de dispositivos basados ​​en Su ancho de pantalla al menos los navegadores de escritorio webkit spearing) o el '-webkit-device-pixel-ratio' para orientar los diferentes dispositivos de Android en función de su densidad de píxeles:

 @media only screen and (-webkit-device-pixel-ratio:.75){ /*for low density (ldpi) Android layouts */ } @media only screen and (-webkit-device-pixel-ratio:1){ /*for low density (ldpi) Android layouts */ } @media only screen and (-webkit-device-pixel-ratio:1.5){ /*for low density (ldpi) Android layouts */ } 

Mejor consideración y buen diseño para todo el mundo. Espero que ayudó a algunos desesperados androide frontera radio obsesionado diseñador como yo también;)

No hay solución sin imágenes a esto en el actual lanzamiento de Android, por desgracia.

Para simplemente mostrar un círculo, usando una transformada junto con -webkit-backface-visibility: hidden; Como por esta respuesta podría ayudar (aunque las transformaciones son caras en dispositivos Android de gama baja).

  • ¿Cómo crear una vista web personalizada en Android?
  • Android - ¿Cómo reproducir video de Youtube en WebView?
  • Android WebView Javascript getSelection
  • Cómo habilitar las cookies en android webview?
  • Guardar datos desde un WebView
  • La mejor manera de interceptar una solicitud de WebView en Android
  • Tocar el campo de formulario en WebView no muestra el teclado virtual
  • ¿Cuál es la diferencia al crear un objeto WebView de Android con ContextWrapper y Context?
  • Habilitar el zoom en WebView android
  • Cómo obtener texto seleccionado en WebView Android
  • ¿Por qué mi youtube en webview reproduce sólo sonido?
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.