使用JavaFx的Textfield CSS样式 [英] Textfield CSS styling using JavaFx

问题描述

我正在尝试使用JavaFX设置一些文本字段，但我没有得到理想的结果。我的目标是让文本字段用单个下划线表示。这是我的CSS：

I'm trying to style some textfields using JavaFX, but I'm not getting desired results. My goal is to have the textfield be represented by a singular underline. Here's my CSS:

.text-field{
   -fx-font-family: "Quicksand";
   -fx-font-size: 18;
   -fx-padding: 1,1,1,1;
   -fx-border-color: grey;
   -fx-border-width: 2;
   -fx-border-radius: 1;
   -fx-border: gone;
   -fx-background-color: transparent;
   -fx-text-fill: grey;
}

我已经研究过这个问题，但我找到类似问题的答案确实包含足够的信息来重现并适用于我的程序。我对CSS样式知之甚少并没有帮助。我试图使用具有最小结果的插图。感谢您提供的任何答案！

I have researched this question, but the answers I find to similar ones don't really contain enough information to reproduce and apply properly to my program. It doesn't help that I'm not very knowledgeable about CSS styling. I've tried to use insets with minimal results. Thank you for any answers provided!

推荐答案

以下适用于我：

/* File style.css */

.text-field {
    -fx-background-color: -fx-text-box-border, -fx-background ;
    -fx-background-insets: 0, 0 0 1 0 ;
    -fx-background-radius: 0 ;
}
.text-field:focused {
    -fx-background-color: -fx-focus-color, -fx-background ;
}

以下测试工具

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

public class TextFieldStyleTest extends Application {

    @Override
    public void start(Stage primaryStage) {
        GridPane root = new GridPane();
        root.setHgap(10);
        root.setVgap(5);
        for (int row = 0 ; row < 4; row++) {
            for (int col = 0 ; col < 2; col++) {
                root.add(new TextField(), col, row);
            }
        }
        root.setPadding(new Insets(5));
        Scene scene = new Scene(root);
        scene.getStylesheets().add("style.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

产生

这篇关于使用JavaFx的Textfield CSS样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！