颤动相机显得拉长

Question

到目前为止，我一直在四处奔波，我很喜欢它，但是我有一个问题让相机正常工作。

我按照本页上的说明https://pub.dartlang.org/packages/camera，它的工作原理。但是，相机被拉伸以适应手机屏幕，但图像翘曲并且比应有的高。其他使用相机的应用程序似乎保持比例，有没有办法确保它不会拉伸但仍然填满屏幕？

Answer 1

在lase的解决方案的基础上，即使设备的纵横比与摄像机比率不同，这也有效：

final size = MediaQuery.of(context).size;
final deviceRatio = size.width / size.height;
return Transform.scale(
  scale: controller.value.aspectRatio / deviceRatio,
  child: Center(
    child: AspectRatio(
      aspectRatio: controller.value.aspectRatio,
      child: CameraPreview(controller),
    ),
  ),
);

Answer 2

我有一个类似的问题，虽然理查德的答案很有帮助，但我也有预测太小的问题。可能有更好的方法，但我能够通过像这样的宽高比反转来缩放它来解决它：

return new Scaffold(
  appBar: new AppBar(title: new Text('Capture')),
  body: new Transform.scale(
      scale: 1 / controller.value.aspectRatio,
      child: new Center(
        child: new AspectRatio(
            aspectRatio: controller.value.aspectRatio,
            child: new CameraPreview(controller)),
      )),
);

从内到外，这应该：

1. 以正确的宽高比构建CameraPreview
2. 在视图中居中此预览
3. 应用缩放变换，允许预览根据宽高比适当填充屏幕

Answer 3

我只是想建立在Marek Lisy的答案上，因为它确实破坏了容器。在我的情况下，我使用TabBarView但该答案导致错误的捕捉到标签。我使用ClipRect修复了这个问题，如下所示：

final size = MediaQuery.of(context).size;

if (!controller.value.isInitialized) {
  return Container();
}
return ClipRect(
  child: Container(
    child: Transform.scale(
      scale: controller.value.aspectRatio / size.aspectRatio,
      child: Center(
        child: AspectRatio(
          aspectRatio: controller.value.aspectRatio,
          child: CameraPreview(controller),
        ),
      ),
    ),
  ),
);

祝你们好运！我花了一个小时左右试图解决这个问题。所以希望没有人有同样的问题。

Answer 4

您需要将预览包装在提供正确宽高比的窗口小部件中 - 通过自己将宽度和高度设置为正确的比例，或使用AspectRatio。例如，相机插件示例使用：

new Expanded(
  child: new Padding(
    padding: const EdgeInsets.all(5.0),
    child: new Center(
      child: new AspectRatio(
        aspectRatio: controller.value.aspectRatio,
        child: new CameraPreview(controller),
      ),
    ),
  ),
),