4

生のピクセル操作をしようとしていますが、アルファ チャネルを設定すると、Android デバイスで非常に一貫性のない結果が表示されます。私が見ている種類の簡単な例：

<canvas id='canvas' width='128' height='128'></canvas>

var ctx = $("#canvas")[0].getContext('2d');
var image = ctx.getImageData(0, 0, 128, 128);

var idx = 0;
for (var y=0; y < 128; ++y) {
    for (var x=0; x < 128; ++x) {
        image.data[idx+0] = 128;
        image.data[idx+1] = 128;
        image.data[idx+2] = 128;
        image.data[idx+3] = (x+y);
        idx += 4;
    }
}

ctx.putImageData(image, 0, 0);

コードはこちらからも入手できます: http://jsfiddle.net/U3rwY/

上記のコードの意図は、アルファが 0 から 255 まで増加する灰色の正方形を作成することです。そのため、下隅で背景色から灰色にフェードする正方形が表示されるはずです。これは、最新のデスクトップ ブラウザで見られるものとまったく同じです。

デスクトップ ブラウザ

Androidではこれが表示されますが：

Android ブラウザ

これは、私が与えている 128,128,128 ではなく、事前に計算された色を期待しているようです。それは正しいですか?もしそうなら、どのブラウザがどの値のセットを期待しているかを検出する信頼できる方法はありますか?

4

2 に答える 2

2

Android のデフォルト ブラウザのバグが問題の原因である可能性があります。0 または 255 とは異なるアルファ値を含むピクセルを描画すると、色が変わります。この問題が発生しているのはあなただけではありません: https://code.google.com/p/android/issues/detail?id=17565

それを解決する唯一のチャンスは、バグを報告することだと思います。また、バグはandroid 4.1で部分的に修正されたようです（4.0にはまだあります）。

于 2013-05-24T03:50:12.083 に答える