Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/hjam40/Camera.MAUI

A CameraView Control for preview, take photos and control the camera options
https://github.com/hjam40/Camera.MAUI

Last synced: 3 months ago
JSON representation

A CameraView Control for preview, take photos and control the camera options

Awesome Lists containing this project

README

        

# Camera.MAUI/Camera.MAUI.ZXing

A Camera View control and a Barcode Endode/Decode control (based on ZXing.Net) for .NET MAUI applications.

## CameraView

A ContetView control for camera management with the next properties:

| | Android | iOS/Mac | Windows |
|---|---|---|---|
| Preview | ✅ | ✅ | ✅ |
| Mirror preview | ✅ | ✅ | ✅ |
| Flash | ✅ | ✅ | ✅ |
| Torch | ✅ | ✅ | ✅ |
| Zoom | ✅ | ✅ | ✅ |
| Take snapshot | ✅ | ✅ | ✅ |
| Save snapshot | ✅ | ✅ | ✅ |
| Barcode detection/decode | ✅ | ✅ | ✅ |
| Video/audio recording | ✅ | ✅ | ✅ |
| Take Photo | ✅ | ✅ | ✅ |

### Install and configure CameraView

1. Download and Install [Camera.MAUI](https://www.nuget.org/packages/Camera.MAUI) NuGet package on your application.
1. Download and Install [Camera.MAUI.ZXing](https://www.nuget.org/packages/Camera.MAUI.ZXing) NuGet package on your application (if you want Barcode detection/decode with ZXing).

1. Initialize the plugin in your `MauiProgram.cs`:

```csharp
// Add the using to the top
using Camera.MAUI;

public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();

builder
.UseMauiApp()
.UseMauiCameraView(); // Add the use of the plugging

return builder.Build();
}
```
1. Add camera/microphone permissions to your application:

#### Android

In your `AndroidManifest.xml` file (Platforms\Android) add the following permission:

```xml

```

#### iOS/MacCatalyst

In your `info.plist` file (Platforms\iOS / Platforms\MacCatalyst) add the following permission:

```xml
NSCameraUsageDescription
This app uses camera for...
NSMicrophoneUsageDescription
This app needs access to the microphone for record videos
```
Make sure that you enter a clear and valid reason for your app to access the camera. This description will be shown to the user.

#### Windows

In your Package.appxmanifest file (Platforms\Windows) go to Capabilities and mark Web Camera and Microphone.

For more information on permissions, see the [Microsoft Docs](https://docs.microsoft.com/dotnet/maui/platform-integration/appmodel/permissions).

### Using CameraView

In XAML, make sure to add the right XML namespace:

`xmlns:cv="clr-namespace:Camera.MAUI;assembly=Camera.MAUI"`

Use the control:
```xaml

```

Configure the events:
```csharp
cameraView.CamerasLoaded += CameraView_CamerasLoaded;
cameraView.BarcodeDetected += CameraView_BarcodeDetected;
```
Configure the camera and microphone to use:
```csharp
private void CameraView_CamerasLoaded(object sender, EventArgs e)
{
if (cameraView.NumCamerasDetected > 0)
{
if (cameraView.NumMicrophonesDetected > 0)
cameraView.Microphone = cameraView.Microphones.First();
cameraView.Camera = cameraView.Cameras.First();
MainThread.BeginInvokeOnMainThread(async () =>
{
if (await cameraView.StartCameraAsync() == CameraResult.Success)
{
controlButton.Text = "Stop";
playing = true;
}
});
}
}
```
CameraInfo type (Camera Property):
CameraInfo has the next properties:
```csharp
public string Name
public string DeviceId
public CameraPosition Position
public bool HasFlashUnit
public float MinZoomFactor
public float MaxZoomFactor
public float HorizontalViewAngle
public float VerticalViewAngle
public List AvailableResolutions
```
Start camera playback:
```csharp
if (await cameraView.StartCameraAsync(new Size(1280, 720)) == CameraResult.Success)
{
playing = true;
}
```
Stop camera playback:
```csharp
if (await cameraView.StopCameraAsync() == CameraResult.Success)
{
playing = false;
}
```
Set Flash mode
```csharp
cameraView.FlashMode = FlashMode.Auto;
```
Toggle Torch
```csharp
cameraView.TorchEnabled = !cameraView.TorchEnabled;
```
Set mirrored mode
```csharp
cameraView.MirroredImage = true;
```
Set zoom factor
```csharp
if (cameraView.MaxZoomFactor >= 2.5f)
cameraView.ZoomFactor = 2.5f;
```
Get a snapshot from the playback
```csharp
ImageSource imageSource = cameraView.GetSnapShot(ImageFormat.PNG);
bool result = cameraView.SaveSnapShot(ImageFormat.PNG, filePath);
```
Record a video:
```csharp
var result = await cameraView.StartRecordingAsync(Path.Combine(FileSystem.Current.CacheDirectory, "Video.mp4"), new Size(1920, 1080));
....
result = await cameraView.StopRecordingAsync();
```
Take a photo
```csharp
var stream = await cameraView.TakePhotoAsync();
if (stream != null)
{
var result = ImageSource.FromStream(() => stream);
snapPreview.Source = result;
}
```

**Use Control with MVVM:**
The control has several binding properties for take an snapshot:
```csharp
/// Binding property for use this control in MVVM.
public CameraView Self

/// Sets how often the SnapShot property is updated in seconds.
/// Default 0: no snapshots are taken
/// WARNING! A low frequency directly impacts over control performance and memory usage (with AutoSnapShotAsImageSource = true)
///
public float AutoSnapShotSeconds

/// Sets the snaphost image format
public ImageFormat AutoSnapShotFormat

/// Refreshes according to the frequency set in the AutoSnapShotSeconds property (if AutoSnapShotAsImageSource is set to true) or when GetSnapShot is called or TakeAutoSnapShot is set to true
public ImageSource SnapShot

/// Refreshes according to the frequency set in the AutoSnapShotSeconds property or when GetSnapShot is called.
/// WARNING. Each time a snapshot is made, the previous stream is disposed.
public Stream SnapShotStream

/// Change from false to true refresh SnapShot property
public bool TakeAutoSnapShot

/// If true SnapShot property is refreshed according to the frequency set in the AutoSnapShotSeconds property
public bool AutoSnapShotAsImageSource
/// Starts/Stops the Preview if camera property has been set
public bool AutoStartPreview
{
get { return (bool)GetValue(AutoStartPreviewProperty); }
set { SetValue(AutoStartPreviewProperty, value); }
}
/// Full path to file where record video will be recorded.
public string AutoRecordingFile
{
get { return (string)GetValue(AutoRecordingFileProperty); }
set { SetValue(AutoRecordingFileProperty, value); }
}
/// Starts/Stops record video to AutoRecordingFile if camera and microphone properties have been set
public bool AutoStartRecording
{
get { return (bool)GetValue(AutoStartRecordingProperty); }
set { SetValue(AutoStartRecordingProperty, value); }
}
```
```xaml

```

You have a complete example of MVVM in [MVVM Example](https://github.com/hjam40/Camera.MAUI/tree/master/Camera.MAUI.Test/MVVM)

For barcodes detection, you must set the Camera Control BarCodeDecoder property.
Enable and Handle barcodes detection with Camera.MAUI.ZXing:
```csharp
using Camera.MAUI.ZXing;
```

```csharp
cameraView.BarcodeDetected += CameraView_BarcodeDetected;
cameraView.BarCodeDecoder = new ZXingBarcodeDecoder();
cameraView.BarCodeOptions = new BarcodeDecodeOptions
{
AutoRotate = true,
PossibleFormats = { BarcodeFormat.QR_CODE },
ReadMultipleCodes = false,
TryHarder = true,
TryInverted = true
};
cameraView.BarCodeDetectionFrameRate = 10;
cameraView.BarCodeDetectionMaxThreads = 5;
cameraView.ControlBarcodeResultDuplicate = true;
cameraView.BarCodeDetectionEnabled = true;

private void CameraView_BarcodeDetected(object sender, ZXingHelper.BarcodeEventArgs args)
{
Debug.WriteLine("BarcodeText=" + args.Result[0].Text);
}
```
Use the event or the bindable property BarCodeResults
```csharp
/// Event launched every time a code is detected in the image if "BarCodeDetectionEnabled" is set to true.
public event BarcodeResultHandler BarcodeDetected;
/// It refresh each time a barcode is detected if BarCodeDetectionEnabled porperty is true
public Result[] BarCodeResults
```

## BarcodeImage

A ContentView control for generate codebars images.

In XAML, make sure to add the right XML namespace:

`xmlns:cv="clr-namespace:Camera.MAUI;assembly=Camera.MAUI"`

Use the control and its bindable properties:
```xaml

```
Set the BarcodeEncoder property to enable de image generator (example with Camera.MAUI.ZXing):
```csharp
barcodeImage.BarcodeEncoder = new ZXingBarcodeEncoder();
```
Set the barcode property to generate the image:
```csharp
barcodeImage.Barcode = "https://github.com/hjam40/Camera.MAUI";
```