1

I wanted to get my phone camera view in html, so I decided to try this plugin: https://github.com/cordova-plugin-camera-preview/cordova-plugin-camera-preview but then I tried to turn on my app it was only white screen. I am using phonegap / cordova system, platform: Android. For plugin installation I wrote only this cordova plugin add https://github.com/cordova-plugin-camera-preview/cordova-plugin-camera-preview.git line.

Html code:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <style type="text/css">
        html{
          background-color: transparent;
        }
    </style>
    <title>Camera View Test</title>
    </head>
    <body style="background-color='transparent'">
        <script type="text/javascript" src="cordova.js"></script>
        <script>
            var tapEnabled = true; //enable tap take picture
            var dragEnabled = true; //enable preview box drag across the screen
            var toBack = true; //send preview box to the back of the webview
            var rect = {x: 100, y: 100, width: 200, height:200};
            cordova.plugins.camerapreview.startCamera(rect, "front", tapEnabled, dragEnabled, toBack)
            cordova.plugins.camerapreview.show();
        </script>
        <script type="text/javascript" src="CameraPreview.js"></script>
    </body>
</html>

config.xml:

<?xml version='1.0' encoding='utf-8'?>
<widget id="io.cordova.hellocordova" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>HelloCordova</name>
    <description>
        A sample Apache Cordova application that responds to the deviceready event.
    </description>
    <author email="dev@cordova.apache.org" href="http://cordova.io">
        Apache Cordova Team
    </author>
    <content src="index.html" />
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <gap:plugin name="cordova-plugin-camera-preview" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
</widget>

Thanks for any respones, i am new at creating apps, so i need help!

Edward Falk
  • 9,991
  • 11
  • 77
  • 112
  • Before you start coding, read the documentation. You have to wait for the cordova-ready-event: http://cordova.apache.org/docs/en/dev/cordova/events/events.html#deviceready – Joerg Jun 18 '16 at 17:09
  • Thank you for you comment, but problem might be in a different place, because it won't worked for me, maybe someone have any suggestion how to get camera view in a half of phone app screen (webcam)? – Domantas Zilinskas Jun 18 '16 at 19:09

0 Answers0