翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。

IVS Broadcast SDK: ミキサーガイド (低レイテンシーストリーミング)

ミキサーは、複数の入力ソースを受け取り、単一の出力を生成するオーディオおよびビデオ処理ユニットです。これは、複数の画面上 (ビデオ) 要素とオーディオトラックを定義および管理できる強力な機能です。カメラ、マイク、スクリーンキャプチャ、アプリで生成されたオーディオとビデオなど、複数のソースからのビデオとオーディオを組み合わせることができます。トランジションを使用して、Amazon IVS にストリーミングする動画周辺にこれらのソースを移動させて、ストリーミングの途中でそれらを追加および削除することができます。

ミキサーにアクセスするには、以下を呼び出します。

Android のBroadcastSession.getMixer()

iOS の IVSBroadcastSession.mixer

用語

キャンバスプロパティ

キャンバスのプロパティは、BroadcastConfiguration の作成時に指定した BroadcastSession に基づいて設定されます。Audio および Video 構造の複数のプロパティは、次のキャンバスに影響します。

スロットのプロパティ

スロットには、シーンをカスタマイズしてアニメーション化するために使用できる、いくつかの設定可能なプロパティがあります。Float または Vector の値は、0 秒より長いデュレーションのトランジションに対してリニア補間を使用してアニメートされます。

ミキシング用のブロードキャストセッションの設定

ここでは、このガイドの冒頭にあるシーンに似たシーンを作成し、次の 3 つの画面上の要素を使用します。

キャンバスの原点は左上隅で、これはスロットでも同じであることに注意してください。したがって、スロットを (0、0) に配置すると、スロット全体が見えるように左上隅に配置されます。

iOS

let config = IVSBroadcastConfiguration()
try config.video.setSize(CGSize(width: 1280, height: 720))
try config.video.setTargetFramerate(60)
config.video.enableTransparency = true

// Bottom Left
var cameraSlot = IVSMixerSlotConfiguration()
cameraSlot.size = CGSize(width: 320, height: 180) 
cameraSlot.position = CGPoint(x: 20, y: 1280 - 200)
cameraSlot.preferredVideoInput = .camera
cameraSlot.preferredAudioInput = .microphone
cameraSlot.matchCanvasAspectMode = false
cameraSlot.zIndex = 2
try cameraSlot.setName("camera")

// Top Right
var streamSlot = IVSMixerSlotConfiguration()
streamSlot.size = CGSize(width: 640, height: 320) 
streamSlot.position = CGPoint(x: 1280 - 660, y: 20)
streamSlot.preferredVideoInput = .userImage
streamSlot.preferredAudioInput = .userAudio
streamSlot.matchCanvasAspectMode = false
streamSlot.zIndex = 1
try streamSlot.setName("stream")

// Bottom Right
var logoSlot = IVSMixerSlotConfiguration()
logoSlot.size = CGSize(width: 320, height: 180) 
logoSlot.position = CGPoint(x: 1280 - 340, y: 720 - 200)
logoSlot.preferredVideoInput = .userImage
logoSlot.preferredAudioInput = .unknown
logoSlot.matchCanvasAspectMode = false
logoSlot.zIndex = 3
try logoSlot.setTransparency(0.7)
try logoSlot.setName("logo")

config.mixer.slots = [ cameraSlot, streamSlot, logoSlot ]

Android

// Bottom Left
val cameraSlot = BroadcastConfiguration.Mixer.Slot.with { s ->
    s.setSize(320, 180)
    s.position = BroadcastConfiguration.Vec2(20, 1280 - 200)
    s.preferredVideoInput = Device.Descriptor.DeviceType.CAMERA
    s.preferredAudioInput = Device.Descriptor.DeviceType.MICROPHONE
    s.matchCanvasAspectMode = false
    s.zIndex = 2
    s.name = "camera"
    s
}

// Top Right
val streamSlot = BroadcastConfiguration.Mixer.Slot.with { s ->
    s.setSize(640, 320)
    s.position = BroadcastConfiguration.Vec2(1280 - 660, 20)
    s.preferredVideoInput = Device.Descriptor.DeviceType.USER_IMAGE
    s.preferredAudioInput = Device.Descriptor.DeviceType.USER_AUDIO
    s.matchCanvasAspectMode = false
    s.zIndex = 1
    s.name = "stream"
    s
}

// Bottom Right
val logoSlot = BroadcastConfiguration.Mixer.Slot.with { s ->
    s.setSize(320, 180)
    s.position = BroadcastConfiguration.Vec2(1280 - 340, 720 - 200)
    s.preferredVideoInput = Device.Descriptor.DeviceType.USER_IMAGE
    s.preferredAudioInput = Device.Descriptor.DeviceType.UNKNOWN
    s.matchCanvasAspectMode = false
    s.zIndex = 3
    s.name = "logo"
    s.transparency = 0.7
    s
}

val config = BroadcastConfiguration.with { c ->
    c.mixer.slots = listOf(cameraSlot, streamSlot, logoSlot)
    c.video.targetFramerate = 60
    c.video.setSize(1280, 720)
    c
}

スロットを追加する

構成で BroadcastSession を作成したら、ミキサーにスロットを追加したり、ミキサーからスロットを削除したりできます。ここでは、イメージ用の大きな背景スロットをミキサーに追加します。

iOS

// Background. We will use most of the defaults for this slot.
var backgroundSlot = IVSMixerSlotConfiguration()
backgroundSlot.preferredVideoInput = .userImage
backgroundSlot.preferredAudioInput = .unknown
backgroundSlot.matchCanvasAspectMode = false
try backgroundSlot.setName("background")

session.mixer.addSlot(backgroundSlot)

Android

// Background. We will use most of the defaults for this slot.
val backgroundSlot = BroadcastConfiguration.Mixer.Slot.with { s ->
    s.preferredVideoInput = Device.Descriptor.DeviceType.USER_IMAGE
    s.preferredAudioInput = Device.Descriptor.DeviceType.UNKNOWN
    s.matchCanvasAspectMode = false
    s.name = "background"
    s
}

session.mixer.addSlot(backgroundSlot)

スロットの削除

スロットを削除するには、削除するスロットの名前で BroadcastSession.Mixer.removeSlot を呼び出します。そのスロットにバインドされているデバイスはすべて自動的にバインド解除されるため、引き続き使用する場合は、別のスロットに再バインドする必要があります。

トランジションのあるアニメーション

ミキサートランジション方式は、スロットの構成を新しい構成に置き換えます。この置換は、デュレーションを 0 より高く秒単位で設定することで、時間の経過とともにアニメートできます。

アニメーション化できるプロパティ

スロット構造のすべてのプロパティをアニメートできるわけではありません。Float タイプに基づくすべてのプロパティをアニメートできます。その他のプロパティは、アニメーションの開始時または終了時に有効になります。

シンプルな例

以下は、ミキシング用のブロードキャストセッションの設定で上記で定義された構成を使用したフルスクリーンカメラテイクオーバーの例です。これは 0.5 秒でアニメーション化されます。

iOS

// Bottom Left
var bigCameraSlot = cameraSlot
bigCameraSlot.size = CGSize(width: 1280, height: 720) 
bigCameraSlot.position = CGPoint(x: 0, y: 0)

session.mixer.transition("camera", bigCameraSlot, 0.5) {
    println("animation completed!")
}

Android

// Bottom Left
val bigCameraSlot = cameraSlot.changing { s ->
    s.setSize(1280, 720)
    s.position = BroadcastConfiguration.Vec2(0, 0)
    s
}

session.mixer.transition("camera", bigCameraSlot, 0.5) {
    print("animation completed!")
}

ブロードキャストのミラーリング

ミラーリング時にスロットを正しい位置に配置するには、同じ値で位置を調整する必要があります。

以下は、ブロードキャストを水平方向と垂直方向にミラーリングする例です。

iOS

水平ミラーリング:

var cameraSlot = IVSMixerSlotConfiguration
cameraSlot.size = CGSize(width: -320, height: 720)
// Add 320 to position x since our width is -320
cameraSlot.position = CGPoint(x: 320, y: 0)

垂直ミラーリング:

var cameraSlot = IVSMixerSlotConfiguration
cameraSlot.size = CGSize(width: 320, height: -720)
// Add 720 to position y since our height is -720
cameraSlot.position = CGPoint(x: 0, y: 720)

Android

水平ミラーリング:

cameraSlot = BroadcastConfiguration.Mixer.Slot.with {
   it.size = BroadcastConfiguration.Vec2(-320f, 180f)
   // Add 320f to position x since our width is -320f
   it.position = BroadcastConfiguration.Vec2(320f, 0f)
   return@with it
}

垂直ミラーリング:

cameraSlot = BroadcastConfiguration.Mixer.Slot.with {
   it.size = BroadcastConfiguration.Vec2(320f, -180f)
   // Add 180f to position y since our height is -180f
   it.position = BroadcastConfiguration.Vec2(0f, 180f)
   return@with it
}

注: このミラーリングは ImagePreviewView (Android) や IVSImagePreviewView (iOS) の setMirrored メソッドとは異なります。このメソッドはデバイス上のローカルプレビューにのみ影響し、ブロードキャストには影響しません。