Sélecteur de médias pour les photos et les vidéos

Browse sample.Parcourez l’exemple. Parcourir l'exemple

Dans cet article, vous apprendrez à utiliser l’interface de l’application multiplateforme .NET (.NET MAUI). Cette interface permet aux utilisateurs de choisir ou de prendre une photo ou une vidéo sur l’appareil.

L’implémentation par défaut de l’interface IMediaPicker est disponible via la propriété MediaPicker.Default. Les deux, l'interface IMediaPicker et la classe MediaPicker, sont contenus dans l'espace de noms Microsoft.Maui.Media.

Démarrage

Pour accéder à la fonctionnalité de sélecteur de médias, la configuration suivante spécifique à la plateforme est requise.

L'autorisation CAMERA est obligatoire et doit être configurée dans le projet Android. De plus :

  • Si votre application cible Android 12 ou une version antérieure, vous devez demander les autorisations READ_EXTERNAL_STORAGE et WRITE_EXTERNAL_STORAGE.

  • Si votre application cible Android 13 ou une version ultérieure et qu'elle doit accéder aux fichiers multimédias créés par d'autres applications, vous devez demander une ou plusieurs des autorisations média granulaires suivantes, au lieu de l'autorisation READ_EXTERNAL_STORAGE :

    • READ_MEDIA_IMAGES
    • READ_MEDIA_VIDEO
    • READ_MEDIA_AUDIO

Ces autorisations peuvent être ajoutées de plusieurs façons, comme indiqué ci-dessous :

  • Ajoutez les autorisations basées sur l’assembly :

    Ouvrez le fichier Platforms/Android/MainApplication.cs et ajoutez les attributs d'assemblage suivants après les directives using :

    // Needed for Picking photo/video
[assembly: UsesPermission(Android.Manifest.Permission.ReadExternalStorage, MaxSdkVersion = 32)]
[assembly: UsesPermission(Android.Manifest.Permission.ReadMediaAudio)]
[assembly: UsesPermission(Android.Manifest.Permission.ReadMediaImages)]
[assembly: UsesPermission(Android.Manifest.Permission.ReadMediaVideo)]

// Needed for Taking photo/video
[assembly: UsesPermission(Android.Manifest.Permission.Camera)]
[assembly: UsesPermission(Android.Manifest.Permission.WriteExternalStorage, MaxSdkVersion = 32)]

// Add these properties if you would like to filter out devices that do not have cameras, or set to false to make them optional
[assembly: UsesFeature("android.hardware.camera", Required = true)]
[assembly: UsesFeature("android.hardware.camera.autofocus", Required = true)]

    - ou -

  • Mettez à jour le manifeste Android :

    Ouvrez le fichier Plateformes/Android/AndroidManifest.xml et ajoutez le code suivant dans le manifest:

    <!-- Needed for Picking photo/video -->
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" android:maxSdkVersion="32" />
<uses-permission android:name="android.permission.READ_MEDIA_AUDIO" />
<uses-permission android:name="android.permission.READ_MEDIA_IMAGES" />
<uses-permission android:name="android.permission.READ_MEDIA_VIDEO" />

<!-- Needed for Taking photo/video -->
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:maxSdkVersion="32" />

<!-- Add these properties if you would like to filter out devices that do not have cameras, or set to false to make them optional -->
<uses-feature android:name="android.hardware.camera" android:required="true" />
<uses-feature android:name="android.hardware.camera.autofocus" android:required="true" />

    - ou -

  • Mettez à jour le manifeste Android dans l’éditeur de manifeste :

    Dans Visual Studio, double-cliquez sur le fichier Plateformes/Android/AndroidManifest.xml pour ouvrir l’éditeur de manifeste Android. Ensuite, dans Autorisations requises, activez les autorisations répertoriées ci-dessus. Cela met automatiquement à jour le fichier AndroidManifest.xml.

Si la version cible d'Android de votre projet est définie sur Android 11 (R API 30) ou une version ultérieure, vous devez mettre à jour votre Android Manifest avec les requêtes correspondant aux exigences de visibilité des packages d’Android.

Dans le fichier Platforms/Android/AndroidManifest.xml, ajoutez les nœuds queries/intent dans le nœud manifest :

<queries>
  <intent>
    <action android:name="android.media.action.IMAGE_CAPTURE" />
  </intent>
</queries>

Utilisation du sélecteur de médias

L’interface IMediaPicker a les méthodes suivantes qui retournent un FileResult, qui peut être utilisé pour obtenir l’emplacement du fichier ou le lire.

Chaque méthode peut éventuellement prendre un paramètre MediaPickerOptions qui permet de définir le Title sur certains systèmes d’exploitation, ce qui s’affiche à l’utilisateur.

Dans .NET 10, le sélecteur de médias ajoute la prise en charge de la multi-sélection ainsi que de nouvelles options de traitement. Utilisez les méthodes suivantes :

  • PickPhotosAsync (renvoie List<FileResult>)
    Ouvre le navigateur multimédia pour sélectionner une ou plusieurs photos.

  • CapturePhotoAsync (renvoie FileResult?)
    Ouvre l’appareil photo pour prendre une photo.

  • PickVideosAsync (renvoie List<FileResult>)
    Ouvre le navigateur multimédia pour sélectionner une ou plusieurs vidéos.

  • CaptureVideoAsync (renvoie FileResult?)
    Ouvre l’appareil photo pour prendre une vidéo.

Le MediaPickerOptions paramètre expose des champs supplémentaires tels que SelectionLimit, , MaximumWidthMaximumHeight, CompressionQuality, RotateImage, et PreserveMetaData.

Important

Lorsque l’utilisateur annule une opération à sélection multiple, la liste retournée est vide. Sur Android, certaines interfaces utilisateur du sélecteur peuvent ne pas appliquer SelectionLimit; sous Windows, SelectionLimit n'est pas pris en charge. Implémentez votre propre logique pour appliquer des limites ou avertir l’utilisateur sur ces plateformes.

Choisir plusieurs photos

var results = await MediaPicker.PickPhotosAsync(new MediaPickerOptions
{
  // Default is 1; set to 0 for no limit
  SelectionLimit = 10,
  // Optional processing for images
  MaximumWidth = 1024,
  MaximumHeight = 768,
  CompressionQuality = 85,
  RotateImage = true,
  PreserveMetaData = true,
});

foreach (var file in results)
{
  using var stream = await file.OpenReadAsync();
  // Process the stream
}

Sélectionner plusieurs vidéos

var results = await MediaPicker.PickVideosAsync(new MediaPickerOptions
{
  SelectionLimit = 3,
  Title = "Select up to 3 videos",
});

foreach (var file in results)
{
  using var stream = await file.OpenReadAsync();
  // Process the stream
}

Conseil

Pour une sélection unique, préférez PickPhotosAsync/PickVideosAsync également. Définissez SelectionLimit = 1 (la valeur par défaut) et lisez le premier élément s’il est présent.

Important

Toutes les méthodes doivent être appelées sur le thread d’interface utilisateur, car les vérifications d’autorisation et les demandes sont gérées automatiquement par .NET MAUI.

Prendre une photo

Appelez la méthode CapturePhotoAsync pour ouvrir l’appareil photo et laissez l'utilisateur prendre une photo. Si les utilisateurs prennent une photo, la valeur renvoyée de la méthode est une valeur non nulle. L’exemple de code suivant utilise le sélecteur de médias pour prendre une photo et l’enregistrer dans le répertoire du cache :

public async void TakePhoto()
{
    if (MediaPicker.Default.IsCaptureSupported)
    {
        FileResult photo = await MediaPicker.Default.CapturePhotoAsync();

        if (photo != null)
        {
            // save the file into local storage
            string localFilePath = Path.Combine(FileSystem.CacheDirectory, photo.FileName);

            using Stream sourceStream = await photo.OpenReadAsync();
            using FileStream localFileStream = File.OpenWrite(localFilePath);

            await sourceStream.CopyToAsync(localFileStream);
        }
    }
}

Conseil

La propriété FullPath ne retourne pas toujours le chemin d’accès physique au fichier. Pour obtenir le fichier, utilisez la méthode OpenReadAsync.

  • Last updated on