一、概念

不止觸摸交互，在 ChromeOS 或外接鍵鼠的設備上，需要考慮焦點、懸停、右鍵等操作邏輯。

二、使用

2.1 焦點

使用 Tab 鍵來導航，改變邊框以提供清晰的焦點指示器。

@Composable
fun Demo() {val interactionSource = remember { MutableInteractionSource() }val isFocused by interactionSource.collectIsFocusedAsState()val border = BorderStroke(width = if (isFocused) 3.dp else 1.dp,color = if (isFocused) Color.Red else Color.Black)Box(modifier = Modifier.focusable(interactionSource = interactionSource).border(border)) {}
}

2.2 右鍵

右鍵/長按，表示更多選項。

@Composable
fun Demo() {var showMore by rememberSaveable { mutableStateOf(false) }var pressOffset by remember { mutableStateOf(DpOffset.Zero) }Box(modifier = Modifier.pointerInput(Unit) {detectTapGestures(onLongPress = { offset ->pressOffset = DpOffset(offset.x.toDp(), offset.y.toDp())showMore = true})}) {DropdownMenu(expanded = showMore,onDismissRequest = { showMore = false },offset = pressOffset) {DropdownMenuItem(text = { Text("AAA") }, onClick = {  })DropdownMenuItem(text = { Text("BBB") }, onClick = {  })}}
}

2.3 懸停

讓組件感知鼠標懸停，改變背景色。

@Composable
fun Demo() {val interactionSource = remember { MutableInteractionSource() }val isHovered by interactionSource.collectIsHoveredAsState()val backgroundColor = if (isHovered) Color.Gray else Color.WhiteBox(modifier = Modifier.hoverable(interactionSource = interactionSource).background(backgroundColor)) { }
}