Ionic Cordova相机无法正常工作

AMG*_*AMG 4 ios cordova ionic-framework

我正在使用以下Git(请参阅此处的代码)作为Phonegap Build的输入,并已正确安装了我的手机上的应用程序(iOS).

该应用程序正确打开,但当我尝试拍照(点击按钮)时没有任何反应.它应该显示相机拍摄的图像.

有人可以向我解释什么不起作用?该教程来自Ionic网站.

替代方案:有人有一个工作.git或phonegap代码?

AMG*_*AMG 7

哦,所以我想出来了,这一切都是关于正确设置config.xml!

以下是如何使用Ionic和Phonegap Build构建示例相机应用程序的概述

1.安装NodeJS或转到c9.io(云环境)并启动NodeJs项目.如果需要,删除所有文件

2.安装Ionic并启动项目(此处:标签)

npm install -g cordova ionic
ionic start myApp tabs 
Run Code Online (Sandbox Code Playgroud)

2A.cd myApp

2B.可选,添加插件(如果在浏览器或模拟器上测试)

cordova plugin add org.apache.cordova.camera
Run Code Online (Sandbox Code Playgroud)

3. cd www

4.通过Bower安装或在/ lib中解压缩ngCordova

bower install ngCordova
Run Code Online (Sandbox Code Playgroud)

5.在index.html中添加ngCordova引用

在index.html中添加

<script src="lib/ngCordova/dist/ng-cordova.js"></script> 
Run Code Online (Sandbox Code Playgroud)

之前

<script src="cordova.js"></script>
Run Code Online (Sandbox Code Playgroud)

6.在app.js中添加'ngCordova'作为依赖项

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'ngCordova'])
Run Code Online (Sandbox Code Playgroud)

7.写下控制器

.controller("ExampleCtrl", 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
        });
    }

});
Run Code Online (Sandbox Code Playgroud)

8.使用.html中的控制器(不要忘记在app.js中使用ExampleCtrl添加状态tab.example)

<ion-view view-title="Example">
  <ion-content>
    <img ng-show="imgURI !== undefined" ng-src="{{imgURI}}">
    <img ng-show="imgURI === undefined" ng-src="http://placehold.it/300x300">
    <button class="button" ng-click="takePicture()">Take Picture</button>
  </ion-content>
</ion-view>
Run Code Online (Sandbox Code Playgroud)

9.添加适当的config.xml.使用此模板:

https://github.com/phonegap/phonegap-start/blob/master/www/config.xml

  • 恭喜你弄明白了 :) (4认同)
  • 你能详细说明第9步.在哪里添加config.xml或者用它做什么? (2认同)