ScreenCaptureKitによるHDRコンテンツのキャプチャ

ScreenCaptureKitによるHDRコンテンツのキャプチャ

ScreenCaptureKitを使用して、ハイダイナミックカラーをキャプチャする方法を確認しましょう。HDRのサポート、マイクからのキャプチャ、ファイルへの直接的な収録などの新機能もご紹介します。

関連する章
- 0:00 - Introduction and ScreenCaptureKit recap
- 1:20 - Capture HDR content
- 7:14 - Add microphone output
- 8:41 - Record to file
リソース
関連ビデオ

WWDC24
- HDRを使用してアプリのダイナミックイメージ体験を向上
WWDC23
- アプリ内でのHDR画像のサポート
- ScreenCaptureKitの新機能
WWDC22
- ScreenCaptureKitの紹介
- ScreenCaptureKitを次のレベルへ引き上げる
ダウンロード

ようこそ皆さん Benです ScreenCaptureKitチームのソフトウェアエンジニアです毎日多くの人が ScreenCaptureKitを使いビデオ会議で画面を共有し高品質なストリームを世界中の人と共有しスクリーンショットをキャプチャしリモートデスクトップアプリのサポートをしています ScreenCaptureKitを使うとアプリはシステムのUI体験と統合されますアプリには組み込みのピッカーがありストリームコンテンツを選択できるようになっています
発表者用オーバーレイを利用してアプリの画面共有体験を強化できますまたアプリがシステムUIで何を共有しているかプレビューできます今日はScreenCaptureKitを使いアプリで同じような体験を構築する新しい方法を紹介しますアプリにストリーミング機能があるとしますこれからはHDRでストリーミングやスクリーンショットをキャプチャできます現在アプリは画面と音声コンテンツをキャプチャしているかもしれませんが画面と音声サンプルを提供するのと同じストリームからマイク出力を得る方法を紹介します
アプリが収録された画面コンテンツを使用する場合は便利な収録APIに興味を持つでしょう ScreenCaptureKitはアセットの書き込みの詳細をすべて処理します
HDRコンテンツをキャプチャする方法を理解するためにまずは画面と音声のキャプチャの基本について学びましょう
こちらがSCStreamでアプリで画面や音声のサンプルを受信するためのオブジェクトです画面全体または特定のウインドウやアプリをキャプチャするために使用します
ストリームにSCContentFilterを渡して何をキャプチャするかを指定しますストリームの出力をカスタマイズするとしますさまざまな解像度やピクセルフォーマットの指定などですそれにはSCStreamConfigurationでストリーム出力をカスタマイズします
ストリームを設定したら SCStreamOutputを使い画面と音声のサンプルを受け取ることができます
以上がコンテンツを取り込むための基本的な構成要素ですが詳細は以前のScreenCaptureKitのビデオをご覧ください
今年からHDRコンテンツを取り込めるようになりましたハイダイナミックレンジ（HDR）はスタンダードダイナミックレンジ（SDR）と比べてより広い範囲の輝度レベルと色を表示できます HDRはハイコントラストでシャドウとハイライトの両方のディテールがより鮮明になります
幅広いカラーも提供します
今回SCStreamではキャプチャしたコンテンツのハイダイナミックレンジを出力可能になりました HDRコンテンツのストリーミングを受信する人にソースと同じ豊かなディテールが再現されます
アプリでHDRキャプチャを有効にするには SCStreamConfigurationに新しいプロパティを設定してストリームを設定しますプロパティは次の通りです
captureDynamicRangeは ScreenCaptureKitにSDRまたはHDRで画面コンテンツを出力するよう指示します HDRの場合は hdrLocalDisplayか hdrCanonicalDisplayに設定しますところでローカルディスプレイと標準ディスプレイの違いとは何でしょうか
ローカルディスプレイを使う時は ScreenCaptureKitに HDRコンテンツの取り込みとレンダリングの両方を同じ画面で行うと指示しています
標準ディスプレイの場合取り込んでいるHDRコンテンツをほかのHDR対応デバイスと共有できるように最適化します
次に設定するプロパティは pixelFormatです画像の各ピクセルの色情報を格納する方法を記述します
HDRの場合は各成分が 10ビット以上のフォーマットを使用しますほとんどの状況では10ビットYCbCrが最適な選択肢です
3つ目のプロパティは colorSpaceNameで色の範囲とそれらがデジタル値にマッピングされる方法の伝達関数を示します HDRにはHLGまたはPQの伝達関数のいずれかが必要です例えばDisplay P3 PQ色空間です
最後にcolorMatrixですがこれはBGRA色空間とYCbCr色空間で色を変換するために使われます情報がありすぎると感じるかもしれませんがご心配なく SCStreamConfigurationが役に立つからです HDR用の2つの便利なプリセットが用意されています captureHDRStreamLocalDisplayと captureHDRStreamCanonicalDisplayです
取り込んだHDRコンテンツの出力先がローカルディスプレイの場合ローカルディスプレイプリセットを使用しますこの設定にはここに含まれる値が事前入力されます
HDRコンテンツの出力先がほかのディスプレイの場合は標準ディスプレイプリセットを使用しますこのプリセット値の一覧ですアプリに別の出力設定が必要な場合はアプリのニーズに合わせて自由にプロパティを変更できますではプリセットを使ってHDRをキャプチャするコード例を見てみましょう
まずはSCShareableContentを使い利用可能なコンテンツのリストを取得します
ここで画面全体をキャプチャするので画面全体をキャプチャする SCContentFilterを作成しますあらかじめ用意されている新しいAPIを使い HDR標準ディスプレイの設定を取得します
フィルタと設定を使って SCStreamを作成します
アプリでHDRスクリーンサンプルを受信するにはスクリーンタイプの出力を追加します
最後に配信を開始して HDRサンプルの受信を開始しますアプリにストリームではなくスクリーンショットが1つだけ必要という場合のために SCScreenshotManagerはスクリーンショットAPIを提供していますこのAPIを使って HDRでスクリーンショットを撮ることもできます
SCStreamと同じように SCScreenshotManagerはコンテンツフィルタとストリーム設定を使用します SCStreamと同じようにHDRスクリーンショットを撮るためのプリセットもありますローカルまたは標準ディスプレイで HDRスクリーンショットを撮る際の推奨プリセット値を示します
ローカルディスプレイプリセットを使って HDRスクリーンショットを撮るコードの例です
最初に行うのはHDRローカルディスプレイの設定ですアプリがスクリーンショットのために CMSampleBuffersを必要とする場合 captureSampleBuffer関数を使います
CGImageが望ましい場合 captureImage関数を使います
新しいAPIを使ってストリームとスクリーンショットの両方から驚くほど美しいHDRコンテンツを取得する方法を紹介しましたアプリでHDRを活用する方法をさらに詳しく知りたい場合は HDR画像やメディアのサポートに関するこちらのビデオをぜひご覧くださいこれで ScreenCaptureKitでHDR画像やビデオのキャプチャを始められます美しいHDRストリームに合わせて今年はマイクとシステム音声で収録できるようになりましたストリームに新しいマイク出力を提供することでアプリは3種類のメディアを取り込めます画面システム音声マイクです
アプリがマイク音声をストリームに取り込むために SCStreamConfigurationは 2つの新しいプロパティを提供します captureMicrophoneを使うとアプリがマイクキャプチャをオンにします microphoneCaptureDeviceIDでどのマイクデバイスを使って取り込むか選択できます
アプリでマイクのサンプルを受信するには SCStreamOutputを使いますそれではマイクの音声を取り込むコードを説明しますまずストリーム設定を作成して SCStreamにマイクをキャプチャするよう指示します microphoneCaptureDeviceIDと captureMicrophoneプロパティを設定してデフォルトのマイクを録音しますフィルタと設定で SCStreamを作成しますここで新しいマイクタイプの出力をストリームに追加します取り込みを開始し SCStreamOutputの didOutputSampleBuffer関数を使用してサンプルを受信しますこれだけですアプリはすべての画面音声マイクのコンテンツをSCStreamから取得しますストリーム出力を受け取る一般的な用途の1つはサンプルをファイルに書き込むことです SCStreamに追加された新しいAPIを使用することでこれを実現できますこのAPIを使用すると画面音声マイクのコンテンツを簡単にアプリに収録し保存できます仕組みを見てみましょう先ほどと同じようにSCStreamを設定してコンテンツを取り込みます収録でも同じストリームを使います収録するにはこの新しい出力を追加するだけです SCRecordingOutputConfigurationで SCRecordingOutputを設定できますこの設定ではファイルの保存場所ファイルタイプビデオコーデックを指定できます
またストリーム上の収録イベントに応答するために使用できる新しい SCRecordingOutputDelegate プロトコルもありますではこの新しいAPIを使って収録するコードを見ていきましょうまず SCRecordingOutputConfiguration のインスタンスを作成します outputURLを設定しファイルの保存先を指定します
必要に応じて保存ファイルのファイルタイプやビデオコーデックをカスタマイズできます次に収録設定で SCRecordingOutputインスタンスを作成しイベント受信用のデリゲートを設定します
次に設定したrecordingOutputをストリームに追加します startCaptureを呼び出してストリーミングを開始すると収録も開始されますその後好きな時点で stopCaptureを呼び出しストリームと収録の両方を停止しますときには収録を停止したあともストリーミングを続けたいこともありますコンテンツのストリーミングを続けるには収録だけを停止するために removeRecordingOutputを呼び出します
収録中アプリへのイベントの通知は SCRecordingOutputDelegteで行われます通知が行われるのは収録開始時エラー発生時収録が正常に終了した時ですこれで収録ファイルをアプリで使用する準備が整いました
以上ですこの新しい収録APIによりアプリで簡単かつ便利に画面音声マイクのコンテンツを収録できます
今後はScreenCaptureKitを使いアプリでHDRコンテンツを取り込めます新しいマイク出力が利用可能となりストリームからマイクのサンプルを受け取れますそして新しい収録APIで画面音声マイクのコンテンツを簡単に収録できます ScreenCaptureKitが提供する素晴らしい機能について詳しくは以前のビデオをご覧くださいご視聴ありがとうございました

// Get content that is currently available for capture.
let availableContent = try await SCShareableContent.current
        
// Create instance of SCContentFilter to record entire display.
guard let display = availableContent.displays.first else { return }
let filter = SCContentFilter(display: display, excludingWindows: [])

// Create a configuration using preset for HDR stream canonical display.
let config = SCStreamConfiguration(preset: .captureHDRStreamCanonicalDisplay)

// Create a stream with the filter and stream configuration.
let stream = SCStream(filter: filter, configuration: config, delegate: self)

// Add a stream output to capture screen content.
try stream.addStreamOutput(self, type: .screen, sampleHandlerQueue: nil)

// Start the capture session.
try await stream.startCapture()

6:40 - Use a local display preset to capture HDR

// Create an SCStreamConfiguration with preset for HDR.
let config = SCStreamConfiguration(preset: .captureHDRScreenshotLocalDisplay)

// Call the screenshot API to get CMSampleBuffer representation
let screenshotBuffer = try await SCScreenshotManager.captureSampleBuffer(contentFilter: filter, configuration:config)

// Call the screenshot API to get CGImage representation.
let screenshotImage = try await SCScreenshotManager.captureImage(contentFilter: filter, configuration:config)

8:05 - Capture samples of microphone audio

// Create instance of SCStreamConfiguration.
let config = SCStreamConfiguration()

// Enable microphone capture and set id of microphone to capture.
config.captureMicrophone = true
config.microphoneCaptureDeviceID = AVCaptureDevice.default(for: .audio)?.uniqueID

// Create an SCStream instance.
let stream = SCStream(filter: filter, configuration: config, delegate: self)

// Add stream outputs for capturing screen and microphone.
try stream.addStreamOutput(self, type: .screen, sampleHandlerQueue: nil)
try stream.addStreamOutput(self, type: .microphone, sampleHandlerQueue: nil)

// Start the capture session
try await stream.startCapture()

// Implement SCStreamOutput function to receive samples.
func stream(_ stream: SCStream, didOutputSampleBuffer sampleBuffer: CMSampleBuffer, of type: SCStreamOutputType) {
    switch type {
    case .screen:
        handleLatestScreenSample(sampleBuffer)
    case .audio:         
        handleLatestAudioSample(sampleBuffer)
    case .microphone:
        handleLatestMicrophoneSample(sampleBuffer)
    }
}

9:38 - Record to file

// Create a recording output configuration.
let recordingConfiguration = SCRecordingOutputConfiguration()

// Configure the outputURL (optionally set file type and video codec).
recordingConfiguration.outputURL = url
recordingConfiguration.outputFileType = .mov
recordingConfiguration.videoCodecType = .hevc
        
// Create the recording output with the configuration.
let recordingOutput = SCRecordingOutput(configuration: recordingConfiguration, delegate: self)

// Add an SCRecordingOutput to the stream.
try stream.addRecordingOutput(recordingOutput)

// Start capturing (which will also start recording).
try await stream.startCapture()

// Stop recording.
try await stream.stopCapture()

//OR
// Stop recording, but keep stream running.
try stream.removeRecordingOutput(recordingOutput)

10:27 - Respond to delegate events

func recordingOutputDidStartRecording(_ recordingOutput: SCRecordingOutput) {
    // Recording started asynchronously after addRecordOutput.
}

func recordingOutput(_ recordingOutput: SCRecordingOutput, didFailWithError error: Error) {
    // Recording failed with error.
}
        
func recordingOutputDidFinishRecording(_ recordingOutput: SCRecordingOutput) {
    // Recording finished after calling either removeRecordOutput or stopCapture.
}

特定のトピックをお探しの場合は、上にトピックを入力すると、関連するトピックにすばやく移動できます。

クエリの送信中にエラーが発生しました。インターネット接続を確認して、もう一度お試しください。

関連する章

リソース

関連ビデオ

WWDC24

WWDC23

WWDC22