我有一个底部工作表对话框。对于该对话框,我使用Accompanist
导航库中的ModalBottomSheetDialog
。在名为PlatformsScreen
的可组合的对话框中,我有一个LazyColumn
,其中包含RadioButton
的项目。每当选择任何单选按钮时,我都会将所选项目添加到selectedPlatforms
中,这是一个mutableList
:
@Composable
fun PlatformsScreen(
modifier: Modifier = Modifier,
navController: NavController,
viewModel: PlatformsScreenViewModel = hiltViewModel(),
) {
// this is the platforms that I fetch from network
val platforms = viewModel.platforms.observeAsState()
val listState = rememberLazyListState()
//this is the platforms that I selected from the platforms list
val selectedPlatforms by rememberSaveable {
mutableStateOf(mutableListOf<Platform>())
}
DefaultScreenUI(toolbar = {
BottomSheetDialogToolbar(title = "Platforms")
},
floatingActionButton = {
//This is not working
AnimatedVisibility(visible = selectedPlatforms.size > 0,
enter = expandVertically(),
exit = shrinkVertically())
{
ApplyFilterFab()
}
}
) {
when (platforms.value) {
is Resource.Loading -> {
LoadingItem()
}
is Resource.Error -> {
ErrorItem(message = platforms.value!!.error!!,
onRetryClick = viewModel::setRefresh)
}
is Resource.Success -> {
if (platforms.value!!.data!!.isNotEmpty()) {
LazyColumn(modifier = modifier.fillMaxSize(), state = listState) {
items(count = platforms.value!!.data!!.size) {
//platform item
PlatformItem(
platform = platforms.value!!.data!![it],
) { platform, selected ->
Timber.d(selectedPlatforms.size.toString())
if (!selected) {
selectedPlatforms.remove(platform)
} else {
selectedPlatforms.add(platform)
}
}
}
}
} else {
//empty view
}
}
}
}
}
字符串DefaultScreenUI
与Scaffold
一起也是一种可组合的乐趣:
@Composable
fun DefaultScreenUI(
toolbar: (@Composable () -> Unit)? = null,
floatingActionButton: (@Composable () -> Unit)? = null,
fabPos: FabPosition = FabPosition.End,
content: @Composable () -> Unit,
) {
val scaffoldState = rememberScaffoldState()
Scaffold(
scaffoldState = scaffoldState,
topBar = { toolbar?.invoke() },
floatingActionButton = { floatingActionButton?.invoke() },
floatingActionButtonPosition = fabPos) {
Box(modifier = Modifier
.fillMaxSize()
.background(MaterialTheme.colors.primary)) {
content()
}
}
}
型
下面是我的PlatformItem
组合:
@Composable
fun PlatformItem(
modifier: Modifier = Modifier,
platform: Platform,
onItemSelected: (Platform,Boolean) -> Unit
) {
var selected by rememberSaveable {
mutableStateOf(false)
}
Row(modifier = modifier
.fillMaxWidth()
.height(40.dp)
.clickable {
selected = !selected
onItemSelected(platform,selected)
},
horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically
) {
Text(
modifier = Modifier.padding(start = dimensionResource(id = R.dimen.dimen_8)),
text = platform.name!!,
style = MaterialTheme.typography.subtitle1,
color = MaterialTheme.colors.onPrimary)
RadioButton(selected = selected, onClick = {
selected = !selected
onItemSelected(platform,selected)
})
}
}
型
我想做的是,每当列表中的任何项目被选中,这意味着selectedPlatforms.size > 0
,我想在对话框中显示FloatingActionButton
,如果selectedPlatforms
为空,则隐藏按钮。结果如下:
的数据
正如你所看到的,它没有出现。我该怎么办?
3条答案
按热度按时间voase2hg1#
这是一个bug,我有reported it。
在修复之前,目前最简单的解决方案是切换到
scaleIn
/scaleOut
转换,它们工作正常。另一个选项是将
AnimatedVisibility
设置为FAB静态大小的Box
,即56.dp
,在这种情况下,除了剪切的阴影外,其他过渡都可以正常工作。可以通过将elevation
参数置零来禁用阴影,这也不是最佳解决方案。toe950272#
这是关于FAB(浮动操作按钮)的修复。问题在于AnimatedVisibility的默认动画“expandIn”,其中包括“ChangeSize”,并且具有IntSize(0,0)的默认值。当大小被设置为零时,FAB在重组期间不出现。如果在生产环境中出现此错误,您可以通过以下步骤解决它。
字符串
yxyvkwin3#
字符串