英文:
Alternate use of View.INVISIBLE in jetpack compose
问题
在 Jetpack Compose 中,使用 AnimatedVisibility 来达到 XML 中 View.INVISIBLE 的效果。这个方法可以让视图在不可见时不占据布局空间。示例代码如下:
AnimatedVisibility(
    // true or false
) {
    Button() // 按钮的代码
}
英文:
In xml we use View.INVISIBLE to just don't show the view at all, but it still takes up space for layout purposes. What is the alternative in jetpack compose?
AnimatedVisibility(
    // true or false
) {
    Button() // button code.
}
答案1
得分: 6
你可以构建一个自定义修饰符来测量组合内容所占据的空间。
类似这样的代码:
fun Modifier.visible(visible: Boolean) = if (visible) this else this.then(Invisible)
private object Invisible : LayoutModifier {
    override fun MeasureScope.measure(
        measurable: Measurable,
        constraints: Constraints
    ): MeasureResult {
        val placeable = measurable.measure(constraints)
        return layout(placeable.width, placeable.height) {}
    }
}
英文:
You can build a custom modifier to measure the Composable to take up space.
Something like:
fun Modifier.visible(visible: Boolean) = if (visible) this else this.then(Invisible)
private object Invisible : LayoutModifier {
    override fun MeasureScope.measure(
        measurable: Measurable,
        constraints: Constraints
    ): MeasureResult {
        val placeable = measurable.measure(constraints)
        return layout(placeable.width, placeable.height) {}
    }
}
答案2
得分: 1
以下是代码的翻译部分:
// 接受的答案非常完美,但您还可以查看以下代码。
@Composable
fun ShowContentOrNot() {
    var isShow by remember { mutableStateOf(true) }
    Column(
        modifier = Modifier.fillMaxSize(),
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.Center
    ) {
        if (isShow)
            Text(text = "Some content")
        Spacer(modifier = Modifier.height(20.dp))
        Button(onClick = {
            isShow = !isShow
        }) {
            Text(text = "Hide/Show")
        }
    }
}
请注意,由于原始代码中包含HTML实体(例如"),我已将它们还原为普通文本。
英文:
The Accepted answer is perfect , but you can also look into the below code.
@Composable
fun ShowContentOrNot() {
    var isShow by remember { mutableStateOf(true) }
    Column(
        modifier = Modifier.fillMaxSize(),
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.Center
    ) {
        if (isShow)
            Text(text = "Some content")
        Spacer(modifier = Modifier.height(20.dp))
        Button(onClick = {
            isShow = !isShow
        }) {
            Text(text = "Hide/Show")
        }
    }
}
答案3
得分: 0
我只使用alpha修饰符扩展函数来实现这个功能,它可以涵盖90%的使用情况,除非你正在将alpha通道用于其他用途。例如,我可以这样做,对于文本:
Text( modifier = Modifier.alpha(0f), text = "Lorem Ipsum")
英文:
I just use the alpha Modifier extension function to achieve this functionality which may cover 90% of the use cases, unless you're using the alpha channel for other purposes. I do it like this, for example, on a text:
Text( modifier = Modifier.alpha(0f), text = "Lorem Ipsum")
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论