Camera not showing

[mastrofinimanuel]

I installed the Cordova plugin qrscanner and it is working: when I click on a button that triggers the "prepare API", the permission is being asked, then I have two more buttons: one for scan API and one for show API. They are both invoked and I can even scan QR codes. Nevertheless, the camera preview is not showing. I am not using Ionic.

    $scope.prepare = function() {
        console.log("XXX In prepare");
        QRScanner.prepare($scope.done);

    };

    $scope.scan = function() {
        console.log("XXX In scan");
        QRScanner.scan($scope.callback);
    };

    $scope.show = function() {
        console.log("XXX In show");
        QRScanner.show(function(status){
            console.log("XXX Inside");
            console.log(JSON.stringify(status));
        });
        document.body.style.background = 'none transparent !important';
    };

    $scope.done = function(err, status){
        if(err){
            console.log("XXX Done err");
            console.error(err._message);
        } else {
            console.log("XXX Done ok");
            console.log(JSON.stringify(status));
        }
    };

    $scope.callback = function(err, contents){
        if(err){
            console.error(err._message);
        }
        alert('The QR Code contains: ' + contents);
    };

Nevertheless, nothing is showing. What's wrong?

[WilliamCampolina]

the camera does not open and I can not scan, complete the installation or use the example

[setaman]

@WilliamCampolina is the background of the App transparent?

[WilliamCampolina]

@setaman , apparently nothing happens, the fund continues like this

[setaman]

@WilliamCampolina you say that you already can scan QR codes. So camera lauches but you can't see it. i had the problem when i first tried the plugin Then I found out that there was a div with not transparent background. Note that the camera shows behind all your HTML

[cmohanraj10]

Below code works for me

$("html").hide();
QRScanner.scan(displayContents);

function displayContents(err,text){
  if(err){
	alert("Something went wrong. Please try after some time.");
  }
  else{
	$("html").show();
	QRScanner.hide();
	QRScanner.cancelScan();
	alert(text);
  }
}

QRScanner.show();

Hope it helps, Happy coding!