[Proposal] CameraView

CameraView

• Proposed
• Prototype: Not Started
• Implementation: Not Started
  • iOS Support
  • Android Support
  • macOS Support
  • Windows Support
• Unit Tests: Not Started
• Sample: Not Started
• Documentation: Not Started

Summary

The CameraView control enables the user to display a preview of the camera output. In addition, it can take photos or record videos. The CameraView also offers the options you would expect to support taking photos and recording videos such as turning the flash on or off, saving the captured media to a file, and offering different hooks for events

Detailed Design

CameraView.shared.cs

public class CameraView : View
{
  public static readonly BindableProperty IsBusyProperty;
  public static readonly BindableProperty IsAvailableProperty;
  public static readonly BindableProperty CameraOptionsProperty;
  public static readonly BindableProperty CaptureModeProperty;
  public static readonly BindableProperty VideoStabilizationProperty;
  public static readonly BindableProperty FlashModeProperty;
  public static readonly BindableProperty ZoomProperty;
  public static readonly BindableProperty MaxZoomProperty;
  
  public event EventHandler<bool>? OnAvailable;
  public event EventHandler<MediaCapturedEventArgs>? MediaCaptured;
  public event EventHandler<string>? MediaCaptureFailed;
  
  public ICommand? ShutterCommand { get; }
  
  public bool IsBusy { get; set; }
  public bool IsAvailable { get; set; }
  public CameraOptions CameraOptions { get; set; }
  public CameraCaptureMode CaptureMode { get; set; }
  public bool VideoStabilization { get; set; }
  public CameraFlashMode FlashMode { get; set; }
  public double Zoom { get; set; }
  public double MaxZoom { get; set; }
  
  public void Shutter();
}

Usage Syntax

XAML Usage

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:xct="http://xamarin.com/schemas/2020/toolkit"
             x:Class="MyLittleApp.MainPage">

     <StackLayout>

        <xct:CameraView
                x:Name="cameraView"
                CaptureMode="Video"
                FlashMode="On"
                MediaCaptured="CameraView_MediaCaptured"
                HorizontalOptions="FillAndExpand"
                VerticalOptions="FillAndExpand" />

    </StackLayout>

</ContentPage>

C# Usage

class MyPage : ContentPage
{
  public MyPage()
  {
    Content = new CameraView
    {
      CaptureMode = CameraCaptureMode.Video,
      FlashMode = CameraFlashMode.Off,
    }.FillAndExpand()
     .Invoke(cameraView => cameraView.MediaCaptured += HandleMediaCaptured);
  }

  void HandleMediaCaptured(object? sender, MediaCapturedEventArgs e)
  {
    //...
  }
}

[pictos]

I would say to have a separate project focused in barcode scanning where we will have the zxing package and that package has a dependency on MCT.CameraView. That way we avoid code duplication and add a dependency here. Thoughts?

[jfversluis]

We might want to check this with @Redth who has https://github.com/Redth/BigIslandBarcoding/tree/refactor-cameraview with a CameraView and additional barcode scanning (latter in a separate package) he wishes to donate