how to use full width and height camera?

[ripper2hl]

No description provided.

[diegobill]

👍

[wucop]

Full width and height can be used with

<qr-scanner width="100%" height="100%" ng-success="onSuccess(data)" ng-error="onError(data)" />

But the problem is that the QR code will not get detected...

[Overdrivr]

I dont think using 100% is solving anything, instead the following config should be passed to the getUserMedia function when creating the stream

video: {
        optional: [
          {minWidth: 320},
          {minWidth: 640},
          {minWidth: 1024},
          {minWidth: 1280},
          {minWidth: 1920},
          {minWidth: 2560},
        ]
      }

But since this is encapsulated inside the html5-qrcode lib I'm not sure this can be solved here

[ggarbereder]

@wucop the problem here is that the canvas will not have the correct size. One can change the code to

canvas.setAttribute('width', video.clientWidth);
canvas.setAttribute('height', video.clientHeight);

In this solution the video element has to be added to the DOM tree before.