

Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

# SDK Siaran IVS: Perangkat Campuran
<a name="broadcast-mixed-devices"></a>

Perangkat campuran adalah perangkat audio dan video yang mengambil beberapa sumber input dan menghasilkan satu output. Perangkat pencampuran adalah fitur canggih yang memungkinkan Anda menentukan dan mengelola beberapa elemen (video) dan trek audio di layar. Anda dapat menggabungkan video dan audio dari berbagai sumber seperti kamera, mikrofon, tangkapan layar, serta audio dan video yang dihasilkan oleh aplikasi Anda. Anda dapat menggunakan transisi untuk memindahkan sumber-sumber ini di sekitar video yang Anda streaming ke IVS, dan menambah dan menghapus sumber di tengah aliran.

Perangkat campuran datang dalam rasa gambar dan audio. Untuk membuat perangkat gambar campuran, hubungi:

`DeviceDiscovery.createMixedImageDevice()`di Android

`IVSDeviceDiscovery.createMixedImageDevice()`di iOS

Perangkat yang dikembalikan dapat dilampirkan ke `BroadcastSession` (streaming latensi rendah) atau `Stage` (streaming waktu nyata), seperti perangkat lainnya.

## Terminologi
<a name="broadcast-mixed-devices-terminology"></a>

![\[IVS menyiarkan terminologi perangkat campuran.\]](http://docs.aws.amazon.com/id_id/ivs/latest/LowLatencyUserGuide/images/Broadcast_SDK_Mixer_Glossary.png)



| Istilah | Deskripsi | 
| --- | --- | 
| Perangkat | Komponen perangkat keras atau perangkat lunak yang menghasilkan input audio atau gambar. Contoh perangkat adalah mikrofon, kamera, headset Bluetooth, dan perangkat virtual seperti tangkapan layar atau input gambar khusus. | 
| Perangkat Campuran | A `Device` yang dapat dilampirkan `BroadcastSession` seperti yang lain`Device`, tetapi dengan tambahan APIs yang memungkinkan `Source` objek ditambahkan. Perangkat campuran memiliki mixer internal yang menggabungkan audio atau gambar, menghasilkan audio output tunggal dan aliran gambar. Perangkat campuran datang dalam ragam audio atau gambar.  | 
| Konfigurasi perangkat campuran | Objek konfigurasi untuk perangkat campuran. Untuk perangkat gambar campuran, ini mengonfigurasi properti seperti dimensi dan framerate. Untuk perangkat audio campuran, ini mengonfigurasi jumlah saluran. | 
|  Sumber | Wadah yang mendefinisikan posisi elemen visual di layar dan properti trek audio dalam campuran audio. Perangkat campuran dapat dikonfigurasi dengan nol atau lebih sumber. Sumber diberikan konfigurasi yang mempengaruhi bagaimana media sumber digunakan. Gambar di atas menunjukkan empat sumber gambar: [\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/id_id/ivs/latest/LowLatencyUserGuide/broadcast-mixed-devices.html)  | 
| Konfigurasi Sumber |  Objek konfigurasi untuk sumber yang masuk ke perangkat campuran. Objek konfigurasi lengkap dijelaskan di bawah ini..   | 
| Transisi | Untuk memindahkan slot ke posisi baru atau mengubah beberapa propertinya, gunakan`MixedDevice.transitionToConfiguration()`. Metode ini membutuhkan: [\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/id_id/ivs/latest/LowLatencyUserGuide/broadcast-mixed-devices.html) | 

## Perangkat Audio Campuran
<a name="broadcast-mixed-audio-device"></a>

### Konfigurasi
<a name="broadcast-mixed-audio-device-configuration"></a>

`MixedAudioDeviceConfiguration`di Android

`IVSMixedAudioDeviceConfiguration`di iOS


| Nama | Tipe | Deskripsi | 
| --- | --- | --- | 
| `channels` | Bilangan Bulat | Jumlah saluran output dari mixer audio. Nilai yang valid: 1, 2. 1 adalah audio mono; 2, audio stereo. Default: 2. | 

### Konfigurasi Sumber
<a name="broadcast-mixed-audio-device-source-configuration"></a>

`MixedAudioDeviceSourceConfiguration`di Android

`IVSMixedAudioDeviceSourceConfiguration`di iOS


| Nama | Tipe | Deskripsi | 
| --- | --- | --- | 
| `gain` | Desimal | Keuntungan audio. Ini adalah pengganda, jadi nilai apa pun di atas 1 meningkatkan keuntungan; nilai apa pun di bawah 1, menurunkannya. Nilai yang valid: 0-2. Default: 1.  | 

## Perangkat Gambar Campuran
<a name="broadcast-mixed-image-device"></a>

### Konfigurasi
<a name="broadcast-mixed-image-device-configuration"></a>

`MixedImageDeviceConfiguration`di Android

`IVSMixedImageDeviceConfiguration`di iOS


| Nama | Tipe | Deskripsi | 
| --- | --- | --- | 
| `size` | Vec2 | Ukuran kanvas video. | 
| `targetFramerate` | Bilangan Bulat | Jumlah frame target per detik untuk perangkat campuran. Rata-rata, nilai ini harus dipenuhi, tetapi sistem dapat menjatuhkan frame dalam keadaan tertentu (misalnya, beban CPU atau GPU yang tinggi). | 
| `transparencyEnabled` | Boolean | Ini memungkinkan pencampuran menggunakan `alpha` properti pada konfigurasi sumber gambar. Mengatur ini untuk `true` meningkatkan konsumsi memori dan CPU. Default: `false`. | 

### Konfigurasi Sumber
<a name="broadcast-mixed-image-device-source-configuration"></a>

`MixedImageDeviceSourceConfiguration`di Android

`IVSMixedImageDeviceSourceConfiguration`di iOS


| Nama | Tipe | Deskripsi | 
| --- | --- | --- | 
| `alpha` | Desimal | Alpha dari slot. Ini multiplikatif dengan nilai alfa apa pun pada gambar. Nilai yang valid: 0-1. 0 sepenuhnya transparan dan 1 sepenuhnya buram. Default: 1. | 
| `aspect` | AspectMode | Mode rasio aspek untuk gambar apa pun yang dirender di slot. Nilai valid: [\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/id_id/ivs/latest/LowLatencyUserGuide/broadcast-mixed-devices.html) Default: `Fit`  | 
| `fillColor` | Vec4 | Isi warna yang akan digunakan `aspect Fit` ketika rasio aspek slot dan gambar tidak cocok. Formatnya adalah (merah, hijau, biru, alfa). Nilai valid (untuk setiap saluran): 0-1. Default: (0, 0, 0, 0). | 
| `position` | Vec2 | Posisi slot (dalam piksel), relatif terhadap sudut kiri atas kanvas. Asal slot juga kiri atas. | 
| `size` | Vec2 | Ukuran slot, dalam piksel. Menyetel nilai ini juga disetel `matchCanvasSize` ke`false`. Default: (0, 0); Namun, karena `matchCanvasSize` defaultnya`true`, ukuran slot yang dirender adalah ukuran kanvas, bukan (0, 0). | 
| `zIndex` | Desimal | Pemesanan slot relatif. Slot dengan `zIndex` nilai yang lebih tinggi digambar di atas slot dengan `zIndex` nilai yang lebih rendah. | 

## Membuat dan Mengkonfigurasi Perangkat Gambar Campuran
<a name="broadcast-mixed-image-device-creating-configuring"></a>

![\[Mengkonfigurasi sesi siaran untuk pencampuran.\]](http://docs.aws.amazon.com/id_id/ivs/latest/LowLatencyUserGuide/images/Broadcast_SDK_Mixer_Configuring.png)


Di sini, kami membuat adegan yang mirip dengan yang ada di awal panduan ini, dengan tiga elemen di layar:
+ Slot kiri bawah untuk kamera.
+ Slot kanan bawah untuk hamparan logo.
+ Slot kanan atas untuk film.

Perhatikan bahwa asal kanvas adalah sudut kiri atas dan ini sama untuk slot. Oleh karena itu, memposisikan slot di (0, 0) menempatkannya di sudut kiri atas dengan seluruh slot terlihat.

### iOS
<a name="broadcast-mixed-image-device-creating-configuring-ios"></a>

```
let deviceDiscovery = IVSDeviceDiscovery()
let mixedImageConfig = IVSMixedImageDeviceConfiguration()
mixedImageConfig.size = CGSize(width: 1280, height: 720)
try mixedImageConfig.setTargetFramerate(60)
mixedImageConfig.isTransparencyEnabled = true
let mixedImageDevice = deviceDiscovery.createMixedImageDevice(with: mixedImageConfig)

// Bottom Left
let cameraConfig = IVSMixedImageDeviceSourceConfiguration()
cameraConfig.size = CGSize(width: 320, height: 180)
cameraConfig.position = CGPoint(x: 20, y: mixedImageConfig.size.height - cameraConfig.size.height - 20)
cameraConfig.zIndex = 2
let camera = deviceDiscovery.listLocalDevices().first(where: { $0 is IVSCamera }) as? IVSCamera
let cameraSource = IVSMixedImageDeviceSource(configuration: cameraConfig, device: camera)
mixedImageDevice.add(cameraSource)

// Top Right
let streamConfig = IVSMixedImageDeviceSourceConfiguration()
streamConfig.size = CGSize(width: 640, height: 320)
streamConfig.position = CGPoint(x: mixedImageConfig.size.width - streamConfig.size.width - 20, y: 20)
streamConfig.zIndex = 1
let streamDevice = deviceDiscovery.createImageSource(withName: "stream")
let streamSource = IVSMixedImageDeviceSource(configuration: streamConfig, device: streamDevice)
mixedImageDevice.add(streamSource)

// Bottom Right
let logoConfig = IVSMixedImageDeviceSourceConfiguration()
logoConfig.size = CGSize(width: 320, height: 180)
logoConfig.position = CGPoint(x: mixedImageConfig.size.width - logoConfig.size.width - 20,
                              y: mixedImageConfig.size.height - logoConfig.size.height - 20)
logoConfig.zIndex = 3
let logoDevice = deviceDiscovery.createImageSource(withName: "logo")
let logoSource = IVSMixedImageDeviceSource(configuration: logoConfig, device: logoDevice)
mixedImageDevice.add(logoSource)
```

### Android
<a name="broadcast-mixed-image-device-creating-configuring-android"></a>

```
val deviceDiscovery = DeviceDiscovery(this /* context */)
val mixedImageConfig = MixedImageDeviceConfiguration().apply {
    setSize(BroadcastConfiguration.Vec2(1280f, 720f))
    setTargetFramerate(60)
    setEnableTransparency(true)
}
val mixedImageDevice = deviceDiscovery.createMixedImageDevice(mixedImageConfig)

// Bottom Left
val cameraConfig = MixedImageDeviceSourceConfiguration().apply {
    setSize(BroadcastConfiguration.Vec2(320f, 180f))
    setPosition(BroadcastConfiguration.Vec2(20f, mixedImageConfig.size.y - size.y - 20))
    setZIndex(2)
}
val camera = deviceDiscovery.listLocalDevices().firstNotNullOf { it as? CameraSource }
val cameraSource = MixedImageDeviceSource(cameraConfig, camera)
mixedImageDevice.addSource(cameraSource)

// Top Right
val streamConfig = MixedImageDeviceSourceConfiguration().apply {
    setSize(BroadcastConfiguration.Vec2(640f, 320f))
    setPosition(BroadcastConfiguration.Vec2(mixedImageConfig.size.x - size.x - 20, 20f))
    setZIndex(1)
}
val streamDevice = deviceDiscovery.createImageInputSource(streamConfig.size)
val streamSource = MixedImageDeviceSource(streamConfig, streamDevice)
mixedImageDevice.addSource(streamSource)

// Bottom Right
val logoConfig = MixedImageDeviceSourceConfiguration().apply {
    setSize(BroadcastConfiguration.Vec2(320f, 180f))
    setPosition(BroadcastConfiguration.Vec2(mixedImageConfig.size.x - size.x - 20, mixedImageConfig.size.y - size.y - 20))
    setZIndex(1)
}
val logoDevice = deviceDiscovery.createImageInputSource(logoConfig.size)
val logoSource = MixedImageDeviceSource(logoConfig, logoDevice)
mixedImageDevice.addSource(logoSource)
```

## Menghapus Sumber
<a name="broadcast-mixed-devices-removing-sources"></a>

Untuk menghapus sumber, panggil `MixedDevice.remove` dengan `Source` objek yang ingin Anda hapus.

## Animasi dengan Transisi
<a name="broadcast-mixed-devices-animations-transitions"></a>

Metode transisi menggantikan konfigurasi sumber dengan konfigurasi baru. Penggantian ini dapat dianimasikan dari waktu ke waktu dengan menetapkan durasi lebih tinggi dari 0, dalam hitungan detik. 

### Properti apa yang bisa dianimasikan?
<a name="broadcast-mixed-devices-animations-properties"></a>

Tidak semua properti dalam struktur slot dapat dianimasikan. Properti apa pun berdasarkan tipe Float dapat dianimasikan; properti lain berlaku baik di awal atau akhir animasi.


| Nama | Bisakah itu dianimasikan? | Titik Dampak | 
| --- | --- | --- | 
| `Audio.gain` | Ya | Diinterpolasi | 
| `Image.alpha` | Ya | Diinterpolasi | 
| `Image.aspect` | Tidak | Akhiri | 
| `Image.fillColor` | Ya | Diinterpolasi | 
| `Image.position` | Ya | Diinterpolasi | 
| `Image.size` | Ya | Diinterpolasi | 
| `Image.zIndex` Catatan: Pesawat `zIndex` bergerak 2D melalui ruang 3D, sehingga transisi terjadi ketika dua bidang menyeberang di beberapa titik di tengah animasi. Ini bisa dihitung, tetapi itu tergantung pada `zIndex` nilai awal dan akhir. Untuk transisi yang lebih lancar, gabungkan ini dengan`alpha`.  | Ya | Tidak Diketahui | 

### Contoh Sederhana
<a name="broadcast-mixed-devices-animations-examples"></a>

Di bawah ini adalah contoh pengambilalihan kamera layar penuh menggunakan konfigurasi yang ditentukan di atas dalam [Membuat dan Mengkonfigurasi Perangkat Gambar Campuran](#broadcast-mixed-image-device-creating-configuring). Ini dianimasikan lebih dari 0,5 detik.

#### iOS
<a name="broadcast-mixed-devices-animations-examples-ios"></a>

```
// Continuing the example from above, modifying the existing cameraConfig object.
cameraConfig.size = CGSize(width: 1280, height: 720)
cameraConfig.position = CGPoint.zero
cameraSource.transition(to: cameraConfig, duration: 0.5) { completed in
    if completed {
        print("Animation completed")
    } else {
        print("Animation interrupted")
    }
}
```

#### Android
<a name="broadcast-mixed-devices-animations-examples-android"></a>

```
// Continuing the example from above, modifying the existing cameraConfig object.
cameraConfig.setSize(BroadcastConfiguration.Vec2(1280f, 720f))
cameraConfig.setPosition(BroadcastConfiguration.Vec2(0f, 0f))
cameraSource.transitionToConfiguration(cameraConfig, 500) { completed ->
    if (completed) {
        print("Animation completed")
    } else {
        print("Animation interrupted")
    }
}
```

## Mencerminkan Siaran
<a name="broadcast-mixed-devices-mirroring"></a>


| Untuk mencerminkan perangkat gambar terlampir dalam siaran ke arah ini... | Gunakan nilai negatif untuk... | 
| --- | --- | 
| Horizontal | Lebar slot | 
| Vertikal | Ketinggian slot | 
| Baik horisontal maupun vertikal | Baik lebar dan tinggi slot | 

Posisi perlu disesuaikan dengan nilai yang sama, untuk menempatkan slot pada posisi yang benar saat dicerminkan.

Di bawah ini adalah contoh untuk mencerminkan siaran secara horizontal dan vertikal.

### iOS
<a name="broadcast-mixed-devices-mirroring-ios"></a>

Pencerminan horisontal:

```
let cameraSource = IVSMixedImageDeviceSourceConfiguration()
cameraSource.size = CGSize(width: -320, height: 720)
// Add 320 to position x since our width is -320
cameraSource.position = CGPoint(x: 320, y: 0)
```

Pencerminan vertikal:

```
let cameraSource = IVSMixedImageDeviceSourceConfiguration()
cameraSource.size = CGSize(width: 320, height: -720)
// Add 720 to position y since our height is -720
cameraSource.position = CGPoint(x: 0, y: 720)
```

### Android
<a name="broadcast-mixed-devices-mirroring-android"></a>

Pencerminan horisontal:

```
val cameraConfig = MixedImageDeviceSourceConfiguration().apply {
    setSize(BroadcastConfiguration.Vec2(-320f, 180f))
   // Add 320f to position x since our width is -320f
    setPosition(BroadcastConfiguration.Vec2(320f, 0f))
}
```

Pencerminan vertikal:

```
val cameraConfig = MixedImageDeviceSourceConfiguration().apply {
    setSize(BroadcastConfiguration.Vec2(320f, -180f))
    // Add 180f to position y since our height is -180f
    setPosition(BroadcastConfiguration.Vec2(0f, 180f))
}
```

Catatan: Pencerminan ini berbeda dengan `setMirrored` metode di `ImagePreviewView` (Android) dan `IVSImagePreviewView` (iOS). Metode itu hanya memengaruhi tampilan pratinjau lokal di perangkat dan tidak memengaruhi siaran.