Question

例如，对android developer's site中给出的示例代码片段进行一些修改后

@Composable
fun ClickCounter(clicks: Int, onClick: () -> Unit) {
    Button(onClick = onClick) {
        Text("I've been clicked $clicks times")
    }
}

可以计算按钮被按下的次数，并通过更改 UI 中 Text 组件中的字符串来显示此计数。但是，这需要用户实际按下按钮才能更改文本。有没有办法以编程方式做到这一点？我想在其他地方执行一些计算，当结果准备好时，通过更新 Text 来显示它（如果我一直在使用 xml 来生成 UI，则执行类似 Text.setText("...") 的操作）。如何以编程方式更改 Text 的值？是否有任何来自 google 的 jetpack compose 示例程序有一个简单的例子？

Answer 1

可组合函数需要有 MutableState 才能以编程方式更新。它可以从可观察对象（如 LiveData 或 Flow）或通过调用 mutableStateOf() 创建。

val text = mutableStateOf("text")
// or
val text = MutableStateFlow("text")

@Composable
fun MyText() {
    val myText by text
    // or
    val myText by text.collectAsState()
    Text(myText)
}

然后您可以通过更新 observable 以编程方式更新值：

text.value = "other text"

示例

class MainActivity : AppCompatActivity() {
    private val a = 10000L
    private val b = 1000L
    private val c = mutableStateOf(a)

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val timer = object : CountDownTimer(a, b) {
            override fun onTick(millisUntilFinished: Long) {
                Log.d("MYLOG", "text updated programmatically")
                c.value = millisUntilFinished
            }

            override fun onFinish() {
                c.value = 0
            }
        }
        timer.start()
        setContent { CountDown() }
    }

    @Composable
    fun CountDown() {
        val milliseconds by c
        val text = (milliseconds / 1000).toString()
        Text(text)
    }
}

阅读更多here

Answer 2

在 Compose 中，UI 是不可变的，绘制后无法更新它，但您可以控制 UI 的状态。

换句话说，您没有像 Text.setText("...") 这样的方法，但您可以构建对状态和事件起作用的可组合函数。

例如，您可以使用 mutableStateOf(value)。
它创建了一个 MutableState，它是 Compose 中的可观察类型。对其值的任何更改都将安排读取该值的任何可组合函数的重组。

您可以使用以下内容：

    var count by remember { mutableStateOf(0) }                        
    Button(onClick = { count++ }){
                Text("Add")
    }
    Text(text = "count: ${count}")

更多信息here。

有没有办法动态更改 compose 的 Text() 中的字符串？

2 个答案: