Francisco Vital Serrão Pereira De Carvalho
03/06/2023, 11:18 AMaccompanist = "0.29.1-alpha"
androidxComposeMaterial3 = "1.1.0-alpha07"
TabRow(
selectedTabIndex = pagerState.currentPage
) {
pages.forEachIndexed { index, name ->
Tab(
modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
selected = pagerState.currentPage == index,
onClick = {
coroutineScopePager.launch {
pagerState.scrollToPage(index)
}
},
text = {
Text(
text = stringResource(id = name),
color = MaterialTheme.colorScheme.primary
)
},
unselectedContentColor = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}
Rebecca Franks
03/06/2023, 11:32 AMGuilherme Delgado
03/06/2023, 11:42 AMmaterial3
, can the `accompanist pager`/`androidx pager` influence their click behaviour? 🤔Rebecca Franks
03/06/2023, 11:43 AMGuilherme Delgado
03/06/2023, 11:43 AMRebecca Franks
03/06/2023, 12:03 PMGuilherme Delgado
03/06/2023, 12:06 PMRebecca Franks
03/06/2023, 12:08 PMGuilherme Delgado
03/06/2023, 12:15 PMScaffold(
modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
Scaffold
-- Column
-- TabRow
-- Tabs
-- HorizontalPager
Rebecca Franks
03/06/2023, 12:21 PMGuilherme Delgado
03/06/2023, 12:26 PMval listState = rememberLazyListState()
val scrollState = rememberScrollState(listState, lastItemOffset)
val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior(rememberTopAppBarState())
Scaffold(
modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
topBar = {
when (pagerState.currentPage) {
0 -> TopBarA
1 -> TopBarB
2 -> TopBarC
}
}
) {
Column(
Modifier
.fillMaxSize()
.padding(it)
) {
TabRowTheme {
TabRow(selectedTabIndex = pagerState.currentPage) {
pages.forEachIndexed { index, name ->
Tab(
selected = pagerState.currentPage == index,
onClick = {
coroutineScopePager.launch {
pagerState.scrollToPage(index)
}
},
text = {
Text(
text = stringResource(id = name),
color = MaterialTheme.colorScheme.primary
)
},
unselectedContentColor = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}
}
HorizontalPager(
modifier = Modifier.fillMaxSize(),
count = pages.size,
state = pagerState,
userScrollEnabled = false,
) { page ->
when (page) {
...
}
}
}
}
Rebecca Franks
03/06/2023, 12:30 PMGuilherme Delgado
03/06/2023, 12:31 PMRebecca Franks
03/06/2023, 12:31 PMGuilherme Delgado
03/06/2023, 12:31 PMRebecca Franks
03/06/2023, 12:36 PMGuilherme Delgado
03/06/2023, 12:36 PMprivate fun Item(
....
pullRefreshStateTasks: PullRefreshState,
) {
Box(Modifier.pullRefresh(pullRefreshStateTasks)) {
LazyColumn(...){ ... }
PullRefreshIndicator(
modifier = Modifier.align(Alignment.TopCenter),
state = pullRefreshStateTasks,
contentColor = MaterialTheme.colorScheme.primary,
refreshing = false
)
}
HorizontalPager
item has it’s own pull to refresh that will fire a different action on the VM (state hoisting). But if needed we could move that logic to the HorizontalPager “level”, and react to the page selected… (in an UX perspective it will be the same, you cannot change the page while loading)Rebecca Franks
03/06/2023, 12:43 PMGuilherme Delgado
03/06/2023, 12:43 PMTabRow(
modifier = Modifier.zIndex(Float.MAX_VALUE),
Rebecca Franks
03/06/2023, 12:50 PMGuilherme Delgado
03/06/2023, 1:01 PMLouis Pullen-Freilich [G]
03/06/2023, 6:02 PMRebecca Franks
03/06/2023, 6:04 PMLouis Pullen-Freilich [G]
03/06/2023, 6:04 PMRebecca Franks
03/06/2023, 6:05 PMLouis Pullen-Freilich [G]
03/06/2023, 6:07 PMRebecca Franks
03/06/2023, 6:09 PMGuilherme Delgado
03/17/2023, 5:23 PM