Android WebView псевдоним границы - PullRequest
4 голосов
/ 27 июля 2010

При использовании border-radius на моем эмуляторе Android я вижу безобразие, подобное этому:

радиус уродливой границы http://beautifulpixel.com/assets/5554_FastAndSmall-20100726-130326.png

Есть ли способ заставить Android отображать закругленные углы через * 1007?* более приятным способом?Большинство современных настольных браузеров и Mobile Safari, кажется, сглаживают свои углы, но не рендерер Android.

Я действительно надеюсь, что мне не нужно делать это с изображениями, и есть какой-то удивительный трюк, чтобы получить красивые углытолько css декларация радиуса границы.

Ответы [ 3 ]

6 голосов
/ 22 августа 2012

Мне действительно очень нужен был какой-то трюк, чтобы сделать радиус границы более гладким в браузере Android, поэтому я пришел к этому простому, но эффективному решению.Я просто добавил box-shadow, как показано ниже, в свой класс css:

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

Есть небольшая проблема, просто добавление этой строки кода в ваш css: да ... это будет нацелено на все браузеры -webkit, делаяграница с радиусом выглядит (немного) менее резкой.

В то время, когда я пишу это, я еще не думал о идеальном решении, но вы можете эффективно использовать медиазапросы, ограничивающие правило, которое вы используете.свойство 'max-width' (чтобы ограничить диапазон устройств на основе их ширины экрана, по крайней мере, для браузеров рабочего стола webkit) или '-webkit-device-pixel-ratio' для нацеливания на разные устройства Android на основе их плотности пикселей:

@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 */
}

С уважением и хорошим дизайном для всех.Надеюсь, что я помог такому отчаянному одержимому дизайнеру андроида с радиусом границы, как я;)

0 голосов
/ 17 марта 2016

Для простого отображения круга, используя преобразование вместе с -webkit-backface-visibility: hidden; согласно , этот ответ может помочь (хотя преобразования на дорогих устройствах Android дорогие).

0 голосов
/ 23 октября 2010

К сожалению, в текущем выпуске Android нет решения без изображения.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...