作者yabibear (yabi)
看板Ajax
標題[問題] canvas繪圖無法在APP運作 在網頁上正常
時間Wed Jun 8 18:26:54 2016
請問有沒有人也用過phonegap(cordova)+Visual stdio 2015開發APP，
目前需要用到canvas的繪圖功能，
先試著照範例畫個簡單的矩形，
但是在genymotion模擬器的APP上完全沒有作用，
不過將建置產生的html檔用瀏覽器執行的話就正常了，
這樣會是哪邊發生問題呢?
謝謝。
我好像發現原因了，又去找了不同網站的範例，
結果只有範例二可以在APP上WORK。
第一個範例畫矩形的方式好像是利用css決定他要畫什麼
<style type="text/css">
canvas { border: 1px solid black; }
</style>
在body部分只有指定id、width、height
script部分也只有取得渲染環境
var ctx = canvas.getContext('2d');
-------------------------------------------------
第二個範例的方式
body部分(畫矩形)
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #000;">
----------------------------------------------
script部分(畫圓)
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.arc(95, 50, 50, 0, 2*Math.PI);
ctx.stroke();
所以除了width、height之外 CSS的部分好像也不能用來決定要畫什麼(在APP上)。
我這樣的理解對嗎?
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 140.116.164.175
※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1465381617.A.193.html
推 shadowjohn: phonegap+eclipse or xcode上實作canvas是可 06/08 20:28
→ shadowjohn: vs2015倒是沒拿來編過app 06/08 20:28
→ shadowjohn: 你的<!doctype html> 注意一下 06/08 20:29
→ shadowjohn: 然後canvas一定要dom出才畫，不可臨時改大小 06/08 20:29
推 shadowjohn: 如果是eclipse，hardware acceleration有影響的 06/08 20:32
→ yabibear: 感謝S大 我先研究一下DOM的部分 06/08 20:51
→ yabibear: 請問在<body>的部分寫<canvas id="" width=....> 06/08 21:27
→ yabibear: 這樣是不是就產生了DOM 06/08 21:28
推 shadowjohn: $(dom).width、height皆要先設好，非css的 06/08 21:28
→ yabibear: 在<script>用document.getElementById調用這個DOM 06/08 21:28
※ 編輯: yabibear (140.116.164.175), 06/08/2016 22:03:25
→ rarex: 不曉得你的app是指哪個平台 ios的原生UIWebview還有android 06/11 00:19
→ rarex: 的舊webview (<4.4)有很多API都有缺漏或不支援的情況 06/11 00:19