VSCode + CordovaのエミュレータでCameraを起動する

2019/2/13 Cordova, Visual Studio Code

VSCode + CordovaのエミュレータでCameraを起動する

Cameraを起動するにはプラグインが必要です。

cordova plugin add cordova-plugin-camera

1	cordova plugin add cordova-plugin-camera

HTML5

～省略～
<button id="picture">ボタン</button>
～省略～
<script type="text/javascript">
$(function() {
  $('#picture').on('click', function() {

    // カメラ起動時のオプション
    var options = {
      quality: 50,
      destinationType: Camera.DestinationType.FILE_URI, // URLを引数
      sourceType: 1, // 0:Photo Library, 1=Camera, 2=Saved Album
      encodingType: 0 // 0=JPG 1=PNG
    };

    // カメラが起動される
    navigator.camera.getPicture(
      function(fileURL) {
        // カメラ保存時の処理
      },
      function() {
        // 失敗時、または、画像取得キャンセル時にこの関数が呼ばれる
      },
      options
    );
  });
});
</script>

～省略～

～省略～

$(function() {

$('#picture').on('click', function() {

// カメラ起動時のオプション

var options = {

quality: 50,

destinationType: Camera.DestinationType.FILE_URI, // URLを引数

sourceType: 1, // 0:Photo Library, 1=Camera, 2=Saved Album

encodingType: 0 // 0=JPG 1=PNG

};

// カメラが起動される

navigator.camera.getPicture(

function(fileURL) {

// カメラ保存時の処理

function() {

// 失敗時、または、画像取得キャンセル時にこの関数が呼ばれる

options

);

});

</script>

エミュレータのカメラ画面はこんな感じです。

cordova plugin add cordova-plugin-file-transfer

1	cordova plugin add cordova-plugin-file-transfer

というプラグインを使うとカメラで撮ったと同時にファイルをサーバにアップロードすることができました。アップロード部分はphpを使いました。

高橋

KHI入社して退社。今はCONFRAGEで正社員です。関西で140-170/80～120万から受け付けております^^
得意技はJS(ES6),Java,AWSの大体のリソースです
コメントはやさしくお願いいたします^^
座右の銘は、「狭き門より入れ」「願わくは、我に七難八苦を与えたまえ」です^^

高橋

VSCode + CordovaのエミュレータでCameraを起動する

VSCode + CordovaのエミュレータでCameraを起動する

関連記事

コメントをどうぞ コメントをキャンセル

コメントをどうぞコメントをキャンセル