我正在开发一个 Jetpack Compose 应用程序,该应用程序实现了 Material3 新的下拉刷新 (PullToRefreshBox) 功能。但是,我遇到了一个问题:当我导航回屏幕或向上/向下滑动屏幕时,下拉刷新框会消失。
我面临的问题:下拉刷新指示器消失:当我离开此屏幕然后返回时,滚动屏幕或单击屏幕,在刷新任务正在进行时下拉刷新指示器会立即消失。
向上/向下滑动时的行为:此外,当我向上或向下滑动时,下拉刷新指示器会意外消失。
@AndroidEntryPoint
class TestActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
MyApp()
}
}
}
@Composable
fun MyApp() {
// Define the routes and their respective icons
val topLevelRoutes = listOf(
TopLevelRoute("Profile", "profile", Icons.Filled.AccountCircle),
TopLevelRoute("Friends", "friends", Icons.Filled.People)
)
// Create a NavController
val navController = rememberNavController()
Scaffold(
bottomBar = {
BottomNavigation {
val navBackStackEntry by navController.currentBackStackEntryAsState()
val currentDestination = navBackStackEntry?.destination
topLevelRoutes.forEach { topLevelRoute ->
BottomNavigationItem(
icon = {
Icon(
topLevelRoute.icon,
contentDescription = topLevelRoute.name
)
},
label = { Text(topLevelRoute.name) },
selected = currentDestination?.route == topLevelRoute.route,
onClick = {
navController.navigate(topLevelRoute.route) {
popUpTo(navController.graph.findStartDestination().id) {
saveState = true
}
launchSingleTop = true
restoreState = true
}
}
)
}
}
}
) { innerPadding ->
NavHost(navController, startDestination = "profile", Modifier.padding(innerPadding)) {
composable("profile") { ProfileScreen() }
composable("friends") { FriendsScreen() }
}
}
}
data class TopLevelRoute(val name: String, val route: String, val icon: ImageVector)
@OptIn(ExperimentalMaterialApi::class, ExperimentalMaterial3Api::class)
@Composable
fun ProfileScreen() {
var isRefreshing by rememberSaveable { mutableStateOf(false) }
// Launch an effect when refreshing starts
if (isRefreshing) {
LaunchedEffect(Unit) {
delay(10000) // Simulate a network call
isRefreshing = false // Reset refreshing state
}
}
// Content for the Profile screen
Surface {
PullToRefreshBox(
onRefresh = { isRefreshing = true },
isRefreshing = isRefreshing,
modifier = Modifier
.fillMaxSize()
) {
Column(
modifier = Modifier
.fillMaxSize()
.verticalScroll(rememberScrollState()),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally,
) {
// Your main content here
Text("Profile Screen", style = MaterialTheme.typography.h4)
}
}
}
}
@Composable
fun FriendsScreen() {
// Content for the Friends screen
Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
Text("Friends Screen")
}
}
这是material3当前稳定版本中的一个错误。我认为这个提交已在当前alpha版本1.4.0-alpha02中修复。
因此,如果您想检查它,您可以将
androidx.compose:compose-bom
依赖项更改为androidx.compose:compose-bom-alpha
。