列表点击事件

许多时候我们需要给列表项创建点击事件，本文解释了如何在 Jetpack Compose 中为你的列表项创建点击事件

1. 创建数据集

首先我们需要创建一个数据集，包含了常用水果名

// List 数据源
val fruits = arrayOf("Apple", "Apricot", "Almond", "Banana", "Betelnut", "Cherry", "Damson")

2. 创建列表项及点击事件

接下来需要我们声明列表项 FruitsRow 和点击事件 fruitClick

@Composable
private fun FruitsRow(item:String, clickEvent:()->Unit) {
    Text(
        text = item,
        modifier = Modifier
            .clickable(onClick = clickEvent)
            .fillMaxWidth()
            .wrapContentWidth(Alignment.CenterHorizontally)
            .height(50.dp))
}

val fruitClick = { fruit: String, context: Context ->
    Toast.makeText(context, fruit, Toast.LENGTH_SHORT).show()
}

FruitsRow 是一个高阶函数，它接受两个参数，一个是水果本身，另一个是点击事件函数

fruitClick 是一个Lambda 表达式，我们以此作为 FruitsRow 点击事件参数的值

3. 创建列表

最后使用 LazyColumn 创建列表即可，这样我们点击 item 的时候便会显示对应的水果名

val context = LocalContext.current

// 展示水果名列表
LazyColumn {
    items(fruits){ fruit->
        FruitsRow(fruit) { fruitClick(fruit, context) }
    }
}