CamerAwesome

📸 Embedding a  camera experience within your own app should’t be that hard.
A flutter plugin to integrate awesome Android / iOS  camera experience.

This packages provides you a fully customizable camera experience that you can use within your app.
Use our awesome built in interface or customize it as you want.

Native features

Here’s all native features that cameraAwesome provides to the flutter side.

📖  Installation and usage

Add the package in your pubspec.yaml

dependencies:
  camerawesome: ^1.3.0
  ...

Platform specific setup

• iOS

Add these on ios/Runner/Info.plist:

• Android

Change the minimum SDK version to 21 (or higher) in android/app/build.gradle:

minSdkVersion 21

In order to be able to take pictures or record videos, you may need additional permissions depending
on the Android version and where you want to save them.
Read more about it in
the official documentation.

WRITE_EXTERNAL_STORAGE is not included in the plugin starting with version 1.4.0.

If you want to record videos with audio, add this permission to your AndroidManifest.xml:

You may also want to save location of your pictures in exif metadata. In this case, add below
permissions:

buildscript {
  ext.kotlin_version = '1.7.10'
  ext {
    // You can override these variables
    compileSdkVersion = 33
    minSdkVersion = 24 // 21 minimum
    playServicesLocationVersion = "20.0.0"
    exifInterfaceVersion = "1.3.4"
  }
  // ...
}

java.lang.IncompatibleClassChangeError: Found interface com.google.android.gms.location.ActivityRecognitionClient, but class was expected

Import the package in your Flutter app

import 'package:camerawesome/camerawesome_plugin.dart';

👌 Awesome built-in interface

Just use our builder.
That’s all you need to create a complete  camera experience within you app.

CameraAwesomeBuilder.awesome(
  saveConfig: SaveConfig.image(
    pathBuilder: _path(),
  ),
  onMediaTap: (mediaCapture) {
    OpenFile.open(mediaCapture.filePath);
  },
),

This builder can be customized with various settings:

• a theme
• builders for each part of the screen
• initial  camera setup
• preview positioning
• additional preview decoration
• and more!

Here is an example:

Check
the full documentation
to learn more.

🎨 Creating a custom interface

If the awesome() factory is not enough, you can use custom() instead.

It provides a builder property that lets you create your own camera experience.

The camera preview will be visible behind what you will provide to the builder.

CameraAwesomeBuilder.custom(
  saveConfig: SaveConfig.image(pathBuilder: _path()),
  builder: (state, previewSize, previewRect) {
    // create your interface here
  },
)

See more in documentation

Working with the custom builder

Here is the definition of our builder method.

typedef CameraLayoutBuilder = Widget Function(CameraState cameraState, PreviewSize previewSize, Rect previewRect);

The only thing you have access to manage the  camera is the cameraState.
Depending on which state is our camera experience you will have access to some different method.
`previewSize` and `previewRect` might be used to position your UI around or on top of the  camera preview.

How do CamerAwesome states work ?

Using the state you can do anything you need without having to think about the camera flow

• On app start we are in PreparingCameraState
• Then depending on the initialCaptureMode you set you will be PhotoCameraState
  or VideoCameraState
• Starting a video will push a VideoRecordingCameraState
• Stopping the video will push back the VideoCameraState

  Also if you want to use some specific function you can use the when method so you can write like
  this.

See more in documentation

🔬 Analysis mode

Use this to achieve:

• QR-Code scanning.
• Facial recognition.
• AI object detection.
• Realtime video chats.
  And much more 🤩

You can check examples using MLKit inside the example directory.
The above example is from ai_analysis_faces.dart. It detects faces and draw their contours.

It’s also possible to use MLKit to read barcodes:

Check ai_analysis_barcode.dart and preview_overlay_example.dart for examples or
the documentation.

How to use it

CameraAwesomeBuilder.awesome(
  saveConfig: SaveConfig.image(
    pathBuilder: _path(),
  ),
  onImageForAnalysis: analyzeImage,
  imageAnalysisConfig: AnalysisConfig(
        // Android specific options
        androidOptions: const AndroidAnalysisOptions.nv21(
            // Target width (CameraX will chose the closest resolution to this width)
            width: 250,
        ),
        // Wether to start automatically the analysis (true by default)
        autoStart: true,
        // Max frames per second, null for no limit (default)
        maxFramesPerSecond: 20,
    ),

MLkit recommands to use nv21 format for Android.
bgra8888 is the iOS format
For machine learning you don’t need full resolution images (720 or lower should be enough and
makes computation easier)

Learn more about the image analysis configuration in
the documentation
.

Check also detailed explanations on how to use MLKit
to read barcodes
and detect faces.

⚠️ On Android, some devices don’t support video recording and image analysis at the same time.

• If they don’t, image analysis will be ignored.
• You can check if a device has this capability by
  using CameraCharacteristics .isVideoRecordingAndImageAnalysisSupported(Sensors.back).

🐽 Updating Sensor configuration

Through state you can access to a SensorConfig class.

All of this configurations are listenable through a stream so your UI can automatically get updated
according to the actual configuration.

🌆 Photo live filters

Apply live filters to your pictures using the built-in interface:

You can also choose to use a specific filter from the start:

CameraAwesomeBuilder.awesome(
  // other params
  filter: AwesomeFilter.AddictiveRed,
)

Or set the filter programmatically:

See all available filters in the documentation.

GitHub

View Github