Jetpack Compose导航栈中实现登录注册页背景固定不随键盘缩放

为实现Jetpack Compose中键盘弹出时背景不缩放，我参考方案在MainActivity的onCreate方法中添加了getWindow().setBackgroundDrawableResource(R.drawable.sign_in_sign_up_background)，但该背景会同时显示在SignInOrSignUpMasterView和OnboardingStartView两个页面中。我需要达成以下目标：

• 仅SignInOrSignUpMasterView页面显示sign_in_sign_up_background背景
• 键盘弹出时该背景不被缩放
  当前已在AndroidManifest.xml的.MainActivity节点配置android:windowSoftInputMode="adjustResize"。

要实现需求，需移除全局窗口背景设置，改为在目标Composable中设置固定尺寸背景，同时配合软输入模式避免缩放。

步骤1：移除全局背景设置 #

删除MainActivity中全局窗口背景的代码，避免背景对所有页面生效：

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // 移除全局背景设置
        // getWindow().setBackgroundDrawableResource(R.drawable.sign_in_sign_up_background)
        setContent {
            val user by remember { mutableStateOf(Firebase.auth.currentUser) }
            AppNavigation(
                startDestination = if (user == null) {
                    "signInOrSignUp"
                } else {
                    "onboarding"
                }
            )
        }
    }
}

步骤2：为目标页面添加固定尺寸背景 #

在SignInOrSignUpMasterView的根布局中设置背景图，通过ContentScale.FillBounds让背景填充窗口且保持原始比例，避免随键盘缩放：

@Composable
fun SignInOrSignUpMasterView(navController: NavController) {
    var text by remember { mutableStateOf(TextFieldValue("")) }
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(
                brush = ImagePainter(painterResource(R.drawable.sign_in_sign_up_background)).asBrush(),
                contentScale = ContentScale.FillBounds
            )
    ) {
        Column(modifier = Modifier.fillMaxSize()) {
            Spacer(modifier = Modifier.weight(1f))
            TextField(
                value = text,
                onValueChange = { text = it },
                modifier = Modifier.background(Color.White.copy(alpha = 0.8f))
            )
            Button(onClick = { navController.navigate("onboarding") }) {
                Text("Move to Onboarding")
            }
        }
    }
}

步骤3：配置其他页面独立背景 #

在AppNavigation中为onboarding页面设置独立背景（比如纯白），避免页面间背景干扰：

@Composable
fun AppNavigation(
    navController: NavHostController = rememberNavController(),
    startDestination: String = "signInOrSignUp"
) {
    NavHost(
        navController = navController,
        startDestination = startDestination
    ) {
        composable("signInOrSignUp") {
            SignInOrSignUpMasterView(navController = navController)
        }
        composable("onboarding") {
            Box(modifier = Modifier.fillMaxSize().background(Color.White)) {
                OnboardingStartView(navController = navController)
            }
        }
    }
}

关键原理 #

• 移除全局窗口背景后，每个页面可独立配置背景，避免跨页面污染
• ContentScale.FillBounds确保背景图填充窗口且保持原始比例，不会随键盘弹出而缩放
• 保留adjustResize模式，确保页面内容随键盘调整位置，同时背景不受影响

内容的提问来源于stack exchange，提问作者GVG