Try to search your question here, if you can't find : Ask Any Question Now ?

JavaFX mouse events on a pane below another one in a StackPane

HomeCategory: stackoverflowJavaFX mouse events on a pane below another one in a StackPane
Avatarpushpa asked 1 week ago

I am writing a JavaFX app. I use a StackPane with two children. The topmost has a transparent background. I want the another pane to capture mouse events.

How can I do this?


I tried to make the top child mouse transparent, but this disable mouse events on its children also transparent to mouse events.

// sample/Main.java
package sample;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.stage.StageStyle;

public class Main extends Application {

    public static final String appName = "Application name";

    @Override
    public void start(Stage primaryStage) throws Exception{
        Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
        primaryStage.initStyle(StageStyle.UNDECORATED);
        root.getStylesheets().add("sample/sample.css");
        primaryStage.setTitle("Hello World");
        primaryStage.setScene(new Scene(root, 400, 300));
        primaryStage.show();
    }


    public static void main(String[] args) {
        launch(args);
    }
}
// sample/Controller.java
package sample;

import javafx.application.Platform;
import javafx.fxml.FXML;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.AnchorPane;

public class Controller {
    @FXML
    private AnchorPane topbar;

    @FXML
    private Label lbAppName;
    @FXML
    private Button btnCloseApp;
    @FXML
    private Button button1;
    @FXML
    private Button button2;

    @FXML
    private void initialize() {
        lbAppName.setText(Main.appName);
        // this disables btnCloseApp
        topbar.setMouseTransparent(true);
        btnCloseApp.setOnAction(event -> {
            Platform.exit();
        });
        button1.setOnAction(event -> {
            System.out.println("Clicked button1");
        });
        button2.setOnAction(event -> {
            System.out.println("Clicked button2");
        });
    }
}
<!-- sample/sample.fxml -->

<?import javafx.scene.layout.StackPane?>

<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>
<StackPane fx:controller="sample.Controller"
           xmlns:fx="http://javafx.com/fxml">
  <HBox>
    <VBox fx:id="sidebar">
      <Button fx:id="button1" text="Button 1"/>
      <Button fx:id="button2" text="Button 2"/>
    </VBox>
    <GridPane fx:id="form">
      <Label text="Field 1" GridPane.rowIndex="0" GridPane.columnIndex="0"/>
      <TextField fx:id="field1" GridPane.rowIndex="0" GridPane.columnIndex="1"/>
      <Label text="Field 2" GridPane.rowIndex="1" GridPane.columnIndex="0"/>
      <TextField fx:id="field2" GridPane.rowIndex="1" GridPane.columnIndex="1"/>
    </GridPane>
  </HBox>

  <AnchorPane fx:id="topbar">
    <Label fx:id="lbAppName" AnchorPane.topAnchor="8" AnchorPane.leftAnchor="8"/>
    <Button fx:id="btnCloseApp" text="Close" AnchorPane.topAnchor="8" AnchorPane.rightAnchor="8"/>
  </AnchorPane>

</StackPane>
/* sample/sample.css*/
.root {
    -fx-border-color: #a8c;
}

#sidebar {
    -fx-padding: 40 8 8 8;
    -fx-spacing: 8;
    -fx-background-color: #caf;
    -fx-pref-width: 150;
}

#form {
    -fx-padding: 40 8 8 8;
    -fx-hgap: 8;
    -fx-vgap: 4;
}
1 Answers
Best Answer
AvatarJyoti answered 1 week ago
Your Answer

1 + 15 =

Popular Tags

WP Facebook Auto Publish Powered By : XYZScripts.com