我正在使用 Telerik 的 Kendo UI 框架开发一个 Android 应用程序。该应用程序在高密度视网膜屏幕 (Nexus 10) 上运行,剑道精灵看起来非常小。
文件夹中有一个高密度精灵 PNG - 例如:sprite.png 和 sprite_2x.png - 但似乎 Kendo 框架服务于低分辨率版本,尽管我在高分辨率屏幕上。
当我在应用程序中运行 : alert(window.devicePixelRatio) 时,我得到了值 2(高分辨率屏幕),但我仍然得到了低分辨率 sprite.png。
在 CSS 样式表中,有一个使用高分辨率精灵的定义
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min device-pixel-ratio: 2) {
.k-icon:not(.k-loading),
.k-grouping-dropclue,
.k-drop-hint,
.k-callout,
.k-tool-icon,
.k-state-hover .k-tool-icon,
.k-state-active .k-tool-icon,
.k-state-active.k-state-hover .k-tool-icon,
.k-column-menu .k-sprite,
.k-mobile-list .k-check:checked,
.k-mobile-list .k-edit-field [type=checkbox]:checked,
.k-mobile-list .k-edit-field [type=radio]:checked {
background-image: url('Metro/sprite_2x.png');
background-size: 340px 336px;
}
.k-dropdown-wrap .k-input,
.k-picker-wrap .k-input,
.k-numeric-wrap .k-input {
-moz-border-radius: 0 0 0 0;
-webkit-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
}
在 HTML 文件中,元视口定义如下:
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
有人知道可能是什么问题吗?
非常感谢