Início / coding / Perguntas / 79059318
Accepted
David Tonhofer
Asked: 2024-10-06 22:20:30 +0800 CST

Eventos JavaFX enviados para um controle de botão: por que dois eventos MOUSE_ENTERED / MOUSE_EXITED?

  • 772

Eu experimentei um pouco com os eventos enviados para um controle de botão JavaFX dependendo do que acontece com o ponteiro do mouse e gerei um diagrama de máquina de estado hierárquico (aproximado, já que meu editor não tem nenhuma noção de semântica) a partir disto:

Tudo isso é bem direto, basta rastrear o comportamento do estado inicial e ver o que acontece. Há uma sutileza aqui, pois o rótulo dentro do controle do botão também tem um papel a desempenhar, e ele gera MOUSE_ENTERED_TARGETeventos MOUSE_EXITED_TARGET(eu perguntei ao ChatGPT sobre isso e ele imprimiu uma resposta linda que estava bem errada 😂)

Máquina de estado hierárquica de controle de botão

A única questão que me deixa curioso é: por que sempre recebo dois MOUSE_ENTEREDou dois MOUSE_EXITEDeventos, um com consumed = falsee outro com consumed = true?

Código de exemplo

Aqui está o exemplo (quase mínimo). Ele apenas cria um botão que podemos pressionar manualmente para ver quais eventos são gerados:

Arquivocom.example.stack_overflow.Main.java

package com.example.stack_overflow;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.Event;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

import java.util.Objects;

class PaneBuilder {

    private final StackPane stackPane;

    private static void log(String text) {
        System.out.println(text);
    }

    public PaneBuilder() {
        stackPane = buildCenteringStackPaneAroundButton(buildButton());
    }

    private static Button buildButton() {
        final var button = new Button("Click Me!");
        button.setMinWidth(120); // I think these are "120pt", why is there no "unit"?
        final var desc = "Button";
        button.addEventHandler(ActionEvent.ACTION, event -> {
            handleActionEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_PRESSED, event -> {
            handleMouseEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_RELEASED, event -> {
            handleMouseEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_CLICKED, event -> {
            handleMouseEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_ENTERED, event -> {
            handleMouseEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_EXITED, event -> {
            handleMouseEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_ENTERED_TARGET, event -> {
            handleMouseEvent(desc, event);
        });
        button.addEventHandler(MouseEvent.MOUSE_EXITED_TARGET, event -> {
            handleMouseEvent(desc, event);
        });
        button.armedProperty().addListener((obs, oldVal, newVal) -> log(desc + ": armed status changes: " + oldVal + " -> " + newVal));
        return button;
    }

    public Pane getPane() {
        return stackPane;
    }

    private static StackPane buildCenteringStackPaneAroundButton(Button button) {
        final var stackPane = new StackPane();
        stackPane.setAlignment(Pos.CENTER);
        final var hbox = buildHBoxAroundVBoxAroundButton(button);
        final var insets = new Insets(20, 20, 20, 20); // I guess those are "20points"
        StackPane.setMargin(hbox, insets);
        stackPane.getChildren().add(hbox);
        return stackPane;
    }

    private static HBox buildHBoxAroundVBoxAroundButton(Button button) {
        final var hbox = new HBox();
        hbox.setAlignment(Pos.CENTER);
        hbox.getChildren().add(buildVBoxAroundButton(button));
        return hbox;
    }

    private static VBox buildVBoxAroundButton(Button button) {
        final var vbox = new VBox();
        vbox.setAlignment(Pos.CENTER);
        vbox.getChildren().add(button);
        return vbox;
    }

    private static void appendEventDesc(StringBuilder buf, Event event) {
        buf.append("\n   Type          : " + event.getEventType());
        buf.append("\n   Class         : " + event.getClass().getName());
        buf.append("\n   Consumed      : " + event.isConsumed());
        buf.append("\n   Source class  : " + event.getSource().getClass().getName());
        buf.append("\n   Event         : " + Objects.toIdentityString(event));
    }

    public static void handleMouseEvent(String desc, MouseEvent event) {
        final var buf = new StringBuilder("Mouse event in " + desc);
        appendEventDesc(buf, event);
        log(buf.toString());
    }

    public static void handleActionEvent(String desc, ActionEvent event) {
        final var buf = new StringBuilder("Action event in " + desc);
        appendEventDesc(buf, event);
        log(buf.toString());
    }
}

public class Main extends Application {

    @Override
    public void start(Stage stage) {
        stage.setTitle("Button Example");
        stage.setScene(new Scene(new PaneBuilder().getPane()));
        stage.sizeToScene();
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

}

E o POM para construir e executar o acima. O programa deve ser executado com o objetivo Maven javafx:rundo plugin JavaFX Maven

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>com.example</groupId>
    <artifactId>stack_overflow</artifactId>
    <version>1.0-SNAPSHOT</version>

    <!-- RUNNING VIA MAVEN + JAVAFX PLUGIN IN IDE: -->
    <!--   'Main Menu' > 'Run' > 'Run Maven Goal' > 'Plugins' > 'JavaFx Maven Plugin' > 'javafx:run' -->
    <!--   This will invoke the goal "javafx:run" of the "javafx-maven-plugin". -->
    <!--   With the 'Run New Maven Goal' menu entry, you can define that goal, and it will appear in the -->
    <!--   context menu as 'right-mouse-button menu' > 'run maven' > 'javafx:run' -->

    <!-- RUNNING VIA MAVEN IN COMMAND LINE w/o leaving the IDE (no need for OpenJDX SDK): -->
    <!-- Right-click on the project window and select "Open Terminal at the current Maven module path". -->
    <!-- Enter the command "mvn javafx:run" or for debugging output "mvn -X javafx:run". -->
    <!-- This will invoke the goal "javafx:run" of the "javafx-maven-plugin". -->

    <properties>

        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>

        <!-- This is the latest OpenJavaFX version on 2024-09-26 (version of 2024-09-16) -->
        <!-- https://mvnrepository.com/artifact/org.openjfx/javafx-controls -->

        <javafx.version>23</javafx.version>

        <javafx.plugin.version>0.0.8</javafx.plugin.version>
        <compiler.plugin.version>3.13.0</compiler.plugin.version>
        <exec.plugin.version>3.4.1</exec.plugin.version>
        <dependency.plugin.version>3.8.0</dependency.plugin.version>
        <main.class>com.example.stack_overflow.Main</main.class>

        <java.compiler.source.version>21</java.compiler.source.version>
        <java.compiler.target.version>21</java.compiler.target.version>

    </properties>

    <dependencies>
        <!-- https://mvnrepository.com/artifact/org.openjfx/javafx-controls -->
        <dependency>
            <groupId>org.openjfx</groupId>
            <artifactId>javafx-controls</artifactId>
            <version>${javafx.version}</version>
        </dependency>
        <!-- https://mvnrepository.com/artifact/org.openjfx/javafx-fxml -->
        <dependency>
            <groupId>org.openjfx</groupId>
            <artifactId>javafx-fxml</artifactId>
            <version>${javafx.version}</version>
        </dependency>
    </dependencies>

    <build>
        <plugins>

            <!-- Standard Java Compiler Plugin -->
            <!-- https://maven.apache.org/plugins/maven-compiler-plugin/ -->
            <!-- https://mvnrepository.com/artifact/org.apache.maven.plugins/maven-compiler-plugin -->

            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>${compiler.plugin.version}</version>
                <configuration>
                    <source>${java.compiler.source.version}</source>
                    <target>${java.compiler.target.version}</target>
                </configuration>
            </plugin>

            <!-- Special Plugin to run JavaFX programs -->
            <!-- https://github.com/openjfx/javafx-maven-plugin -->
            <!-- https://mvnrepository.com/artifact/org.openjfx/javafx-maven-plugin -->
            <!-- If you run the plugin's goal on the command line with the '-X' option like so: -->
            <!-- mvn -X javafx:run -->
            <!-- you will see the command line the plugin builds, which looks as follows, with ++ replaced by double dash -->

            <plugin>
                <groupId>org.openjfx</groupId>
                <artifactId>javafx-maven-plugin</artifactId>
                <version>${javafx.plugin.version}</version>
                <configuration>
                    <mainClass>${main.class}</mainClass>
                    <options>
                        <option>-ea</option>
                    </options>
                </configuration>
            </plugin>

        </plugins>
    </build>
</project>

Executar este programa abre esta janela:

insira a descrição da imagem aqui

Se agora seguirmos o caminho vermelho indicado com o ponteiro do mouse, clicarmos com o mouse e movermos o ponteiro do mouse para fora do botão novamente:

insira a descrição da imagem aqui

obtemos as seguintes alterações no valor do armedatributo e eventos emitidos pelo botão. Note o double MOUSE_ENTEREDcom consumed= false, então true.

Entrando no controle do botão:

Mouse event in Button
   Type          : MOUSE_ENTERED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@2ebee20a
Mouse event in Button
   Type          : MOUSE_ENTERED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : true
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@2ebee20a

Inserindo o rótulo do controle do botão:

Mouse event in Button
   Type          : MOUSE_ENTERED_TARGET
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@5d41df9f

Ao clicar, observe a mudança no status de armed.

Mouse event in Button
   Type          : MOUSE_PRESSED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@3df998ed
Button: armed status changes: false -> true
Mouse event in Button
   Type          : MOUSE_RELEASED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@241a11d5
Action event in Button
   Type          : ACTION
   Class         : javafx.event.ActionEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.event.ActionEvent@3d8fce01
Button: armed status changes: true -> false
Mouse event in Button
   Type          : MOUSE_CLICKED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@505036ef

Saindo do rótulo do controle do botão:

Mouse event in Button
   Type          : MOUSE_EXITED_TARGET
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@2d496725

Saindo do controle de botão:

Mouse event in Button
   Type          : MOUSE_EXITED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : false
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@59a94fe0
Mouse event in Button
   Type          : MOUSE_EXITED
   Class         : javafx.scene.input.MouseEvent
   Consumed      : true
   Source class  : javafx.scene.control.Button
   Event         : javafx.scene.input.MouseEvent@59a94fe0
javafx

2 respostas

  1. Best Answer

    De acordo com a documentação, os manipuladores de eventos MOUSE_EXITED e MOUSED_EXITED_TARGET serão disparados com um MOUSE_EXITEDevento quando o mouse sair do botão.

    Você está manipulando ambos os tipos de eventos. Um evento MOUSED_EXITED_TARGET também é um evento do tipo MOUSE_EXITED, então quando você tem um manipulador para ambos, ambos são disparados quando o mouse sai do alvo.

    Você escreve:

    button.addEventHandler(MouseEvent.MOUSE_EXITED, event -> {
    handleMouseEvent(desc, event);
});
button.addEventHandler(MouseEvent.MOUSE_EXITED_TARGET, event -> {
    handleMouseEvent(desc, event);
});

    Você pode ver na sua saída que há apenas um único evento gerado (apenas manipulado várias vezes) porque a saída de ambos os manipuladores de eventos faz referência ao mesmo objeto de evento:

    Event         : javafx.scene.input.MouseEvent@59a94fe0

    Explicação

    Isso é explicado no MouseEventjavadoc .

    Desculpe por copiar um trecho tão grande, mas é um pouco complicado e eu não conseguiria explicar melhor e mais resumidamente.

    Manipulação de entrada/saída do mouse

    Quando o mouse entra em um nó, o nó recebe o evento MOUSE_ENTERED, quando ele sai, ele recebe o evento MOUSE_EXITED. Esses eventos são entregues somente ao nó que entrou/saiu e aparentemente não passam pelas fases de captura/borbulhamento. Esse é o caso de uso mais comum.

    Quando a captura ou borbulhamento é desejada, há eventos MOUSE_ENTERED_TARGET/MOUSE_EXITED_TARGET. Esses eventos passam pelas fases de captura/borbulhamento normalmente. Isso significa que o pai pode receber o evento MOUSE_ENTERED_TARGET quando o mouse entra no próprio pai ou em alguns de seus filhos. Para distinguir entre esses dois casos, o destino do evento pode ser testado em igualdade com o nó.

    Esses dois tipos estão intimamente conectados: MOUSE_ENTERED/MOUSE_EXITED são subtipos de MOUSE_ENTERED_TARGET/MOUSE_EXITED_TARGET. Durante a fase de captura, MOUSE_ENTERED_TARGET é entregue aos pais. Quando o evento é entregue ao destino do evento (o nó que realmente foi inserido), seu tipo é alternado para MOUSE_ENTERED. Então o tipo é alternado de volta para MOUSE_ENTERED_TARGET para a fase de borbulhamento. Ainda é um evento apenas trocando de tipo, então se for filtrado ou consumido, afeta ambas as variantes do evento. Graças ao relacionamento de subtipo, um manipulador de eventos MOUSE_ENTERED_TARGET receberá o evento MOUSE_ENTERED no destino.

    Coloquei a última frase em negrito para dar ênfase.

    • 3

  2. Adenda

    O Stack Overflow não permite "comentar a postagem de alguém", então colocarei isso como uma resposta adicional:

    Um diagrama de statechart UML não muito corrigido que permite rastrear os eventos emitidos pelo botão. Ele precisa de algumas modificações para ser UML real, e estados aninhados podem até melhorá-lo. Mas isso serve por enquanto.

    O gráfico de estados do botão JavaFX

    exatamente para um controle de botão contendo apenas um rótulo:

    Exemplo de controle de botão

    • 1

relate perguntas