Jetpack Compose PopUp удаляет содержимое за пределы границ после 16.dp ⇐ Android

[Anonymous]

Я работаю над созданием всплывающей подсказки с курсором разной высоты. Однако Popup обрезает что-либо за пределами своих границ, если размеры превышают 16.dp по вертикали. Я также попробовал установить PopProperties(clipEnabled = false).
Я начал с ToolTipBox, а затем понял, что проблема связана с самим PopUp. Почему это происходит и есть ли способ снять это ограничение?
Если вы измените высоту курсора выше 16.dp, вы увидите, что часть, превышающая эту высоту, обрезается.


@Preview
@Composable
fun TooltipSample() {
var caretSize by remember {
mutableStateOf(0f)
}

Column(
modifier = Modifier.fillMaxSize()
) {

Text("Caret width: ${caretSize}dp", fontSize = 18.sp)

Slider(
value = caretSize,
onValueChange = {
caretSize = it
},
valueRange = 0f..100f
)

Spacer(modifier = Modifier.height(150.dp))

val state = rememberTooltipState(
isPersistent = true
)
val coroutineScope = rememberCoroutineScope()

Row {
Spacer(modifier = Modifier.width(200.dp))

TooltipBox(
positionProvider = rememberPlainTooltipPositionProvider(
spacingBetweenTooltipAndAnchor = caretSize.dp
),
state = state,
tooltip = {

PlainTooltip(
caretProperties = CaretProperties(
caretWidth = caretSize.dp,
caretHeight = caretSize.dp
),
modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(16.dp),
containerColor = Color.Red
) {
Text(
text = "Tooltip Content for testing...",
modifier = Modifier.padding(16.dp)
)
}

},
content = {
Icon(
modifier = Modifier.clickable {
if (state.isVisible) {
state.dismiss()
} else {
coroutineScope.launch {
state.show()
}
}
},
imageVector = Icons.Default.Info,
contentDescription = null
)
}
)
}

}
}

Чтобы отследить, в чем проблема, я также экспериментировал с самим PopUp, где он обрезает синие и желтые круги и прямоугольник с обводкой, которые я собираюсь заменить своей собственной реализацией курсора или стрелки. .


@Composable
private fun AnchorContent(
modifier: Modifier
) {
// This is content
Icon(
modifier = modifier,
imageVector = Icons.Default.Info,
contentDescription = null
)
}

@Composable
private fun PopUpBox(
isVisible: Boolean,
onDismissRequest: () -> Unit,
content: @Composable (LayoutCoordinates?) -> Unit,
anchor: @Composable () -> Unit

) {
var anchorBounds: LayoutCoordinates? by remember { mutableStateOf(null) }

val wrappedAnchor: @Composable () -> Unit = {
Box(
modifier = Modifier.onGloballyPositioned { anchorBounds = it }
) {
anchor()
}
}

Box(
modifier = Modifier.border(2.dp, Color.Blue)
) {
if (isVisible) {
Popup(
properties = PopupProperties(clippingEnabled = true),
popupPositionProvider = rememberPlainTooltipPositionProvider(
spacingBetweenTooltipAndAnchor = 20.dp
),
onDismissRequest = onDismissRequest
) {
content(anchorBounds)
}
}

Box {
wrappedAnchor()
}
}
}

И демо-версия для воспроизведения с помощью Popup
@Preview
@Composable
private fun PopupTest() {

var showPopup by remember {
mutableStateOf(false)
}

var padding by remember {
mutableFloatStateOf(0f)
}

Column(
modifier = Modifier.fillMaxSize().background(backgroundColor)
) {

Slider(
value = padding,
onValueChange = {
padding = it
},
valueRange = 0f..350f
)

Spacer(modifier = Modifier.height(150.dp))

Row(
verticalAlignment = Alignment.CenterVertically
) {

Text("Info")
Spacer(modifier = Modifier.width(padding.dp))

Box {
PopUpBox(
onDismissRequest = {
showPopup = false
},
isVisible = showPopup,
anchor = {
AnchorContent(
modifier = Modifier
.size(80.dp)
.border(2.dp, Color.Green)
.clickable {
showPopup = showPopup.not()
}
)
},
content = { anchorLayoutCoordinates: LayoutCoordinates? ->

Box(
modifier = Modifier
.drawWithContent {
drawContent()
drawCircle(
color = Color.Blue,
radius = 60.dp.toPx(),
center = Offset(
x = size.width / 2,
y = 0f
)
)
drawCircle(
color = Color.Yellow,
radius = 60.dp.toPx(),
center = Offset(
x = size.width / 2,
y = size.height + 30.dp.toPx()
)
)

anchorLayoutCoordinates?.boundsInWindow()?.let {
val width = 60.dp.toPx()

drawRect(
color = Color.Red,
size = Size(width, width),
topLeft = Offset(
x = it.center.x - width / 2,
y = size.height

),
style = Stroke(
2.dp.toPx()
)
)
}
}
.padding(horizontal = 16.dp)
.fillMaxWidth()
.background(
Color.White, RoundedCornerShape(16.dp)
)
.padding(16.dp)
) {
Text(
"This is PopUp Content something something something",
fontSize = 16.sp
)
}
}
)

}
}
Box(
modifier = Modifier
.fillMaxWidth()
.height(200.dp)
.background(Color.Gray)
)

}
}


Подробнее здесь: https://stackoverflow.com/questions/787 ... fter-16-dp