Flutter Camera doesn't fill screen

Question

I've been trying to fill the camera to the entire screen like snapchat without it being stretched or borders or bars. I've tried the answers from here but it didn't work on the smaller phones like OnePlus 2. It looks just fine on bigger sized phones. On my OnePlus 2 there's a white border on all corners but on my iPhone XS Max and Lenovo Z5 Pro and the Pixel 3A emulator looks just fine without any distortions. But when I get it to work full screen on my OnePlus 2 full screen, the other phones have full screen but the camera is distorted. Like it's being squeezed.

Code:

Widget _camera({BuildContext context, Size size}) => Stack(children: <Widget>[
    this._cameraController.value.isInitialized
        ? Transform.scale(
            scale: this._cameraController.value.aspectRatio / size.aspectRatio,
            child: GestureDetector(
                child: Center(
                    child: AspectRatio(
                        aspectRatio: this._cameraController.value.aspectRatio,
                        child: CameraPreview(this._cameraController))),
                onDoubleTap: () {
                  if (this._cameraFaceFront) {
                    this._cameraFaceFront = !this._cameraFaceFront;
                    this._initCamera(camera: widget.cameras.last);
                  } else {
                    this._cameraFaceFront = !this._cameraFaceFront;
                    this._initCamera(camera: widget.cameras.first);
                  }
                }))
        : Container(),
  ]);

Jay Mungara · Answer 1 · 2020-01-02T10:08:53.673

0

Just replace your whole "Transform.scale()" widget as,

GestureDetector(
              child: Container(
                height: double.infinity,
                width: double.infinity,
                child: CameraPreview(this._cameraController),
              ),
              onDoubleTap: () {
                if (this._cameraFaceFront) {
                  this._cameraFaceFront = !this._cameraFaceFront;
                  this._initCamera(camera: widget.cameras.last);
                } else {
                  this._cameraFaceFront = !this._cameraFaceFront;
                  this._initCamera(camera: widget.cameras.first);
                }
              })

edited Jan 02 '20 at 10:08

answered Jan 02 '20 at 07:16

Jay Mungara

6,663
2
27
49

I've tried that before as well, The borders are still there, well I should say borders it's more like the CameraPreview widget won't fill up the screen on the smaller device. I've also noticed that the launch screen is distorted on the same phone too. – Mohamed Mohamed Jan 02 '20 at 21:58

Flutter Camera doesn't fill screen

1 Answers1