iOS Black/White preview until page is scrolled.

[Cirivas]

Hi, I'm using this plugin with Ionic3. Until version 2.5.0 everything was working "fine". I updated to latest version for some little fixes, but now the camera preview appears black or white until the page where the camera is on is scrolled.

I'm using the same code exposed in docs with the addition of a transparent-body class to allow camera preview.

Again, the camera preview is showed, but only if I scroll the page where the camera is on.

[burtontanner]

I am having the same issue. I am using 2.6.0.

[burtontanner]

actually I was calling .show() before .scan()

[Cirivas]

I had to do a little "trick" to trigger a "scroll":

private scan() : Observable<any> { 
    return Observable.create(observer => {
      this.qrScanner.prepare().then((status: QRScannerStatus) => {
        if(status.authorized) {

          // Ionic has more classes that needs to be transparented
          (document.querySelector('ion-app') as HTMLElement).classList.add('transparent-body');

          // Getting nav decor
          const navDecor = <HTMLElement>document.querySelector('.nav-decor');

          this.scanSub = this.qrScanner.scan().subscribe( (text: string) => {
            //InitPayment with TEXT
            console.log("scanSub text observer:", text)

           // Return nav decor to its original state
            navDecor.style.display = "block";
            observer.next(text);
          });

          this.qrScanner.show().then(() => {
           // Messing with nav-decor to trigger style changes
            navDecor.style.display = "none";
          })
        ....
    })
})

The important thing is messing around with navDecor, doing that fixed my problem.

[hugoblanc]

this.scanSub = this.qrScanner.scan() .subscribe((text: string) => this.ngZone.run(() => this.asScanSomething(text))); this.qrScanner.show().then(()=>{ window.scrollBy(1); }); scrollBy(1) solve the problem in my case