如何在JavaFX應用程序中在沒有webview或fxml的情況下執行javascript？

Question

我有一個JavaFX示例代碼，帶有CSS文件和javascript文件，沒有html代碼和fxml代碼，並且我想加載javascript文件代碼。 我知道如何使用以下方式加載css文件：

scene.getStylesheets().add(Login.class.getResource("login.css").toExternalForm());

但是我找不到針對javascript文件的相同說明。 我想將javascript文件代碼添加到場景中：

.java代碼是：

package login;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.HBox;
import javafx.scene.text.Text;
import javafx.stage.Stage;


public class Login extends Application {

    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Bienvenido a JavaFX");
        GridPane grid = new GridPane();
        grid.setAlignment(Pos.CENTER);
        grid.setHgap(10);
        grid.setVgap(10);
        grid.setPadding(new Insets(25, 25, 25, 25));
        Scene scene = new Scene(grid, 300, 300);
        primaryStage.setScene(scene);
        scene.getStylesheets().add(Login.class.getResource("login.css").toExternalForm());


        Text scenetitle = new Text("Bienvenido");
        //scenetitle.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));
        scenetitle.setId("welcome-text");
        grid.add(scenetitle, 0, 0, 2, 1);

        Label userName = new Label("Nombre de Usuario:");
        grid.add(userName, 0, 1);

        TextField userTextField = new TextField();
        grid.add(userTextField, 1, 1);

        Label pw = new Label("Contraseña:");
        grid.add(pw, 0, 2);

        PasswordField pwBox = new PasswordField();
        grid.add(pwBox, 1, 2);

        //grid.setGridLinesVisible(true); // Para Debugging.

        Button btn = new Button("Entrar");
        HBox hbBtn = new HBox(10);
        hbBtn.setAlignment(Pos.BOTTOM_RIGHT);
        hbBtn.getChildren().add(btn);
        grid.add(hbBtn, 1, 4);

        final Text actiontarget = new Text();
        grid.add(actiontarget, 1, 6);

        //Eventos(btn, actiontarget);

        primaryStage.show();
    }
    // I WANT TO SUBSTITUTE THIS  EVENT WITH THE JAVASCRIPT FILE CODE 
    /*public void Eventos(Button btn, final Text actiontarget) {
        btn.setOnAction((ActionEvent event) -> {
            //actiontarget.setFill(Color.FIREBRICK);
            actiontarget.setId("actiontarget");
            actiontarget.setText("Botón Entrar presionado");
        });
    }*/

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

javascript代碼是： login.js

var actiontarget = document.getElementById("actiontarget") ;
function handleSubmitButtonAction() {
    actiontarget.setText("Calling the JavaScript");
}

CSS代碼是： login.css

.root {
    -fx-background-color: lightblue;
}
.label {
    -fx-font-size: 0.750em;
    -fx-font-weight: bold;
    -fx-font-text-fill: #333333;
}
.label, #actiontarget {
    -fx-effect: dropshadow(gaussian, rgba(255, 255, 255, 0.5), 0, 0, 0, 1);
}
#welcome-text {
    -fx-font-size: 2.0em;
    -fx-font-family: "Arial Black";
    -fx-fill: #818181;
    -fx-effect: innershadow(three-pass-box, rgba(0, 0, 0, 0.7), 6, 0.0, 0, 2);
}
#actiontarget {
    -fx-fill: firebrick;
    -fx-font-weight: bold;
}
.button {
    -fx-text-fill: white;
    -fx-font-family: "Arial Narrow";
    -fx-font-weight: bold;
    -fx-background-color: linear-gradient(#61a2b1, #2A5058);
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
    -fx-transition: all 2s linear;
}
.button:hover {
    -fx-background-color: linear-gradient(#2A5058, #61a2b1);
}

我知道如何用FXML文件制作文件，而且我從互聯網上找到的所有可能的解決方案都在使用webview，webengine和html文件，但是我的應用程序中沒有html文件。

該代碼來自Oracle JavaFX官方網頁上的ifxpub-get_started.pdf文檔。

謝謝

Answer 1

好的，似乎唯一的方法是制作fxml文件，因為它沒有實現為能夠從.java類執行.js文件。 解決方案代碼：

文件Login.java ：

package login;

import java.io.IOException;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Login extends Application {

    @Override
    public void start(Stage primaryStage) throws IOException {
        Parent root;
        root = FXMLLoader.load(getClass().getResource("login.fxml"));
        primaryStage.setTitle("Bienvenido a JavaFX");

        Scene scene = new Scene(root, 300, 300);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

文件login.fxml ：

<?xml version="1.0" encoding="UTF-8"?>
<?language javascript?>

<?import java.net.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<GridPane xmlns:fx="http://javafx.com/fxml/1" alignment="center" hgap="10" vgap="10" styleClass="root">
    <fx:script source="login.js"/>
    <padding>
        <Insets top="25" right="25" bottom="10" left="25"/>
    </padding>
    <Text id="welcome-text" text="Welcome" GridPane.columnIndex="0" GridPane.rowIndex="0" GridPane.columnSpan="2"/>
    <Label text="User Name:" GridPane.columnIndex="0" GridPane.rowIndex="1"/>
    <TextField GridPane.columnIndex="1" GridPane.rowIndex="1"/>
    <Label text="Password:" GridPane.columnIndex="0" GridPane.rowIndex="2"/>
    <PasswordField id="passwordField" GridPane.columnIndex="1" GridPane.rowIndex="2"/>
    <HBox spacing="10" alignment="bottom_right" GridPane.columnIndex="1" GridPane.rowIndex="4">
        <Button text="Sign In" onAction="handleSubmitButtonAction(event);"/>
    </HBox>
    <Text fx:id="actiontarget" GridPane.columnIndex="1" GridPane.rowIndex="6"/>
    <stylesheets>
        <URL value="@login.css" />
    </stylesheets>
</GridPane>

請注意，當您使用JavaScript代碼的ID時，您僅需要fx：id，否則，您僅需要ID

文件login.js ：

function handleSubmitButtonAction() {
    actiontarget.setText("Calling the JavaScript");
}

文件login.css ：

.root {
    -fx-background-color: lightblue;
}
.label {
    -fx-font-size: 0.750em;
    -fx-font-weight: bold;
    -fx-font-text-fill: #333333;
}
.label, #actiontarget {
    -fx-effect: dropshadow(gaussian, rgba(255, 255, 255, 0.5), 0, 0, 0, 1);
}
#welcome-text {
    -fx-font-size: 2.0em;
    -fx-font-family: "Arial Black";
    -fx-fill: #818181;
    -fx-effect: innershadow(three-pass-box, rgba(0, 0, 0, 0.7), 6, 0.0, 0, 2);
}
#actiontarget {
    -fx-fill: firebrick;
    -fx-font-weight: bold;
}
.button {
    -fx-text-fill: white;
    -fx-font-family: "Arial Narrow";
    -fx-font-weight: bold;
    -fx-background-color: linear-gradient(#61a2b1, #2A5058);
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
    -fx-transition: all 2s linear;
}
.button:hover {
    -fx-background-color: linear-gradient(#2A5058, #61a2b1);
}

就這樣。