如何使 LazyColumn 中的行可点击

Question

如何将涟漪效应应用到 LazyColumn 中的整行项目，而不仅仅是文本本身？ Text 是否需要在带有可点击修饰符的 Row 中，还是应该做其他事情？

class MainActivity : ComponentActivity() {
    private var itemArray: Array<String>? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        itemArray = resources.getStringArray(R.array.array_breads)

        super.onCreate(savedInstanceState)
        setContent {
            AdaptiveTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    MyScaffold(itemArray = itemArray as Array<out String>)
                }
            }
        }
    }
}

@OptIn(ExperimentalAnimationApi::class)
@Composable
fun MyScaffold(itemArray: Array<out String>) {
    val listState = rememberLazyListState()

    Scaffold(
        topBar = {
            SmallTopAppBar(
                title = {
                    Text(text = stringResource(id = R.string.breads))
                }
            )
        },
        content = {
            LazyColumn(
                modifier = Modifier.fillMaxSize(),
                state = listState,
                ) {
                items(itemArray) { item ->
                    Row(modifier = Modifier.clickable {  }) {
                        Text(
                            modifier = Modifier
                                .clickable { },
                            text = item
                        )
                    }
                }
            }
        }
    )
}

Answer 1

先生，您需要确保 Row 填满屏幕的整个宽度。只需在 Row 中添加一个 Modifier.fillMaxWidth()，就可以了。

如何使 LazyColumn 中的行可点击

How to make row in LazyColumn clickable

android

kotlin

android-jetpack-compose