Flutter Camera Overlay

Question

I've been doing some research for an upcoming project and would like to render the camera view behind a custom shape/semi-transparent img to act as a guide when taking pictures.

Does anyone know of a flutter camera plugin or tutorial that explains how to do this?

Answer 1

You can use the camera Plugin for flutter by the Flutter team.

https://pub.dartlang.org/packages/camera

and then position your image and you cameraview in a Stack Widget like this:

return new Stack(
  alignment: FractionalOffset.center,
  children: <Widget>[
    new Positioned.fill(
      child: new AspectRatio(
          aspectRatio: controller.value.aspectRatio,
          child: new CameraPreview(controller)),
    ),
    new Positioned.fill(
      child: new Opacity(
        opacity: 0.3,
        child: new Image.network(
          'https://picsum.photos/3000/4000',
          fit: BoxFit.fill,
        ),
      ),
    ),
  ],
);