Merge pull request #5008 from nextcloud/simplifyCallGridLayoutForVoiceOnly

simplify call grid design logic for voice only calls

app/src/main/java/com/nextcloud/talk/activities/CallActivity.kt

@@ -947,8 +947,7 @@ class CallActivity : CallBaseActivity() {
                 ParticipantGrid(
                     participantUiStates = participantUiStates,
                     eglBase = rootEglBase!!,
-                    isVoiceOnlyCall = isVoiceOnlyCall,
-                    isInPipMode = isInPipMode
+                    isVoiceOnlyCall = isVoiceOnlyCall
                 ) {
                     animateCallControls(true, 0)
                 }

app/src/main/java/com/nextcloud/talk/call/components/ParticipantGrid.kt

@@ -12,11 +12,11 @@ package com.nextcloud.talk.call.components
 import android.content.res.Configuration
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.BoxWithConstraints
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
@@ -36,7 +36,6 @@ fun ParticipantGrid(
     eglBase: EglBase?,
     participantUiStates: List<ParticipantUiState>,
     isVoiceOnlyCall: Boolean,
-    isInPipMode: Boolean,
     onClick: () -> Unit
 ) {
     val configuration = LocalConfiguration.current
@@ -44,8 +43,9 @@ fun ParticipantGrid(
 
     val minItemHeight = 100.dp
 
-    val columns =
-        if (isPortrait) {
+    if (participantUiStates.isEmpty()) return
+
+    val columns = if (isPortrait) {
         when (participantUiStates.size) {
             1, 2, 3 -> 1
             else -> 2
@@ -56,38 +56,32 @@ fun ParticipantGrid(
             2, 4 -> 2
             else -> 3
         }
-        }
+    }.coerceAtLeast(1) // Prevent 0
 
-    val rows = ceil(participantUiStates.size / columns.toFloat()).toInt()
+    val rows = ceil(participantUiStates.size / columns.toFloat()).toInt().coerceAtLeast(1)
 
-    val heightForNonGridComponents = if (isVoiceOnlyCall && !isInPipMode) {
-        // this is a workaround for now. It should ~summarize the height of callInfosLinearLayout and callControls
-        // Once everything is migrated to jetpack, this workaround should be obsolete or solved in a better way
-        240.dp
-    } else {
-        0.dp
-    }
-
-    val gridHeight = LocalConfiguration.current.screenHeightDp.dp - heightForNonGridComponents
     val itemSpacing = 8.dp
     val edgePadding = 8.dp
-
     val totalVerticalSpacing = itemSpacing * (rows - 1)
     val totalVerticalPadding = edgePadding * 2
-    val availableHeight = gridHeight - totalVerticalSpacing - totalVerticalPadding
 
-    val rawItemHeight = availableHeight / rows
+    BoxWithConstraints(
+        modifier = modifier
+            .fillMaxSize()
+            .clickable { onClick() }
+    ) {
+        val availableHeight = maxHeight
+
+        val gridAvailableHeight = availableHeight - totalVerticalSpacing - totalVerticalPadding
+        val rawItemHeight = gridAvailableHeight / rows
         val itemHeight = maxOf(rawItemHeight, minItemHeight)
 
         LazyVerticalGrid(
             columns = GridCells.Fixed(columns),
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(horizontal = edgePadding)
-            .clickable { onClick() },
+            modifier = Modifier.fillMaxSize(),
             verticalArrangement = Arrangement.spacedBy(itemSpacing),
             horizontalArrangement = Arrangement.spacedBy(itemSpacing),
-        contentPadding = PaddingValues(vertical = edgePadding)
+            contentPadding = PaddingValues(vertical = edgePadding, horizontal = edgePadding)
         ) {
             items(
                 participantUiStates,
@@ -103,6 +97,7 @@ fun ParticipantGrid(
                 )
             }
         }
+    }
 }
 
 @Preview
@@ -111,8 +106,7 @@ fun ParticipantGridPreview() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(1),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -122,8 +116,7 @@ fun TwoParticipants() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(2),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -133,8 +126,7 @@ fun ThreeParticipants() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(3),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -144,8 +136,7 @@ fun FourParticipants() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(4),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -155,8 +146,7 @@ fun FiveParticipants() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(5),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -166,8 +156,7 @@ fun SevenParticipants() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(7),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -177,8 +166,7 @@ fun FiftyParticipants() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(50),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -192,8 +180,7 @@ fun OneParticipantLandscape() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(1),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -207,8 +194,7 @@ fun TwoParticipantsLandscape() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(2),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -222,8 +208,7 @@ fun ThreeParticipantsLandscape() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(3),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -237,8 +222,7 @@ fun FourParticipantsLandscape() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(4),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -252,8 +236,7 @@ fun SevenParticipantsLandscape() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(7),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }
 
@@ -267,8 +250,7 @@ fun FiftyParticipantsLandscape() {
     ParticipantGrid(
         participantUiStates = getTestParticipants(50),
         eglBase = null,
-        isVoiceOnlyCall = false,
-        isInPipMode = false
+        isVoiceOnlyCall = false
     ) {}
 }