如何在 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 中的狀態的更多信息