如何在 Jetpack Compose 中动态增加可组合性？

Question

我想在 Jetpack COmpose 中的触发事件上扩展可组合项。

如果我使用 XML，我会使用 Binding.inflate 或 LayoutInlfater.inflate。

// example
lifecycleScope.launch {
   viewModel.createNumberEffectEvent.collect { number ->
      val numberText = CustomAnimationTextBinding.inflate(LayoutInflater.from(context), this, true)
      numberText.tvNumber.text = "number: $number"

      // View Animation
      numberText.slideAnimate()
      numberTExt.remove(delay = 3000)
   }
}

但我不知道在 Jetpack Compose 中。

我不认为 compose 上的动态膨胀是一个好方法，因为它是声明式编程，但我想知道是否有办法。

下面的代码是我想要的示例。

LaunchedEffect(Unit) {
   viewModel.createNumberEffectEvent.collect { number ->
      inflate(CustomAnimationText(text = "create number: $number")) // Like this.
   }
}

Answer 1

您应该将您的“事件”改为某个 state，因为使用 Jetpack Compose，您显示/隐藏视图的方法只是简单地检查“if”/“？让”声明您的 state 值并声明可组合（这将导致屏幕重组与你的组合）或不。

在你的情况下，我认为它可以看起来像这样，你的可组合“屏幕”：

val number by viewModel.number.collectAsState<Int?>()
number?.let {
   CustomAnimationText(text = "create number: $it")
}

有关 Compose 中的状态的更多信息