Windows の組み込みカメラ UI を使った写真とビデオのキャプチャ

[アーティクル]
07/13/2023

この記事では、CameraCaptureUI クラスを使用して、Windows に組み込まれているカメラ UI で写真またはビデオをキャプチャする方法を説明します。この機能の使い方は簡単です。わずか数行のコードで、ユーザーがキャプチャした写真やビデオをアプリに取り込むことができます。

独自のカメラ用 UI を用意する場合、またはキャプチャ操作に対してより堅牢で低レベルな制御が必要な場合は、MediaCapture クラスを使用して、独自のキャプチャ操作を実装する必要があります。詳しくは、「MediaCapture を使った基本的な写真、ビデオ、およびオーディオのキャプチャ」をご覧ください。

注意

アプリで CameraCaptureUI のみを使用する場合は、アプリのマニフェストファイルで Web カメラまたはマイク機能を指定しないでください。指定すると、アプリはデバイスのカメラのプライバシー設定に表示されますが、ユーザーがアプリからのカメラへのアクセスを拒否しても、CameraCaptureUI はメディアをキャプチャできます。

これは、Windows の組み込みのカメラアプリが、写真、音声、ビデオのキャプチャをボタンを押して開始する必要がある、信頼されているファーストパーティアプリであるためです。アプリが CameraCaptureUI を唯一の写真キャプチャメカニズムとして使用していて、Web カメラまたはマイク機能を指定している場合、ストアに提出するときに Windows アプリケーション認定キット認定が認められない可能性があります。

MediaCapture を使用して、音声、写真、またはビデオをプログラムによってキャプチャする場合は、アプリのマニフェストファイルで Web カメラまたはマイク機能を指定する必要があります。

CameraCaptureUI を使った写真のキャプチャ

カメラキャプチャ UI を使うには、プロジェクトに Windows.Media.Capture 名前空間を含めます。返された画像ファイルでファイル操作を行うには、Windows.Storage を含めます。

using Windows.Media.Capture;
using Windows.Storage;

#include <winrt/Windows.Media.Capture.h>
#include <winrt/Windows.Media.Playback.h>
#include <winrt/Windows.Storage.h>
using namespace winrt;
using namespace Windows::Media::Capture;
using namespace Windows::Storage;

写真をキャプチャするには、新しい CameraCaptureUI オブジェクトを作成します。オブジェクトの PhotoSettings プロパティを使うと、写真の画像形式など、返される写真のプロパティを指定することができます。既定では、カメラのキャプチャ UI では、返される前に写真をトリミングすることができます。これは、AllowCropping プロパティを使用して無効にすることができます。この例では、CroppedSizeInPixels を設定して、返される画像のサイズが 200 x 200 ピクセルになるよう要求しています。

注意

モバイルデバイスファミリのデバイスでは、CameraCaptureUI での画像のトリミングはサポートされていません。アプリがこれらのデバイスで実行されている場合、AllowCropping プロパティの値は無視されます。

写真をキャプチャすることを指定するには、CaptureFileAsync を呼び出して、CameraCaptureUIMode.Photo を指定します。キャプチャに成功すると、このメソッドは、画像が格納された StorageFile インスタンスを返します。ユーザーがキャプチャを取り消した場合、返されるオブジェクトは null になります。

CameraCaptureUI captureUI = new CameraCaptureUI();
captureUI.PhotoSettings.Format = CameraCaptureUIPhotoFormat.Jpeg;
captureUI.PhotoSettings.CroppedSizeInPixels = new Size(200, 200); 

StorageFile photo = await captureUI.CaptureFileAsync(CameraCaptureUIMode.Photo);

if (photo == null)
{
    // User cancelled photo capture
    return;
}

CameraCaptureUI captureUI;
captureUI.PhotoSettings().Format(CameraCaptureUIPhotoFormat::Jpeg);
captureUI.PhotoSettings().CroppedSizeInPixels({ 200, 200 });

StorageFile photo = co_await captureUI.CaptureFileAsync(CameraCaptureUIMode::Photo);

if (!photo)
{
    // User cancelled photo capture
    co_return;
}

キャプチャした写真が格納されている StorageFile は、動的に生成された名前が付けられて、アプリのローカルフォルダーに保存されます。キャプチャした写真をわかりやすく整理するため、別のフォルダーにファイルを移動することができます。

StorageFolder destinationFolder = 
    await ApplicationData.Current.LocalFolder.CreateFolderAsync("ProfilePhotoFolder", 
        CreationCollisionOption.OpenIfExists);

await photo.CopyAsync(destinationFolder, "ProfilePhoto.jpg", NameCollisionOption.ReplaceExisting);
await photo.DeleteAsync();

StorageFolder destinationFolder =
    co_await ApplicationData::Current().LocalFolder().CreateFolderAsync(L"ProfilePhotoFolder",
        CreationCollisionOption::OpenIfExists);

co_await photo.CopyAsync(destinationFolder, L"ProfilePhoto.jpg", NameCollisionOption::ReplaceExisting);
co_await photo.DeleteAsync();

アプリで写真を使用するために、SoftwareBitmapオブジェクトを作成できます。このオブジェクトは、ユニバーサル Windows アプリのさまざまな機能で使用できます。

まず、プロジェクトに Windows.Graphics.Imaging 名前空間を含めます。

using Windows.Storage.Streams;
using Windows.Graphics.Imaging;

#include <winrt/Windows.Graphics.Imaging.h>
#include <winrt/Windows.Storage.Streams.h>
using namespace Windows::Graphics::Imaging;
using namespace Windows::Storage::Streams;

画像ファイルからストリームを取得するには、OpenAsync を呼び出します。ストリームのビットマップデコーダーを取得するには、BitmapDecoder.CreateAsync を呼び出します。次に、GetSoftwareBitmap を呼び出して、画像の SoftwareBitmap 表現を取得します。

IRandomAccessStream stream = await photo.OpenAsync(FileAccessMode.Read);
BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
SoftwareBitmap softwareBitmap = await decoder.GetSoftwareBitmapAsync();

IRandomAccessStream stream = co_await photo.OpenAsync(FileAccessMode::Read);
BitmapDecoder decoder = co_await BitmapDecoder::CreateAsync(stream);
SoftwareBitmap softwareBitmap = co_await decoder.GetSoftwareBitmapAsync();

UI に画像を表示するには、XAML ページで Image コントロールを宣言します。

<Image x:Name="imageControl" Width="200" Height="200"/>

<Image x:Name="imageControl" Width="200" Height="200"/>

XAML ページでソフトウェアビットマップを使用するには、Windows.UI.Xaml.Media.Imaging 名前空間の using 指定を含めます。

using Windows.UI.Xaml.Media.Imaging;

#include <winrt/Windows.UI.Xaml.Media.Imaging.h>
using namespace Windows::UI::Xaml::Media::Imaging;

Image コントロールでは、画像ソースが事前乗算済みアルファを含む (またはアルファを含まない) BGRA8 形式である必要があります。静的メソッドの SoftwareBitmap.Convert を呼び出して、目的の形式の新しいソフトウェアビットマップを作成します。次に、新しい SoftwareBitmapSource オブジェクトを作成して SetBitmapAsync を呼び出し、ソフトウェアビットマップをソースに割り当てます。最後に、キャプチャした写真を UI に表示できるように、Image コントロールの Source プロパティを設定します。

SoftwareBitmap softwareBitmapBGR8 = SoftwareBitmap.Convert(softwareBitmap,
        BitmapPixelFormat.Bgra8, 
        BitmapAlphaMode.Premultiplied);

SoftwareBitmapSource bitmapSource = new SoftwareBitmapSource();
await bitmapSource.SetBitmapAsync(softwareBitmapBGR8);

imageControl.Source = bitmapSource;

SoftwareBitmap softwareBitmapBGR8 = SoftwareBitmap::Convert(softwareBitmap,
    BitmapPixelFormat::Bgra8,
    BitmapAlphaMode::Premultiplied);

SoftwareBitmapSource bitmapSource;
co_await bitmapSource.SetBitmapAsync(softwareBitmapBGR8);

imageControl().Source(bitmapSource);

CameraCaptureUI を使ったビデオのキャプチャ

ビデオをキャプチャするには、新しい CameraCaptureUI オブジェクトを作成します。オブジェクトの VideoSettings プロパティを使うと、ビデオの形式など、返されるビデオのプロパティを指定することができます。

ビデオをキャプチャするには、CaptureFileAsync を呼び出して、Video を指定します。キャプチャに成功すると、このメソッドは、ビデオが格納された StorageFile インスタンスを返します。キャプチャを取り消した場合、返されるオブジェクトは null になります。

CameraCaptureUI captureUI = new CameraCaptureUI();
captureUI.VideoSettings.Format = CameraCaptureUIVideoFormat.Mp4;

StorageFile videoFile = await captureUI.CaptureFileAsync(CameraCaptureUIMode.Video);

if (videoFile == null)
{
    // User cancelled photo capture
    return;
}

CameraCaptureUI captureUI;
captureUI.VideoSettings().Format(CameraCaptureUIVideoFormat::Mp4);

StorageFile videoFile = co_await captureUI.CaptureFileAsync(CameraCaptureUIMode::Video);

if (!videoFile)
{
    // User cancelled photo capture
    co_return;
}

キャプチャしたビデオファイルをどのように使うかは、アプリのシナリオによって異なります。この記事の残りの部分では、キャプチャした 1 つ以上のビデオからメディアコンポジションをすばやく作成し、UI に表示する方法を説明します。

まず、ビデオコンポジションを表示する MediaPlayerElement コントロールを XAML ページに追加します。

<MediaPlayerElement x:Name="mediaPlayerElement" Width="320" Height="240" AreTransportControlsEnabled="True"/>

カメラキャプチャ UI からビデオファイルが返されたら、CreateFromStorageFile を呼び出して、新しい MediaSource を作成します。 MediaPlayerElement に関連付けられている既定の MediaPlayer の Play メソッドを呼び出してビデオを再生します。

mediaPlayerElement.Source = MediaSource.CreateFromStorageFile(videoFile);
mediaPlayerElement.MediaPlayer.Play();

mediaPlayerElement().Source(MediaSource::CreateFromStorageFile(videoFile));
mediaPlayerElement().MediaPlayer().Play();

次の方法で共有

Windows の組み込みカメラ UI を使った写真とビデオのキャプチャ

CameraCaptureUI を使った写真のキャプチャ

CameraCaptureUI を使ったビデオのキャプチャ

フィードバック

その他のリソース

次の方法で共有

Windows の組み込みカメラ UI を使った写真とビデオのキャプチャ

CameraCaptureUI を使った写真のキャプチャ

CameraCaptureUI を使ったビデオのキャプチャ

関連トピック

フィードバック

その他のリソース