jsWaffle質問掲示板(雑談やTips歓迎)

jsWaffleについて質問する掲示板です。(雑談や発見したTipsの投稿も大歓迎です!)
[一覧へ] > (@34) [普通] [質問]
@34■ (#117) 撮影した画像をCanvasの背景にしたいのですが - toffle (2011-08-11 12:43) /普通 質問
【質問事項】どのような問題ですか?

jsWaffleとEclipseを使ってカメラアプリを作っています。
撮影した画像をCanvasの背景にしたいのですが、コードがわかりません・・・。
ご教授いただけますと幸いです。

【再現方法】サンプルソース、再現手順など

>TODO

【調べた事】ここまで調べてみました

クジラ飛行机さんの本を購入し、CameraDiaryの項目を参考に制作しています。

【jsWaffleバージョン】確認したjsWaffleバージョン

>TODO

【Androidのバージョン】確認したAndroidバージョン

> Android OS 3.0

【機種名】

> OPTIMUSPAD L-06C

【その他】

(#118) Canvasに画像を表示する方法 - クジラ飛行机 (2011-08-11 17:11) /普通 返信
質問ありがとうございます。
抜粋ですみませんが、以下のような感じでどうでしょうか?
===========================================
<canvas id="a_canvas"></canvas>
...
var canvas = $("a_canvas");
context = canvas.getContext("2d");

var fname = "/sdcard/temp.jpeg";
// カメラ起動
droid.startIntentForResult(
    "camera:" + fname, 
    function(code){
        if (code == 0) return; // キャンセルされたら何もしない
        // 撮影が完了した
        drawToCanvas(fname);
    }
);

// キャンバスにJPEGファイルを描画する
function drawToCanvas(fname) {
  var image = new Image(); 
  image.onload = function () { // 画像が読み込まれたタイミングで...
    context.drawImage(image, 0, 0); // キャンバスに描画
  };
  image.src = fname; // 画像ファイルの読込み
}
===========================================
キャンバスへの描画は、
書籍で言えば、「タッチパズルを作ってみよう」などが参考になると思います。

(#122) ありがとうございます! - toffle (2011-08-12 10:17) /普通 返信
お忙しい中、早速のお返事ありがとうございます!
本当に助かりました。
また分からないことがありましたらご教授お願い致します。

(#133) もう一度質問させてください - toffle (2011-08-18 09:53) /普通 質問
先日はご教授いただきありがとうございました。

教えていただいたコードを参考に作ってみましたが、カメラ起動→撮影→[OK]すると強制終了されてしまい、canvasに画像が配置されません。
var fname = "/sdcard/temp.jpeg";  
とすると、設置したボタンを押下してもカメラ起動せずでした。

現在落ち着いているコードは以下の通りです。
ここから強制終了されないようにするにはどうしたらいいのかご教授いただけますと幸いです。





    var canvas = $("a_canvas");
  var context = canvas.getContext("2d");
  var savedir = "/data/canvasdata/";
droid.mkdir(savedir);
    var disp = droid.getDisplayInfo();
    a_canvas.width = disp.width;
    a_canvas.height = disp.height;

function takePicture() { // 写真を撮影する
    // ファイル名を決める
    var d = new Date();
    var savedir = savedir + (d.getFullYear()) + "-" +
        (d.getMonth()+1) + "-" + (d.getDate()) + "_" +
        (d.getHours() + "-" + (d.getMinutes())) + "-" +
        (d.getSeconds()) + ".jpeg";
    // カメラ起動
    droid.startIntentForResult(
    "camera:" + savedir,
    function(code){
      if (code == 0) return; //キャンセルされたら何もしない
      // 撮影が完了した
        drawToCanvas(savedir);
    }
    );
    }

//キャンバスにJPEGファイルを描画する
function drawToCanvas(savedir) {
  var image = new Image();
  image.onload = function () { // 画像が読み込まれたタイミングで...
    context.drawImage(image, 0, 0); // キャンバスに描画
  };
  image.src = savedir; // 画像ファイルの読込み
}
//キャンセルボタンを押下したら画面クリア
function ImgClr () {
  context.clearRect(0,0, canvas.width, canvas.height);
  }

// 保存処理
    function saveData(){
  var saveData = droid.snapshotToFile(savedir);
    alert("保存しました");
  }

(#134) 追加です - toffle (2011-08-18 10:10) /普通 質問
それと、基本的な質問なのですが、使用しているタブレットでは
droid.setMenuItemは設置しても表示されないのでしょうか?
ガイドブック315頁を参照してデバックしましたが、menuボタンすら表示されません。

(#117)へ返信する:

名前
タイトル
本文
困った度
状態
確認キー お手数ですが、いたずら防止のために、半角数字で「8932」と入力してください。
編集キー 編集時に使うキーを入力(省略可能)
添付ファイル 画像ファイル(最大300KB)を添付可能