2016-09-19 12 views
0

私はCordovaを初めて使い、カメラを開く必要のあるAndroid用のアプリを開発しようとしています。しかし、私はできません。以下は、私が従ったアプローチです:Cordovaでカメラを開くことができません

var app = { 
    initialize: function() { 
    this.bindEvents(); 
}, 

bindEvents: function() { 
    document.addEventListener('deviceready', this.onDeviceReady, false); 
}, 

onDeviceReady: function() { 
    app.receivedEvent('deviceready'); 
    document.getElementById('camera').addEventListener('click',function(e){ 
     navigator.camera.getPicture(onSuccess, onFail,{ 
      quality: 50, 
    destinationType: Camera.DestinationType.DATA_URL});}) 
    }, 
function onSuccess(imageData){ 
    var image=document.getElementById('myImage'); 
    image.src="data:img/jpeg;base64,"+imageData; 
} 
function onFail(message){ 
    alert('Failed because: '+message); 
} 
receivedEvent: function(id) { 
     console.log(id) 
} 
}; 
app.initialize(); 

Androidエミュレータでビルドして開いた後、カメラが開かれていません。親切に私を助けてください。事前のおかげで

答えて

0
app.js 

// Ionic Starter App 
 

 
// angular.module is a global place for creating, registering and retrieving Angular modules 
 
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html) 
 
// the 2nd parameter is an array of 'requires' 
 
angular.module('starter', ['ionic', 'ngCordova']) 
 

 
.run(function($ionicPlatform) { 
 
    $ionicPlatform.ready(function() { 
 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
 
    // for form inputs) 
 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
 
    } 
 
    if(window.StatusBar) { 
 
     StatusBar.styleDefault(); 
 
    } 
 
    }); 
 
}) 
 
.controller("ExampleController", function($scope, $cordovaCamera) { 
 
    
 
    $scope.takePicture = function() { 
 
     var options = { 
 
      quality : 75, 
 
      destinationType : Camera.DestinationType.DATA_URL, 
 
      sourceType : Camera.PictureSourceType.CAMERA, 
 
      allowEdit : true, 
 
      encodingType: Camera.EncodingType.JPEG, 
 
      targetWidth: 300, 
 
      targetHeight: 300, 
 
      popoverOptions: CameraPopoverOptions, 
 
      saveToPhotoAlbum: false 
 
     }; 
 
    
 
     $cordovaCamera.getPicture(options).then(function(imageData) { 
 
      $scope.imgURI = "data:image/jpeg;base64," + imageData; 
 
     }, function(err) { 
 
      // An error occured. Show a message to the user 
 
     }); 
 
    } 
 
    
 
});
index.html 
 

 
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
 
    <title></title> 
 

 
    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
 
    <link href="css/style.css" rel="stylesheet"> 
 

 
    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
 
    <link href="css/ionic.app.css" rel="stylesheet"> 
 
    --> 
 

 
    <!-- ionic/angularjs js --> 
 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 
 
\t 
 
\t <script src="js/ng-cordova.min.js"></script> 
 

 
    <!-- cordova script (this will be a 404 during development) --> 
 
    <script src="cordova.js"></script> 
 

 
    <!-- your app's js --> 
 
    <script src="js/app.js"></script> 
 
    
 
     
 
    </head> 
 
    <body ng-app="starter"> 
 
    <body ng-app="starter"> 
 

 
    <ion-pane> 
 
     <ion-header-bar class="bar-stable"> 
 
     <h1 class="title">Ionic Blank Starter</h1> 
 
     </ion-header-bar> 
 
     <ion-content ng-controller="ExampleController"> 
 
\t <img ng-show="imgURI !== undefined" ng-src="{{imgURI}}"> 
 
\t \t <img ng-show="imgURI === undefined" ng-src="http://placehold.it/300x300"> 
 
\t \t <button class="button" ng-click="takePicture()">Take Picture</button> 
 
     </ion-content> 
 
    </ion-pane> 
 
    </body> 
 
</html>

関連する問題