통화화면 controller 추가

Author: lyh990517

app/src/main/java/com/example/webrtc/ComposeActivity.kt

@@ -7,6 +7,7 @@ import androidx.lifecycle.lifecycleScope
 import com.example.domain.event.PeerConnectionEvent
 import com.example.domain.event.WebRTCEvent
 import com.example.domain.state.UiState
+import com.example.presentaion.ui_component.WebRTCController
 import com.example.presentaion.viewmodel.ConnectionViewModel
 import com.example.webrtc.databinding.ActivityWebRtcconnectBinding
 import dagger.hilt.android.AndroidEntryPoint
@@ -24,15 +25,24 @@ class WebRTCConnectActivity : AppCompatActivity() {
         super.onCreate(savedInstanceState)
         binding = ActivityWebRtcconnectBinding.inflate(layoutInflater)
         setContentView(binding.root)
+        setCompose()
         collectConnectionEvent()
         collectRTCEvent()
         collectState()
     }
 
+    private fun setCompose() {
+        binding.composeView.apply {
+            setContent {
+                WebRTCController(viewModel = viewModel)
+            }
+        }
+    }
+
     private fun collectState() {
         lifecycleScope.launch {
-            viewModel.uiState.collect{
-                when(it){
+            viewModel.uiState.collect {
+                when (it) {
                     is UiState.UnInitialized -> viewModel.initRTC()
                 }
             }

app/src/main/java/com/example/webrtc/WebRTCApp.kt

@@ -4,7 +4,7 @@
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    tools:context="com.example.presentaion.view.WebRTCConnectActivity">
+    tools:context=".WebRTCConnectActivity">
 
     <org.webrtc.SurfaceViewRenderer
         android:id="@+id/remoteView"
@@ -13,9 +13,17 @@
 
     <org.webrtc.SurfaceViewRenderer
         android:id="@+id/localView"
-        android:layout_width="200dp"
-        android:layout_height="300dp"
+        android:layout_width="150dp"
+        android:layout_height="200dp"
         android:layout_margin="25dp"
+        app:layout_constraintBottom_toTopOf="@+id/compose_view"
+        app:layout_constraintStart_toStartOf="parent" />
+
+    <androidx.compose.ui.platform.ComposeView
+        android:id="@+id/compose_view"
+        android:layout_width="match_parent"
+        android:layout_height="100dp"
         app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent" />
 </androidx.constraintlayout.widget.ConstraintLayout>

app/src/main/java/com/example/webrtc/WebRTCConnectActivity.kt

@@ -51,11 +51,13 @@ dependencies {
     implementation 'androidx.core:core-ktx:1.8.0'
     implementation 'androidx.appcompat:appcompat:1.6.1'
     implementation 'com.google.android.material:material:1.9.0'
+    implementation 'androidx.compose.ui:ui-tooling-preview:1.4.3'
     testImplementation 'junit:junit:4.13.2'
     androidTestImplementation 'androidx.test.ext:junit:1.1.5'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
 
     implementation 'com.google.dagger:hilt-android:2.45'
+    debugImplementation 'androidx.compose.ui:ui-tooling:1.4.3'
     kapt 'com.google.dagger:hilt-android-compiler:2.45'
 
     implementation 'androidx.lifecycle:lifecycle-viewmodel-ktx:2.6.1'

app/src/main/res/layout/activity_web_rtcconnect.xml

@@ -0,0 +1,43 @@
+package com.example.presentaion.ui_component
+
+import androidx.compose.material.FloatingActionButton
+import androidx.compose.material.Icon
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Face
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.State
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.tooling.preview.Preview
+
+@Composable
+fun MenuButton(
+    imageVector: ImageVector,
+    description: String,
+    defaultBackgroundColor: Color,
+    state: State<Boolean> = mutableStateOf(true),
+    onClick: () -> Unit
+) {
+    FloatingActionButton(
+        onClick = onClick,
+        backgroundColor = if (state.value) defaultBackgroundColor else Color.Gray
+    ) {
+        Icon(imageVector = imageVector, contentDescription = description)
+    }
+}
+
+@Composable
+@Preview
+fun MenuPreview() {
+    val isClicked = rememberSaveable { mutableStateOf(false) }
+    MenuButton(
+        imageVector = Icons.Default.Face,
+        description = "Face",
+        defaultBackgroundColor = Color.Green,
+        state = isClicked
+    ) {
+
+    }
+}

presentaion/build.gradle

@@ -0,0 +1,60 @@
+package com.example.presentaion.ui_component
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Call
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material.icons.filled.Face
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import com.example.presentaion.viewmodel.ConnectionViewModel
+
+@Composable
+fun WebRTCController(viewModel: ConnectionViewModel) {
+    val isCallClicked = rememberSaveable { mutableStateOf(false) }
+    val isVideoClicked = rememberSaveable { mutableStateOf(false) }
+    Row(
+        Modifier.fillMaxSize(),
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.SpaceEvenly
+    ) {
+        MenuButton(
+            imageVector = Icons.Default.Call,
+            description = "Call",
+            defaultBackgroundColor = Color.Green,
+            state = isCallClicked
+        ) {
+            isCallClicked.value = !isCallClicked.value
+            viewModel.toggleVoice()
+        }
+        MenuButton(
+            imageVector = Icons.Default.Face,
+            description = "Face",
+            defaultBackgroundColor = Color.Green,
+            state = isVideoClicked
+        ) {
+            isVideoClicked.value = !isVideoClicked.value
+            viewModel.toggleVideo()
+        }
+        MenuButton(
+            imageVector = Icons.Default.Close,
+            description = "Close",
+            defaultBackgroundColor = Color.Red
+        ) {
+            viewModel.closeSession()
+        }
+    }
+}
+
+@Composable
+@Preview
+fun ControllerPreview() {
+
+}