Freigeben über

Kameraansicht

Der CameraView ermöglicht es, eine Verbindung zu einer Kamera herzustellen, eine Vorschau der Kamera anzuzeigen, Fotos aufzunehmen und Videos aufzuzeichnen. Das CameraView bietet Funktionen zur Unterstützung der Steuerung des Blitzes und der Taschenlampe, zur Anpassung des Zooms, zum Speichern erfasster Medien in einer Datei und zur Bereitstellung unterschiedlicher Ereignishooks.

In den folgenden Abschnitten wird schrittweise erläutert, wie Sie CameraView in einer .NET MAUI-Anwendung verwenden. Sie verlassen sich auf die Verwendung eines CameraViewModel. das als BindingContext des Beispiels CameraViewPage festgelegt wird.

Plattformspezifische Initialisierung

Der CameraView ist Teil des Nuget-Pakets CommunityToolkit.Maui.Camera. Informationen zur ersten Verwendung von CameraView finden Sie im Abschnitt Erste Schritte. Das folgende plattformspezifische Setup ist erforderlich.

Die folgenden Berechtigungen müssen der Platforms/Android/AndroidManifest.xml-Datei hinzugefügt werden:

<uses-permission android:name="android.permission.CAMERA" />

Für den Fall, dass Sie ein Video aufzeichnen möchten, fordern Sie Mikrofonberechtigungen an:

<uses-permission android:name="android.permission.RECORD_AUDIO" />

Dies sollte innerhalb des <manifest>-Elements hinzugefügt werden. Nachfolgend sehen Sie ein vollständiges Beispiel:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <application android:allowBackup="true" android:icon="@mipmap/appicon" android:roundIcon="@mipmap/appicon_round" android:supportsRtl="true" />

    <uses-permission android:name="android.permission.CAMERA" />

    <!--Optional. Only for video recording-->
    <uses-permission android:name="android.permission.RECORD_AUDIO" />

</manifest>

Grundlegende Verwendung

CameraView kann auf folgende Weise einer .NET MAUI-Anwendung hinzugefügt werden.

Berechtigungen anfordern

Entwickler müssen "Permissions.Camera" und/oder "Permissions.Microphone" manuell anfordern:

var cameraPermissionsRequest = await Permissions.RequestAsync<Permissions.Camera>();

Für den Fall, dass Sie ein Video aufzeichnen möchten, fordern Sie Mikrofonberechtigungen an:

var microphonePermissionsRequest = await Permissions.RequestAsync<Permissions.Microphone>();

Einbinden des XAML-Namespace

Um das Toolkit in XAML verwenden zu können, muss der folgende xmlns-Abschnitt zu Ihrer Seite oder Ansicht hinzugefügt werden:

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

Daher das Folgende:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

</ContentPage>

Würde geändert werden, um das xmlns wie folgt einzubinden:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

</ContentPage>

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30">
        <toolkit:CameraView 
            Grid.ColumnSpan="3" 
            Grid.Row="0" />
    </Grid>

</ContentPage>

Das Ergebnis ist eine Oberfläche, die die Ausgabe der mit dem Gerät verbundenen Standardkamera rendert.

Zugreifen auf die aktuelle Kamera

Die SelectedCamera-Eigenschaft bietet die Möglichkeit, auf die aktuell ausgewählte Kamera zuzugreifen.

Das folgende Beispiel zeigt, wie Sie die SelectedCamera-Eigenschaft von CameraView an eine Eigenschaft des CameraViewModel mit demselben Namen (SelectedCamera) binden.

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView 
            Grid.ColumnSpan="3" 
            Grid.Row="0" 
            SelectedCamera="{Binding SelectedCamera}" />
    </Grid>

</ContentPage>

Zoomsteuerung

Die SelectedCamera-Eigenschaft bietet sowohl eine MinimumZoomFactor- als auch eine MaximumZoomFactor-Eigenschaft, die beide schreibgeschützt sind. Sie bieten Entwickler*innen eine programmgesteuerte Möglichkeit zu bestimmen, welchen Zoom sie auf die aktuelle Kamera anwenden können. Um den Zoom auf der aktuellen Kamera zu ändern, stellt CameraView die ZoomFactor-Eigenschaft bereit.

Hinweis

Wenn ein Wert außerhalb des MinimumZoomFactor und MaximumZoomFactor bereitgestellt wird, wird CameraView den Wert einklammern, um ihn innerhalb der Grenzen zu halten.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Slider hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die Maximum-Eigenschaft des Slider an den MaximumZoomFactor der SelectedCamera-Eigenschaft.
  • Binden Sie die Minimum-Eigenschaft des Slider an den MinimumZoomFactor der SelectedCamera-Eigenschaft.
  • Binden Sie die Value-Eigenschaft des Slider an die CurrentZoom-Eigenschaft der CameraViewModel-Klasse.

Die endgültige Änderung umfasst das Binden der ZoomFactor-Eigenschaft von CameraView an die CurrentZoom-Eigenschaft der CameraViewModel-Klasse.

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView 
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>
    </Grid>

</ContentPage>

Kamerablitzmodus

CameraView bietet die Möglichkeit, den Blitzmodus auf dem Gerät programmgesteuert zu ändern. Die folgenden Optionen sind möglich:

  • Off: der Blitz ist ausgeschaltet und wird nicht verwendet.
  • On: der Blitz ist eingeschaltet und wird immer verwendet.
  • Auto: der Blitz wird automatisch basierend auf den Beleuchtungsbedingungen verwendet.

Die SelectedCamera-Eigenschaft stellt außerdem IsFlashSupported bereit. So kann ermittelt werden, ob die aktuell ausgewählte Kamera über einen Blitz verfügt, der gesteuert werden kann.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Picker hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die IsVisible-Eigenschaft des Picker an den IsFlashSupported der SelectedCamera-Eigenschaft.
  • Binden Sie die ItemsSource-Eigenschaft des Picker an die FlashModes-Eigenschaft der CameraViewModel-Klasse – eine einfache Liste der möglichen Werte der CameraFlashMode-Enumeration.
  • Binden Sie die SelectedItem-Eigenschaft des Picker an die FlashMode-Eigenschaft der CameraViewModel-Klasse.

Die endgültige Änderung umfasst das Binden der CameraFlashMode-Eigenschaft von CameraView an die FlashMode-Eigenschaft der CameraViewModel-Klasse.

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView 
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}"
            CameraFlashMode="{Binding FlashMode}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>

        <Picker 
            Grid.Column="1"
            Grid.Row="1"
            Title="Flash"
            IsVisible="{Binding Path=SelectedCamera.IsFlashSupported, FallbackValue=false}"
            ItemsSource="{Binding FlashModes}"
            SelectedItem="{Binding FlashMode}" />
    </Grid>

</ContentPage>

Bildaufnahmeauflösung

CameraView bietet die Möglichkeit, die Auflösung für Bilder, die von der aktuellen Kamera aufgenommen werden, programmgesteuert zu ändern.

Hinweis

Dadurch wird die in der Vorschau der Kamera angezeigte Auflösung nicht verändert.

Die SelectedCamera-Eigenschaft stellt auch SupportedResolutions bereit. So kann ermittelt werden, welche Auflösungen die aktuelle Kamera unterstützt.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Picker hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die ItemsSource-Eigenschaft des Picker an den SupportedResolutions der SelectedCamera-Eigenschaft.
  • Binden Sie die SelectedItem-Eigenschaft des Picker an die SelectedResolution-Eigenschaft der CameraViewModel-Klasse.

Die endgültige Änderung umfasst das Binden der ImageCaptureResolution-Eigenschaft von CameraView an die SelectedResolution-Eigenschaft der CameraViewModel-Klasse.

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView 
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}"
            CameraFlashMode="{Binding FlashMode}"
            ImageCaptureResolution="{Binding SelectedResolution}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>

        <Picker 
            Grid.Column="1"
            Grid.Row="1"
            Title="Flash"
            IsVisible="{Binding Path=SelectedCamera.IsFlashSupported, FallbackValue=false}"
            ItemsSource="{Binding FlashModes}"
            SelectedItem="{Binding FlashMode}" />

        <Picker 
            Grid.Column="2"
            Grid.Row="1"
            Title="Available Resolutions"
            ItemsSource="{Binding SelectedCamera.SupportedResolutions}"
            SelectedItem="{Binding SelectedResolution}" />
    </Grid>

</ContentPage>

BildAufnehmen

Die CameraView bietet die Möglichkeit, Bildaufnahmen programmgesteuert auszulösen. Dies ist sowohl über die CaptureImage-Methode als auch mit CaptureImageCommand möglich.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Button hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die Command-Eigenschaft von Button an die CaptureImageCommand-Eigenschaft von CameraView.
<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView
            x:Name="Camera" 
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}"
            CameraFlashMode="{Binding FlashMode}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>

        <Picker 
            Grid.Column="1"
            Grid.Row="1"
            Title="Flash"
            IsVisible="{Binding Path=SelectedCamera.IsFlashSupported, FallbackValue=false}"
            ItemsSource="{Binding FlashModes}"
            SelectedItem="{Binding FlashMode}" />

        <Picker 
            Grid.Column="2"
            Grid.Row="1"
            Title="Available Resolutions"
            ItemsSource="{Binding SelectedCamera.SupportedResolutions}"
            SelectedItem="{Binding SelectedResolution}" />

        <Button
            Grid.Column="0"
            Grid.Row="2"
            Command="{Binding CaptureImageCommand, Source={x:Reference Camera}}"
            Text="Capture Image" />
    </Grid>

</ContentPage>

Hinweis

Um das Bild zu verwenden, das erfasst wurde, stellt CameraView das MediaCaptured-Ereignis bereit.

Im folgenden Beispiel wird die Verwendung der CaptureImage Methode veranschaulicht:

Hinweis

Der folgende C#-Code verwendet das oben in XAML definierte Kamerafeld (<toolkit:CameraView x:Name="Camera" />)

async void HandleCaptureButtonTapped(object? sender, EventArgs e)
{
    try
    {
        // Use the Camera field defined above in XAML (`<toolkit:CameraView x:Name="Camera" />`)
        var captureImageCTS = new CancellationTokenSource(TimeSpan.FromSeconds(3));
        Stream stream = await Camera.CaptureImage(captureImageCTS.Token);
    }
    catch(Exception e)
    {
        // Handle Exception
        Trace.WriteLine(e);
    }
}

Videoaufzeichnung

Dies CameraView bietet die Möglichkeit, Videos aufzuzeichnen. Dies ist sowohl über die StartVideoRecording-Methode als auch mit StartVideoRecordingCommand möglich.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Button hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die Command-Eigenschaft von Button an die StartVideoRecordingCommand-Eigenschaft von CameraView.
<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView
            x:Name="Camera" 
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}"
            CameraFlashMode="{Binding FlashMode}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>

        <Picker 
            Grid.Column="1"
            Grid.Row="1"
            Title="Flash"
            IsVisible="{Binding Path=SelectedCamera.IsFlashSupported, FallbackValue=false}"
            ItemsSource="{Binding FlashModes}"
            SelectedItem="{Binding FlashMode}" />

        <Picker 
            Grid.Column="2"
            Grid.Row="1"
            Title="Available Resolutions"
            ItemsSource="{Binding SelectedCamera.SupportedResolutions}"
            SelectedItem="{Binding SelectedResolution}" />

        <Button Clicked="StartCameraRecording"
                Text="StartVideoRecording" />

        <Button Command="{Binding StartVideoRecordingCommand, Source={x:Reference Camera}, x:DataType=toolkit:CameraView}"
                CommandParameter="{Binding Stream}"
                Text="StartVideoRecording" />

        <Button Command="{Binding StopVideoRecordingCommand, Source={x:Reference Camera}, x:DataType=toolkit:CameraView}"
                CommandParameter="{Binding Token}"
                Text="StopVideoRecording" />
    </Grid>

</ContentPage>

Hinweis

Sie müssen einen sauberen Datenstrom bereitstellen, um das Video aufzuzeichnen.

Im folgenden Beispiel wird die Verwendung der StartVideoRecording Methode veranschaulicht:

Hinweis

Der folgende C#-Code verwendet das oben in XAML definierte Kamerafeld (<toolkit:CameraView x:Name="Camera" />)

async void StartCameraRecordingWithCustomStream(object? sender, EventArgs e)
{
    using var threeSecondVideoRecordingStream = new FileStream("recording.mp4", FileMode.Create);
    await Camera.StartVideoRecording(threeSecondVideoRecordingStream, CancellationToken.None);

    await Task.Delay(TimeSpan.FromSeconds(3));
    
    await Camera.StopVideoRecording(CancellationToken.None);
    await FileSaver.SaveAsync("recording.mp4", threeSecondVideoRecordingStream);
}

Wenn Sie ein kurzes Video aufnehmen und ein Video in MemoryStream aufzeichnen möchten, können Sie die nächste Überladung der Funktion VideoRecording verwenden:

async void StartCameraRecording(object? sender, EventArgs e)
{
    await Camera.StartVideoRecording(CancellationToken.None);
    
    await Task.Delay(TimeSpan.FromSeconds(3));
    
    var threeSecondVideoRecordingStream = await Camera.StopVideoRecording(CancellationToken.None);
    await FileSaver.SaveAsync("recording.mp4", threeSecondVideoRecordingStream);
}

Vorschau starten

CameraView bietet die Möglichkeit, die Vorschau programmgesteuert über die Kamera zu starten. Dies ist sowohl über die StartCameraPreview-Methode als auch mit StartCameraPreviewCommand möglich.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Button hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die Command-Eigenschaft von Button an die StartCameraPreviewCommand-Eigenschaft von CameraView.
<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView
            x:Name="Camera"  
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}"
            CameraFlashMode="{Binding FlashMode}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>

        <Picker 
            Grid.Column="1"
            Grid.Row="1"
            Title="Flash"
            IsVisible="{Binding Path=SelectedCamera.IsFlashSupported, FallbackValue=false}"
            ItemsSource="{Binding FlashModes}"
            SelectedItem="{Binding FlashMode}" />

        <Picker 
            Grid.Column="2"
            Grid.Row="1"
            Title="Available Resolutions"
            ItemsSource="{Binding SelectedCamera.SupportedResolutions}"
            SelectedItem="{Binding SelectedResolution}" />

        <Button
            Grid.Column="0"
            Grid.Row="2"
            Command="{Binding CaptureImageCommand, Source={x:Reference Camera}}"
            Text="Capture Image" />

        <Button
            Grid.Column="1"
            Grid.Row="2"
            Command="{Binding StartCameraPreviewCommand, Source={x:Reference Camera}}"
            Text="Start Preview" />
    </Grid>

</ContentPage>

Im folgenden Beispiel wird die Verwendung der StartCameraPreview Methode veranschaulicht:

Hinweis

Der folgende C#-Code verwendet das oben in XAML definierte Kamerafeld (<toolkit:CameraView x:Name="Camera" />)

async void HandleStartCameraPreviewButtonTapped(object? sender, EventArgs e)
{

    try
    {
        var startCameraPreviewTCS = new CancellationTokenSource(TimeSpan.FromSeconds(3));

        // Use the Camera field defined above in XAML (`<toolkit:CameraView x:Name="Camera" />`)
        await Camera.StartCameraPreview(startCameraPreviewTCS.Token);
    }
    catch(Exception e)
    {
        // Handle Exception
        Trace.WriteLine(e);
    }
}

Vorschau beenden

CameraView bietet die Möglichkeit, die Vorschau programmgesteuert über die Kamera zu stoppen. Dies ist sowohl über die StopCameraPreview-Methode als auch mit StopCameraPreviewCommand möglich.

Das folgende Beispiel zeigt, wie Sie der Anwendung einen Button hinzufügen und die folgenden Bindungen einrichten:

  • Binden Sie die Command-Eigenschaft von Button an die StopCameraPreviewCommand-Eigenschaft von CameraView.
<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.CameraViewPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    
    <Grid ColumnDefinitions="*,*,*" RowDefinitions="*,30,30">
        <toolkit:CameraView
            x:Name="Camera"  
            Grid.ColumnSpan="3" 
            Grid.Row="0"
            SelectedCamera="{Binding SelectedCamera}"
            ZoomFactor="{Binding CurrentZoom}"
            CameraFlashMode="{Binding FlashMode}" />

        <Slider 
            Grid.Column="0"
            Grid.Row="1"
            Value="{Binding CurrentZoom}"
            Maximum="{Binding SelectedCamera.MaximumZoomFactor, FallbackValue=1}"
            Minimum="{Binding SelectedCamera.MinimumZoomFactor, FallbackValue=1}"/>

        <Picker 
            Grid.Column="1"
            Grid.Row="1"
            Title="Flash"
            IsVisible="{Binding Path=SelectedCamera.IsFlashSupported, FallbackValue=false}"
            ItemsSource="{Binding FlashModes}"
            SelectedItem="{Binding FlashMode}" />

        <Picker 
            Grid.Column="2"
            Grid.Row="1"
            Title="Available Resolutions"
            ItemsSource="{Binding SelectedCamera.SupportedResolutions}"
            SelectedItem="{Binding SelectedResolution}" />

        <Button
            Grid.Column="0"
            Grid.Row="2"
            Command="{Binding CaptureImageCommand, Source={x:Reference Camera}}"
            Text="Capture Image" />

        <Button
            Grid.Column="1"
            Grid.Row="2"
            Command="{Binding StartCameraPreviewCommand, Source={x:Reference Camera}}"
            Text="Start Preview" />

        <Button
            Grid.Column="2"
            Grid.Row="2"
            Command="{Binding StopCameraPreviewCommand, Source={x:Reference Camera}}"
            Text="Stop Preview" />
    </Grid>

</ContentPage>

Im folgenden Beispiel wird die Verwendung der StopCameraPreview Methode veranschaulicht:

Hinweis

Der folgende C#-Code verwendet das oben in XAML definierte Kamerafeld (<toolkit:CameraView x:Name="Camera" />)

void HandleStopCameraPreviewButtonTapped(object? sender, EventArgs e)
{

    try
    {
        // Use the Camera field defined above in XAML (`<toolkit:CameraView x:Name="Camera" />`)
        Camera.StopCameraPreview();
    }
    catch(Exception e)
    {
        // Handle Exception
        Trace.WriteLine(e);
    }
}

Eigenschaften

Eigentum Typ Beschreibung Standardwert
CameraFlashMode CameraFlashMode Ruft den Blitzmodus für die Kamera ab oder legt ihn fest. Dies ist eine bindbare Eigenschaft. CameraFlashMode.Off
ImageCaptureResolution Size Ruft die Auflösung für die Bildaufnahme ab oder legt sie fest. Wirkt sich nicht auf die Vorschauauflösung aus. Dies ist eine bindbare Eigenschaft. Size.Zero
IsAvailable bool Ruft ab, ob die Kamera auf dem Gerät verfügbar ist. Diese bindbare Eigenschaft ist schreibgeschützt. false
IsBusy bool Ruft ab, ob die Kamera aktuell ausgelastet ist (z. B. Aufnehmen eines Bilds oder einer Aufzeichnung). Diese bindbare Eigenschaft ist schreibgeschützt. false
IsTorchOn bool Ruft ab oder legt fest, ob der Kamerablitz (Taschenlampe) aktiviert ist. Dies ist eine bindbare Eigenschaft. false
SelectedCamera CameraInfo? Ruft das aktuell ausgewählte Kameragerät ab oder legt es fest. Dies ist eine bindungsfähige Eigenschaft mit bidirektionaler Bindung. null
ZoomFactor float Ruft den Zoomfaktor der Kamera ab oder legt ihn fest. Der Wert wird automatisch auf den Bereich der ausgewählten Kamera MinimumZoomFactor und MaximumZoomFactor begrenzt. Dies ist eine bindbare Eigenschaft. 1f

Befehle

Befehl Befehlsparameter Beschreibung
CaptureImageCommand — Startet eine Bildaufnahme. Das aufgenommene Bild wird über das MediaCaptured Ereignis zurückgegeben.
StartCameraPreviewCommand — Startet die Kameravorschauanzeige.
StartVideoRecordingCommand Stream (wahlweise) Startet die Videoaufzeichnung. Optional können Sie ein Stream angeben, in das aufgezeichnet wird.
StopCameraPreviewCommand — Beendet die Kameravorschauanzeige.
StopVideoRecordingCommand — Beendet die Videoaufzeichnung und gibt den aufgezeichneten Datenstrom zurück.

Ereignisse

Ereignis Typ Beschreibung
MediaCaptured EventHandler<MediaCapturedEventArgs> Wird ausgelöst, wenn ein Bild erfolgreich erfasst wird. Der MediaCapturedEventArgs enthält eine Media-Eigenschaft vom Typ Stream mit den aufgenommenen Bilddaten.
MediaCaptureFailed EventHandler<MediaCaptureFailedEventArgs> Wird ausgelöst, wenn eine Bildaufnahme fehlschlägt. Der MediaCaptureFailedEventArgs enthält eine FailureReason-Eigenschaft mit der Fehlermeldung.

Methodik

Methode Rückgabetyp Beschreibung
CaptureImage(CancellationToken) Task Erfasst ein einzelnes Bild von der Kamera. Das Ergebnis wird über das MediaCaptured Ereignis übermittelt.
GetAvailableCameras(CancellationToken) ValueTask<IReadOnlyList<CameraInfo>> Ruft eine Liste der verfügbaren Kamerageräte auf dem Gerät ab.
StartCameraPreview(CancellationToken) Task Startet die Anzeige der Kameravorschau.
StartVideoRecording(CancellationToken) Task Startet das Aufzeichnen von Videos in einem internen MemoryStream.
StartVideoRecording(Stream, CancellationToken) Task Startet die Aufzeichnung des Videos mit der bereitgestellten Stream.
StopCameraPreview() void Beendet die Anzeige der Kameravorschau.
StopVideoRecording(CancellationToken) Task<Stream> Beendet die Videoaufzeichnung und gibt den aufgezeichneten Wert zurück Stream.

CameraInfo

Die CameraInfo Klasse stellt Informationen zu einem Kameragerät dar, das auf dem System verfügbar ist.

Eigentum Typ Beschreibung
DeviceId string Der eindeutige Bezeichner des Kamerageräts.
IsFlashSupported bool Gibt an, ob die Kamera Blitz unterstützt.
MaximumZoomFactor float Der maximal unterstützte Zoomfaktor.
MinimumZoomFactor float Der minimale unterstützte Zoomfaktor.
Name string Der Name des Kamerageräts.
Position CameraPosition Die physische Position der Kamera auf dem Gerät (Front, Rearoder Unknown).
SupportedResolutions IReadOnlyList<Size> Die Liste der auflösungen, die von der Kamera für die Bildaufnahme unterstützt werden.

Kamerablitzmodus

Die CameraFlashMode Enum definiert die verfügbaren Blitzmodi.

Wert Beschreibung
Off Der Blitz ist deaktiviert und wird nicht verwendet.
On Der Blitz ist eingeschaltet und wird immer verwendet.
Auto Der Blitz wird automatisch basierend auf den Beleuchtungsbedingungen verwendet.

CameraPosition

Die CameraPosition Enum definiert die möglichen physischen Positionen einer Kamera auf einem Gerät.

Wert Beschreibung
Unknown Die Kameraposition ist unbekannt.
Front Die Kamera befindet sich an der Vorderseite des Geräts (zur Benutzerseite gerichtet).
Rear Die Kamera befindet sich auf der Rückseite des Geräts (mit Blick vom Benutzer weg).

Beispiele

Sie finden ein Beispiel für dieses Feature in Aktion in der Beispielanwendung für das .NET MAUI Community Toolkit.

Programmierschnittstelle (API)

Sie finden den Quellcode für CameraView über das GitHub-Repository für das .NET MAUI Community Toolkit.

  • Last updated on