在JavaFX中，是否可以在同一文本行中使用两种不同的字体大小？

Question

我正在使用Java制作Windows-run-mobile-concept股市游戏，它是JavaFX库，我想在玩家当前余额的右下角使用货币形式（以我的情况为USD） 。要注意的是，每当玩家在游戏中获得千美元的倍数时，玩家的余额就会变大，这意味着持有玩家余额的字符串也会变大。这导致字符串“ USD”在应用程序中的固定位置被玩家的当前余额覆盖。

我已经尝试过简单地强迫程序在数字增加千倍时移动“ USD”符号。但是，这似乎效率很低，我敢打赌，有一种更简单的方法可以做到这一点。

    double balance = 12313.00;

    DecimalFormat decimalFormat = new DecimalFormat("#,###");
    String numberAsString = decimalFormat.format(balance);

    Text balanceText = new Text("$" + (numberAsString));
    balanceText.setFont(Font.font("Modernist", 72));
    balanceText.setFill(Color.web("77e6b3"));
    balanceText.setLayoutX(25);
    balanceText.setLayoutY(250);

    Text currencyText = new Text("USD");
    currencyText.setFont(Font.font("Modernist", 36));
    currencyText.setFill(Color.web("77e6b3"));
    currencyText.setLayoutX(275);
    currencyText.setLayoutY(250);

Answer 1

与其尝试手动设置Text节点的X / Y坐标，不如利用许多内置的JavaFX Layout Panes。

您可以通过在JavaFX中混合不同的布局窗格来轻松构建非常复杂的UI布局。每个应用程序Pane都可以彼此独立地设置样式和配置，并对其应用不同的布局“规则”。

我建议您仔细阅读上面的链接，以更好地了解可用的内容，但是对于您的问题，我在下面提供了一个完整的示例。

基本上，我们使用HBox来将玩家的余额和货币名称保持在水平方向。由于我们Label对玩家的币种使用了完全独立的货币，因此当我们增加该币种的值或字体大小时，Label界面的其余部分将不会受到影响（这意味着货币类型可以保持相同的大小）。

import javafx.application.Application;
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.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class GrowingTextSample extends Application {

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

    @Override
    public void start(Stage primaryStage) {

        // Simple Interface
        VBox root = new VBox(10);
        root.setAlignment(Pos.CENTER);
        root.setPadding(new Insets(10));

        // Here we'll create a simple HBox to hold our player balance and currency type. By using a HBox, we can add
        // multiple Label (or Text) objects and style/size them separately
        HBox hbPlayerBalance = new HBox(5);
        hbPlayerBalance.setAlignment(Pos.CENTER);

        // Let's create a Label to hold the player's current balance. For this example, I'm going to use a text Label
        // to hold our Integer value. In a real application, you would want to use a special Binding to keep the TextProperty
        // of the Label in sync with an Integer or Double value.
        Label lblPlayerBalance = new Label("0");

        // Here is our label for the currency type
        Label lblCurrency = new Label("USD");

        // Add our labels to the HBox
        hbPlayerBalance.getChildren().addAll(lblPlayerBalance, lblCurrency);

        // Create a Button that simulates an increase to the player's balance. Again, this is just a crude demonstration
        // of how the layout panes (HBox, in this case) work to keep your layout clean and responsive.
        Button btnIncreaseBalance = new Button("Get Rich");

        // Add an action to our Button
        btnIncreaseBalance.setOnAction(event -> {

            // Change balance value
            lblPlayerBalance.setText("12,322,242");

            // Change balance font size. Notice changing the font size of the balance does not affect the currency Label
            lblPlayerBalance.setStyle("-fx-font-size: 200%;");

        });

        // Add the HBox and Button to our root layout
        root.getChildren().addAll(hbPlayerBalance, btnIncreaseBalance);

        // Show the stage
        primaryStage.setScene(new Scene(root));
        primaryStage.setHeight(200);
        primaryStage.setWidth(300);
        primaryStage.setTitle("GrowingTextSample Sample");
        primaryStage.show();

    }
}

结果：

注意：还有许多其他格式和样式选项可用来确保您的布局完全符合您的期望。您需要通读JavaDocs或查找其他教程以了解更多信息。该答案仅用于说明许多可能的解决方案之一。