相机预览显示拉伸图像，当 flutter 中的高度减小时

Question

I am using camera preview in flutter, where I am setting some height and width to camera preview container. But when I decrease the height of container, the image gets stretched.

Container(
  height: MediaQuery.of(context).size.height * 0.35,
  width: MediaQuery.of(context).size.width * 0.90,
  child: _cameraPreviewWidget(),
)

/// Display Camera preview.
Widget _cameraPreviewWidget() {
  if (controller == null || !controller.value.isInitialized) {
    return const Text(
      'Loading',
      style: TextStyle(
        color: Colors.white,
        fontSize: 20.0,
        fontWeight: FontWeight.w900,
      ),
    );
  }
  return CameraPreview(controller);
}

Setting the height and width as per shown in above code, and the result is:

Expected is, whatever height I apply to the camera preview, it should not stretch the image, and should set appropriate aspect ratio to show image without stretch. Can someone please help me in this issue?

Answer 1

Use BoxFit.contain inside Image.file , it will show the entire image irrespective of height

   Image.file(
             _imageFile,
             fit: BoxFit.contain,
            )