Je viens de créer mon premier ionique 2 app (j'ai utilisé ionique 1 assez largement). Je suis en train d'utiliser l' ionique-natif de la caméra de prévisualisation plugin.
L'installation est assez simple:
npm install -g ionic cordova
ionic start timesnap --v2
ionic platform add android
ionic platform add ios
ionic plugin add cordova-plugin-camera-preview --save
Ensuite, j'ai copié et collé à l'exemple de code dans la page about:
import { CameraPreview, CameraPreviewRect } from 'ionic-native';
// camera options (Size and location)
let cameraRect: CameraPreviewRect = {
x: 100,
y: 100,
width: 200,
height: 200
};
// start camera
CameraPreview.startCamera(
cameraRect, // position and size of preview
'front', // default camera
true, // tap to take picture
false, // disable drag
true, // send the preview to the back of the screen so we can addoverlaying elements
1 //alpha
);
J'ai lancé l'application en utilisant les commandes suivantes:
ionic emulate android -lcs
ionic emulate ios -lcs --target='iPhone-6'
Au premier abord, l'appareil photo n'affiche pas alors j'ai couru chrome://inspect et a vu des avertissements à propos de Cordova manquant "essayez d'exécuter dans un émulateur", mais c'était lors de l'exécution dans un émulateur android. J'ai essayé iOS trop et vu les mêmes résultats.
Des idées pourquoi cordova n'est pas chargé?
Voici le message d'erreur de journal à partir de chrome://inspect lors de l'exécution dans un émulateur android:
Mise à jour... index.html
(c'est juste le standard généré par ionique)
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Ionic App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#4e8ef7">
<!-- cordova.js required for cordova apps -->
<script src="cordova.js"></script>
<!-- un-comment this code to enable service worker
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js')
.then(() => console.log('service worker installed'))
.catch(err => console.log('Error', err));
}
</script>-->
<link href="build/main.css" rel="stylesheet">
</head>
<body>
<!-- Ionic's root component and where the app will load -->
<ion-app class="trans"></ion-app>
<!-- The polyfills js is generated during the build process -->
<script src="build/polyfills.js"></script>
<!-- The bundle js is generated during the build process -->
<script src="build/main.js"></script>
</body>
</html>
