Compose for DesktopのMouse_Eventsのチュートリアルをやってみた。

環境

• Compose for Desktop 1.0.0-alpha3

参考

• compose-jb/tutorials/Mouse_Events at master · JetBrains/compose-jb · GitHub

Clickイベント

クリック・ダブルクリック・ロングクリックを取得できる。

fun main() = singleWindowApplication {
    @OptIn(ExperimentalFoundationApi::class)
    Box(
        modifier = Modifier
            .background(Color.Magenta)
            .fillMaxWidth(0.5f)
            .fillMaxHeight(0.5f)
            .combinedClickable(
                onClick = { println("onClick") },
                onDoubleClick = { println("onDoubleClick") },
                onLongClick = { println("onLongClick") },
            )
    )
}

moveイベント

マウスカーソルの移動が移動したイベントを取得できる。

fun main() = singleWindowApplication {
    Box(
        modifier = Modifier
            .background(Color.Magenta)
            .fillMaxWidth(0.5f)
            .fillMaxHeight(0.5f)
            .pointerMoveFilter(
                onMove = {
                    println("x:${it.x} y:${it.y}")
                    false
                }
            )
    )
}

enterイベント

マウスカーソルがコンポーネントの領域に入った/出たときのイベントを取得できる。

fun main() = singleWindowApplication {
    Box(
        modifier = Modifier
            .background(Color.Magenta)
            .fillMaxWidth(0.5f)
            .fillMaxHeight(0.5f)
            .pointerMoveFilter(
                onEnter = {
                    println("Enter")
                    false
                },
                onExit = {
                    println("Exit")
                    false
                }
            )
    )
}

右クリック・中クリックと修飾キー

押されたマウスのボタンと修飾キーを取得できる。

イベントに関する詳細情報が必要な場合は、PointerEventのmou​​seEventプロパティに利用可能な生のAWTマウスイベントオブジェクトがある。

@OptIn(ExperimentalDesktopApi::class)
fun main() = singleWindowApplication {
    var clickableText by remember { mutableStateOf("Click me!") }

    Column {
        Box(
            modifier = Modifier
                .background(Color.Magenta)
                .fillMaxWidth(0.5f)
                .fillMaxHeight(0.5f)
                .mouseClickable(
                    onClick = {
                        clickableText = buildString {
                            append("Buttons pressed:\n")
                            append("primary: ${buttons.isPrimaryPressed}\t")
                            append("secondary: ${buttons.isSecondaryPressed}\t")
                            append("tertiary: ${buttons.isTertiaryPressed}\t")

                            append("\n\nKeyboard modifiers pressed:\n")

                            append("alt: ${keyboardModifiers.isAltPressed}\t")
                            append("ctrl: ${keyboardModifiers.isCtrlPressed}\t")
                            append("meta: ${keyboardModifiers.isMetaPressed}\t")
                            append("shift: ${keyboardModifiers.isShiftPressed}\t")
                        }
                    }
                )
        )
        Text(
            text = clickableText
        )
    }
}