Popup

PopupSample

@Sampled
@Composable
fun PopupSample() {
    Box {
        val popupWidth = 200.dp
        val popupHeight = 50.dp
        val cornerSize = 16.dp

        Popup(alignment = Alignment.Center) {
            // Draw a rectangle shape with rounded corners inside the popup
            Box(
                Modifier.size(popupWidth, popupHeight)
                    .background(Color.White, RoundedCornerShape(cornerSize))
            )
        }
    }
}

PopupWithPositionProviderSample

@Sampled
@Composable
fun PopupWithPositionProviderSample() {
    val dropdownPopupPositioner = remember {
        object : PopupPositionProvider {
            override fun calculatePosition(
                anchorBounds: IntRect,
                windowSize: IntSize,
                layoutDirection: LayoutDirection,
                popupContentSize: IntSize,
            ): IntOffset {
                // Position the popup below the anchor aligned horizontally with the anchor's
                // center.
                return IntOffset(
                    x = anchorBounds.left + anchorBounds.width / 2,
                    y = anchorBounds.top + anchorBounds.height * 2,
                )
            }
        }
    }

    Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
        Box(modifier = Modifier.background(Color.LightGray).padding(10.dp)) {
            BasicText(text = "Anchor")

            Popup(popupPositionProvider = dropdownPopupPositioner) {
                Box(
                    modifier =
                        Modifier.background(Color.Green, RoundedCornerShape(16.dp)).padding(10.dp),
                    contentAlignment = Alignment.Center,
                ) {
                    BasicText(text = "Popup")
                }
            }
        }
    }
}