你好堆栈溢出社区。在这些天里,我试图使BottomSheetScaffold组合在我的应用程序,所以我有问题,我想折叠和展开时,我点击图标按钮内的卡组合像Facebook的应用程序,我怎么能做到这一点,我已经尝试过,但不幸的是我不能做到。我知道有类似的问题,关于这个主题,但我想帮助我现在
@OptIn(ExperimentalMaterialApi::class, ExperimentalCoroutinesApi::class)
@Composable
fun ddd(
navController: NavController,
viewModel: SearchingClickingViewModel
) {
val scope = rememberCoroutineScope()
val scaffoldState = rememberBottomSheetScaffoldState()
BottomSheetScaffold(
scaffoldState = scaffoldState,
sheetPeekHeight = 10.dp,
sheetContent = {
Box(
Modifier
.fillMaxWidth()
.height(128.dp),
//.background(Color.Cyan),
contentAlignment = Alignment.Center
) {
Text("Swipe up to expand sheet")
}
Column(
Modifier
.fillMaxWidth()
.padding(64.dp),
//.background(Color.Gray),
horizontalAlignment = Alignment.CenterHorizontally
) {
Text("Sheet content")
Spacer(Modifier.height(20.dp))
Button(
onClick = {
scope.launch { scaffoldState.bottomSheetState.collapse() }
}
) {
Text("Click to collapse sheet")
}
}
},
topBar = {
TopAppBar(
title = {
Text(text = "All Calling Customers")
},
navigationIcon = {
IconButton(onClick = {
navController.navigate(Screen.Home.route) {
popUpTo(Screen.Home.route) {
inclusive = true
}
}
}) {
Icon(Icons.Filled.ArrowBack, "backIcon")
}
},
backgroundColor = MaterialTheme.colors.primary,
contentColor = MaterialTheme.colors.primary,
elevation = 0.dp
)
},
drawerContent = {
Column(
Modifier
.fillMaxWidth()
.padding(16.dp),
horizontalAlignment = Alignment.CenterHorizontally
) {
Text("Drawer content")
Spacer(Modifier.height(20.dp))
Button(onClick = {
scope.launch { scaffoldState.drawerState.close() }
}) {
Text("Click to close drawer")
}
}
}
) {
LazyColumn(
contentPadding = PaddingValues(
horizontal = 0.dp,
vertical = 0.dp
),
verticalArrangement = Arrangement.spacedBy(10.dp)
) {
items(100) {
Cards_SearchingClicking(data = it!!, navController)
}
}
}
}
@OptIn(ExperimentalMaterialApi::class)
@Composable
fun Cards_SearchingClicking(
data: SearchingClickingItems,
navController: NavController
) {
val context = LocalContext.current
val scope = rememberCoroutineScope()
val scaffoldState = rememberBottomSheetScaffoldState()
Card(
modifier = Modifier
.fillMaxSize(),
RoundedCornerShape(0.dp),
elevation = 1.dp
) {
Column(
modifier = Modifier
//.background(Color.Green)
.fillMaxSize()
.padding(20.dp)
) {
Row(
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.SpaceBetween,
modifier = Modifier
.fillMaxWidth()
) {
IconButton(
onClick = {
scope.launch {
if (scaffoldState.bottomSheetState.isCollapsed) {
scaffoldState.bottomSheetState.expand()
} else {
scaffoldState.bottomSheetState.collapse()
}
}
},
modifier = Modifier
//.background(Color.Gray)
//.padding(0.dp)
.size(35.dp)
) {
Icon(
Icons.Filled.MoreVert,
contentDescription = null
)
}
}
}
} //END Card
}
1条答案
按热度按时间1l5u6lss1#
Cards_SearchingClicking
中的scaffoldState
与ddd
中使用的示例不同。您需要将scaffoldState
从ddd
传递到Cards_SearchingClicking
。