I want to reduce padding of a single tab. Following image shows what I want:
What I am getting:
I am currently using the "accompanist-pager" and "accompanist-pager-indicators" with version 0.16.0.
Code:
@Composable
fun Tabs(tabNames: List<String>, pagerState: PagerState, scrollToPage: (Int) -> Unit) {
TabRow(
selectedTabIndex = pagerState.currentPage,
backgroundColor = Color.White,
contentColor = Color.Black,
divider = {
TabRowDefaults.Divider(
thickness = 4.dp
)
},
indicator = { tabPositions ->
TabRowDefaults.Indicator(
modifier = Modifier.customTabIndicatorOffset(tabPositions[pagerState.currentPage]),
height = 4.dp,
color = EmeraldTheme.colors.primary
)
}
) {
tabNames.forEachIndexed { index, name ->
Tab(
text = {
Text(
text = name,
maxLines = 1,
style = globalSearchDefaultTextStyle,
fontWeight = if (pagerState.currentPage == index) FontWeight.Bold else FontWeight.Normal,
color = if (pagerState.currentPage == index) EmeraldColor.Black100 else colorResource(globalSearchR.color.darkGrey20),
)
},
selected = pagerState.currentPage == index,
onClick = {
scrollToPage(index)
}
)
}
Row { Spacer(Modifier.weight(1f, true)) }
}
}
With the current version of TabRow
(or ScrollableTabRow
) you will not be able to do it. You will need to create your own TabRow
composable.
Also, you should probably use a ScrollableTabRow
instead of TabRow
because TabRow
evenly distributes the entire available width
for its Tabs
. So the content padding for that doesn't matter that much.
You can pretty much copy-paste the entire code for ScrollableTabRow
, but modify the bit that sets up the tabConstraints
.
It should no longer use the minTabWidth
:
val minTabWidth = ScrollableTabRowMinimumTabWidth.roundToPx()