android - 携帯電話のぼやけた/ピクセル化された画像

Question

私の phonegap アプリでは、リストビューに 240x240 の画像を表示し、80x80 にサイズ変更しています。これはうまく機能し、画像は鮮明です:

ただし、アプリの別の場所で、それらの画像も表示したいと考えています。もっとたくさん表示したいので、スプライトを使っています。それでも、スプライト要素 (スプライト内の 1 つの画像) は 240x240 であり、( を使用してbackground-size) 再度 80x80 にサイズ変更されますが、現在は次のようになります。

小さいサイズ (120x120 や 80x80 など) を使用して 80x80 にサイズ変更すると、ピクセル化されませんが、非常にぼやけます。説明した最初のケ​​ースとの唯一の違いは CSS スプライトを使用することですが、非常に多くのケースで使用されているため、これが問題になるとは考えられません。これを引き起こす原因と修正方法を知っている人はいますか?

Answer 1

偶然にも、問題の原因を見つけました: z-index.

div画像は、ラッピング内に存在する要素の背景画像として描画されますdiv。それらが上にあることを確認するために を与えるとz-index、ぼやけてしまいます。を削除するz-indexと、完全にレンダリングされます。

これは実際には Webkit エンジンのバグでしょうか?

Answer 2

Paintを使用している場合は、paintインスタンスを使用する前に次のことを確認してください。

paint.setAntiAlias(true);
paint.setDither(true);
paint.setFilterBitmap(true);

Answer 3

追加するborder-radius: 1%;とこれが修正されました