ビデオチャットアプリの作成

Kotlin

サンプルアプリのUIを調整する

Android SDKは、ビデオストリーム（パブリッシュとサブスクライブの両方）を View オブジェクトにアタッチできます。これらのビューは、レイアウト内の任意のコンポーザブル・ビューにアタッチすることができます。

コンポーザブル・ビューの作成

で アンドロイドスタジオ:

新規ファイルの作成 VideoChatScreen.kt
ファイルの内容を埋める：

@Composable
fun VideoChatScreen(
    publisherView: View?,
    subscriberView: View?
) {
    Box(modifier = Modifier.fillMaxSize()) {

        // Subscriber full-screen
        subscriberView?.let { view ->
            AndroidView(
                factory = { view },
                modifier = Modifier
                    .fillMaxSize()
            )
        }?: run {
            Text(
                "Connect another subscriber to this session to see his/hers video",
                modifier = Modifier
                .fillMaxSize()
                    .padding(vertical =
                    150.dp)
            )
        }


        publisherView?.let { view ->
            // Publisher picture-in-picture
            AndroidView(
                factory = { view },
                modifier = Modifier
                    .size(width = 90.dp, height = 120.dp)
                    .align(Alignment.BottomEnd)
                    .padding(16.dp)
                    .background(Color.LightGray)
            )
        }
    }
}

今宣言する publisherView そして subscriberView の宣言の直後）。 session プロパティ)：

private var publisherView by mutableStateOf<View?>(null)
private var subscriberView by mutableStateOf<View?>(null)

最後に、既存の onCreate() メソッドで VideoChatScreen ビューに追加します。 setContent() メソッドを呼び出す：

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    enableEdgeToEdge()

    setContent {
        VideoChatScreen(
            publisherView = publisherView,
            subscriberView = subscriberView
        )
    }

    requestPermissions()
}