今回はCanvasを使ってみる。
<script type="text/javascript"> function paint1(){ var canvas = document.getElementById("screen"); var ctx = canvas.getContext('2d'); ctx.fillStyle = "rgb(255,0,0)"; ctx.fillRect(0, 0, 512, 384); } function paint2(){ var canvas = document.getElementById("screen"); var ctx = canvas.getContext('2d'); ctx.fillStyle = "rgb(0,255,0)"; ctx.fillRect(64, 64, 64, 64); ctx.fillRect(256, 256, 64, 64); } </script>
ボタンが2つあってクリックするとそれぞれpaint1、paint2を実行する。
paint1、paint2を順番にクリックするとFirefox4では以下のようになる。他のブラウザでも同じ。
しかし、WebViewだと以下のようになる。
2つの四角が収まる1つの範囲、つまりリペイントの範囲が背景色で塗りつぶされているようだ。
これは厳しい。リペイント周りはほかにもバグあるかも。
キーボード入力周りもバグあると思うけど、簡単なコード書いてみたらうまく再現できなかった。むぅ。