Fixed
Status Update
Comments
ma...@google.com <ma...@google.com>
se...@google.com <se...@google.com> #2
We will attempt to replicate this bug. In the meantime, feel free to use the stable TabRow API as you mentioned alongside TabRowDefaults.PrimaryIndicator to achieve the same behavior as PrimaryTabRow.
Edit: The specific work around based on your code sample would be as follows:
TabRow(
selectedTabIndex = selectedTabIndexState,
indicator = {
TabRowDefaults.PrimaryIndicator(
modifier = Modifier.tabIndicatorOffset(it[selectedTabIndexState]),
width = it[selectedTabIndexState].contentWidth
)
}
) { // Content }
The complete demo replicating the bug is very helpful thank you!
se...@google.com <se...@google.com> #3
Hi there. Looking over this again, it appears the issue has something to do with clashing constraints. Is there a particular reason for your ComposeView holding tabs to have a height of 0.dp as opposed to match_parent or wrap_content. Updating this to either resolves this render issue on my end.
ma...@google.com <ma...@google.com>
co...@google.com <co...@google.com>
ma...@google.com <ma...@google.com>
ap...@google.com <ap...@google.com> #4
Project: platform/frameworks/support
Branch: androidx-main
commit bdc6e1b597b14a0f4d58aff5e5d1b079a7c1ba5d
Author: Mariano Martin <marianomartin@google.com>
Date: Mon Mar 25 11:06:17 2024
[TabRow] Fix tab row indicator height
Bug: 321997863
Test: added tabRow_indicatorHeight
Change-Id: I2d34896eb576ed8cd99347b1192566cfebd9cd4a
M compose/material3/material3/src/androidInstrumentedTest/kotlin/androidx/compose/material3/TabTest.kt
M compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/TabRow.kt
https://android-review.googlesource.com/3011353
Branch: androidx-main
commit bdc6e1b597b14a0f4d58aff5e5d1b079a7c1ba5d
Author: Mariano Martin <marianomartin@google.com>
Date: Mon Mar 25 11:06:17 2024
[TabRow] Fix tab row indicator height
Bug: 321997863
Test: added tabRow_indicatorHeight
Change-Id: I2d34896eb576ed8cd99347b1192566cfebd9cd4a
M compose/material3/material3/src/androidInstrumentedTest/kotlin/androidx/compose/material3/TabTest.kt
M compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/TabRow.kt
Description
Jetpack Compose M3 version: 1.2.0-beta02
Jetpack Compose component used: PrimaryTabRow
Android Studio Build: 8.3.0-beta02
Kotlin version: 1.9.22
Steps to Reproduce or Code Sample to Reproduce:
Result:
Tab indicators overlap the tab text (see attached "broken_tabs.png")
Sample Project
I created a sample project (see attached PrimaryTabRowIssue.zip) that reproduces this issue (following the steps above). I added the ComposeView to the first_fragment.xml file.
Notes