How To Set Flutter Camerapreview Size "fullscreen"

Iam using CameraPreview for measuring height of an object,But the issue was i cant able to set cameraPreview height full screen.. I have tried Positioned widget, it fills the scree

Solution 1:

CameraValue.aspectRatio returns width / height rather than height / width since 0.7.0, and CameraPreview handles AspectRatio itself now, so imo the working code snippet would be as follows:

/// only work inside WidgetsApp or MaterialApp, which introduces a MediaQuery
final scale = 1 / (controller.value.aspectRatio * MediaQuery.of(context).size.aspectRatio);
return Transform.scale(
  scale: scale,
  alignment: Alignment.topCenter,
  child: CameraPreview(controller),
);

update:

After scale by Transform the preview may paint off screen-size limit when used in a TransitionRoute. (When hosted in a CupertinoPageRoute a drag gesture will clearly show this).

So I think it would be a good idea to clip the preview to make it exactly matching the screen size.

final mediaSize = MediaQuery.of(context).size;
final scale = 1 / (controller.value.aspectRatio * mediaSize.aspectRatio);
return ClipRect(
  clipper: _MediaSizeClipper(mediaSize),
  child: Transform.scale(
    scale: scale,
    alignment: Alignment.topCenter,
    child: CameraPreview(controller),
  ),
);
class _MediaSizeClipper extends CustomClipper<Rect> {
  final Size mediaSize;
  const _MediaSizeClipper(this.mediaSize);
  @override
  Rect getClip(Size size) {
    return Rect.fromLTWH(0, 0, mediaSize.width, mediaSize.height);
  }
  @override
  bool shouldReclip(CustomClipper<Rect> oldClipper) {
    return true;
  }
}

Solution 2:

Issue has been solved by wrapping Centre widget in Transform widget

final size = MediaQuery.of(context).size;
final deviceRatio = size.width / size.height;
returnStack(
            children: <Widget>[
              Center(
                child:Transform.scale(
                      scale: controller.value.aspectRatio/deviceRatio,
                      child: newAspectRatio(
                       aspectRatio: controller.value.aspectRatio,
                       child: newCameraPreview(controller),
                       ),
                   ),),);

Solution 3:

I following the demo from the https://flutter.dev/docs/cookbook/plugins/picture-using-camera

and I do not customize the AspectRatio of the CameraPreview (actually I did but it not working).

The way I solve it is very simple.

returnStack(
  children: [
    Container(
        width: double.infinity,
        height: double.infinity,
        child: CameraPreview(_cameraController))
  ],
);

I am using the attributes width and height of Container widget to make the CameraPreview stretch as fullsceen.

Solution 4:

final mediaSize = MediaQuery.of(context).size;
return Transform.scale(
scale:1 /
(cameraController.value.aspectRatio  * mediaSize.aspectRatio),
alignment: Alignment.center,
child: CameraPreview(cameraController),);

Solution 5:

This code works for Flutter version 2.8 and above

returnStack(
  children: [
    Positioned(
      top: 0,
      bottom: 0,
      child: CameraPreview(_cameraController!),
    ),
  ],
);