Question

我正在使用Telerik的Kendo UI框架开发Android应用程序。该应用程序在高密度视网膜屏幕（Nexus 10）上运行，而Kendo精灵看起来非常小。

文件夹中有一个高密度精灵PNG - 例如：sprite.png＆amp; sprite_2x.png - 但似乎Kendo框架服务于低分辨率版本，尽管我在高分辨率屏幕上。

当我在app中运行：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" />

有人知道可能是什么问题吗？

非常感谢

在Nexus 10上检测视网膜屏幕并使用高分辨率精灵XXX_2x.png

0 个答案: