fix(nests): place Audience/Hands tab counter beside the label, not over it
PrimaryTabRow's BadgedBox places the count badge in the top-end corner of its anchor, which on tight tab labels lands directly on top of the text. Lay them out as a Row instead so "Audience 3" reads cleanly, matching the tabbar comment's "Hands · 3" intent.
This commit is contained in:
+14
-10
@@ -21,8 +21,10 @@
|
|||||||
package com.vitorpamplona.amethyst.ui.screen.loggedIn.nests.room.screen
|
package com.vitorpamplona.amethyst.ui.screen.loggedIn.nests.room.screen
|
||||||
|
|
||||||
import androidx.compose.foundation.clickable
|
import androidx.compose.foundation.clickable
|
||||||
|
import androidx.compose.foundation.layout.Arrangement
|
||||||
import androidx.compose.foundation.layout.Box
|
import androidx.compose.foundation.layout.Box
|
||||||
import androidx.compose.foundation.layout.Column
|
import androidx.compose.foundation.layout.Column
|
||||||
|
import androidx.compose.foundation.layout.Row
|
||||||
import androidx.compose.foundation.layout.consumeWindowInsets
|
import androidx.compose.foundation.layout.consumeWindowInsets
|
||||||
import androidx.compose.foundation.layout.fillMaxSize
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
@@ -30,7 +32,6 @@ import androidx.compose.foundation.layout.imePadding
|
|||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.padding
|
||||||
import androidx.compose.material3.AlertDialog
|
import androidx.compose.material3.AlertDialog
|
||||||
import androidx.compose.material3.Badge
|
import androidx.compose.material3.Badge
|
||||||
import androidx.compose.material3.BadgedBox
|
|
||||||
import androidx.compose.material3.ButtonDefaults
|
import androidx.compose.material3.ButtonDefaults
|
||||||
import androidx.compose.material3.DropdownMenu
|
import androidx.compose.material3.DropdownMenu
|
||||||
import androidx.compose.material3.DropdownMenuItem
|
import androidx.compose.material3.DropdownMenuItem
|
||||||
@@ -51,6 +52,7 @@ import androidx.compose.runtime.remember
|
|||||||
import androidx.compose.runtime.rememberCoroutineScope
|
import androidx.compose.runtime.rememberCoroutineScope
|
||||||
import androidx.compose.runtime.saveable.rememberSaveable
|
import androidx.compose.runtime.saveable.rememberSaveable
|
||||||
import androidx.compose.runtime.setValue
|
import androidx.compose.runtime.setValue
|
||||||
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.graphics.Color
|
import androidx.compose.ui.graphics.Color
|
||||||
import androidx.compose.ui.platform.LocalContext
|
import androidx.compose.ui.platform.LocalContext
|
||||||
@@ -422,16 +424,18 @@ private fun NestTabRow(
|
|||||||
selected = tab == selectedTab,
|
selected = tab == selectedTab,
|
||||||
onClick = { onSelect(tab) },
|
onClick = { onSelect(tab) },
|
||||||
text = {
|
text = {
|
||||||
if (count > 0) {
|
// Lay the label and the count badge side-by-side so
|
||||||
BadgedBox(
|
// the count reads as "Audience 3" instead of being
|
||||||
badge = {
|
// overlapped on top of the label by `BadgedBox`'s
|
||||||
Badge { Text(text = count.toString()) }
|
// default top-end placement (audit Android #43).
|
||||||
},
|
Row(
|
||||||
) {
|
verticalAlignment = Alignment.CenterVertically,
|
||||||
Text(text = label)
|
horizontalArrangement = Arrangement.spacedBy(6.dp),
|
||||||
}
|
) {
|
||||||
} else {
|
|
||||||
Text(text = label)
|
Text(text = label)
|
||||||
|
if (count > 0) {
|
||||||
|
Badge { Text(text = count.toString()) }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user