旋转到横向离子4 IOS时半白屏答案

【问题标题】：Half white screen when rotate to landscape ionic 4 IOS旋转到横向离子4 IOS时半白屏
【发布时间】：2020-04-22 15:53:47
【问题描述】：

我正在以纵向模式构建 IONIC 4 应用程序。我已强制应用在 config.ts 文件中保持纵向模式，并且在 android 和 IOS 中一切正常

在某些页面上，我使用相机预览插件来自定义相机屏幕。它需要处于横向模式，因此使用 Screen Orientation 插件强制它在该页面上横向并启动相机。

ngOnInit() {
    this.platform.ready().then(()=>{
      if(this.platform.is('cordova')){
        this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.LANDSCAPE);
        this.cameraPreview.onBackButton().then(()=>{
          console.log('Back button pushed');
          this.close();
        })
        // this.presentAlertConfirm()
        //make short delay of 500ms to start the camera preview
        setTimeout(()=>{
          this.initCameraPreview()
        },500)
      }
    })
  }

在安卓中运行良好。

但在 IOS 中，屏幕的一半被白色覆盖，如下图所示。

请帮我解决这个问题

【问题讨论】：

它的奇怪行为，可能在 ios 中导致没有时间计算视口，可能在 ios 中尝试将预览代码放在 setTimeout 中，如果是时间问题，请尝试..
你好@MostafaHarb，我也在超时时间里尝试过，给了3秒的时间。还是一样。

标签： ionic-framework ionic4 screen-orientation

【解决方案1】：

通过修改相机预览的大小为解决问题

async initCameraPreview(){
    await this.cameraPreview.startCamera(
      {
         x: 0,
         y: 0,
         width: this.isIOS ? window.screen.height : window.screen.width,
         height: this.isIOS ? window.screen.width : window.screen.height,
         toBack: true, 
         previewDrag: false, 
         tapPhoto: false,
         camera: "back"
     }
   ).then(
      (res) => {
        console.log(res)
      },
      (err) => {
        console.log(err)
      });
  }

【讨论】：