当TooltipBox
打开时,单击屏幕上的任何 Composable 都不会产生任何效果,除了关闭 Popup。它是如何做到的,以及在打开时无论当前 Composable 在 Composition 树中的什么位置,实现它的有效方法是什么,Popup
这样其他 Composable 都不会Popup
接收任何手势。
@Preview
@Composable
fun TooltipBoxSample() {
Column(
modifier = Modifier.fillMaxSize().border(2.dp, Color.Blue)
) {
Button(
onClick = {}
){
Text("Some button")
}
val state = rememberTooltipState(
isPersistent = true
)
val coroutineScope = rememberCoroutineScope()
Spacer(modifier = Modifier.height(120.dp))
Row(
modifier = Modifier.weight(1f)
) {
Spacer(modifier = Modifier.width(100.dp))
TooltipBox(
positionProvider = rememberPlainTooltipPositionProvider(
spacingBetweenTooltipAndAnchor = 16.dp
),
state = state,
tooltip = {
PlainTooltip(
caretProperties = CaretProperties(
caretWidth = 16.dp,
caretHeight = 16.dp
),
shape = RoundedCornerShape(16.dp),
containerColor = Color.Red
) {
Text(
text = "Tooltip Content for testing...",
modifier = Modifier.padding(16.dp)
)
}
},
content = {
Icon(
modifier = Modifier
.size(60.dp)
.clickable {
coroutineScope.launch {
state.show()
}
},
imageVector = Icons.Default.Info,
contentDescription = null
)
}
)
}
}
}
如果你使用Popup
Composables 触摸屏幕上的任意位置,则会收到点击事件
@Preview
@Composable
fun PopupOpenCloseTest() {
var showPopup by remember {
mutableStateOf(false)
}
Column(
modifier = Modifier.fillMaxSize()
) {
Button(
onClick = {}
) {
Text("Some button")
}
Box {
Icon(
modifier = Modifier
.border(2.dp, Color.Blue)
.size(60.dp)
.clickable {
if (showPopup.not()) {
showPopup = true
}
println("CLICKED showPopup: $showPopup")
},
imageVector = Icons.Default.Info,
contentDescription = null
)
if (showPopup) {
Popup(
offset = IntOffset(300, 300),
onDismissRequest = {
if (showPopup) {
showPopup = false
}
}
) {
Box(
modifier = Modifier.background(Color.White).padding(16.dp)
) {
Text("Popup Content")
}
}
}
}
}
}
我检查了Tooltip和BasicTooltip的源代码,但没有地方创建取消手势的窗口或视图,或者使用任何手势。
使 Popup 可聚焦即可达到此目的: