首页 > 解决方案 > Jetpack Compose 卡上的事件处理

问题描述

我有一个音乐播放器应用程序 - 在我的屏幕上,我有显示有关曲目信息的卡片。当我点击一张卡片时,播放器应该播放它的曲目。

@Composable
fun TrackCard(track: Track) {
    Card(
        modifier = Modifier.padding(5.dp).fillMaxWidth(),
        contentColor = Color.Black
    ) {
        Column(modifier = Modifier.padding(10.dp)) {
            ArtistName(text = track.artist.name)
            Headline(text = track.title)
            AlbumName(text = track.album.title)
        }
    }
}

我尝试Clickable在其上添加一个Modifier这样的:clickable(onClick = {}) 为了让曲目播放,我需要另一个用于我的 TrackCard 的参数,即播放器本身。由于我想将 UI 代码分开,我想知道是否可以添加一个事件侦听器并从那里访问播放曲目?(我也想捕捉不同类型的事件,如长按触摸等,以进行不同的事件处理)

跟踪卡的初始化如下:

@Composable
private fun ResultList(model: PlayerModel) {
    with(model) {
            LazyColumn(state = rememberLazyListState()) {
                items(tracks) {
                    TrackCard(it)
                }
            }
        }
    }
}

我将如何做到这一点?

标签: androidkotlinevent-handlingandroid-jetpack-compose

解决方案


您可以像这样向卡片添加点击事件。将您想要包含的点击代码放入可点击函数中

Card(
modifier = Modifier.padding(5.dp).fillMaxWidth().clickable{ },
        contentColor = Color.Black       
    )

推荐阅读