Могу ли я использовать только нижнюю границу для стиля JavaFX - PullRequest
Новая
       53

Могу ли я использовать только нижнюю границу для стиля JavaFX

2 голосов
/ 14 марта 2020

можно ли как-то только стилизовать нижнюю границу текстового поля? Я уже пробовал 

textfield.setStyle("-fx-border-bottom-color: #FF0000");

, но это не сработало. Есть ли возможность закрасить нижнюю границу ??

Привет MatsG23

Ответы [ 2 ]

1 голос
/ 14 марта 2020

Да, можно присвоить каждой стороне свой цвет. Из JavaFX CSS Справочного руководства , для Region:

  • CSS Свойство: -fx-border-color
  • Значения: <paint> | <paint> <paint> <paint> <paint> [ , [<paint> | <paint> <paint> <paint> <paint>] ]*
  • По умолчанию: null
  • Комментарии: Серия значений краски или наборы из четырех значений краски, разделенных запятыми. Для каждого элемента в серии, если указано одно значение краски, эта краска используется в качестве границы для всех сторон области; и если указан набор из четырех красок, они используются для верхней, правой, нижней и левой границ области в указанном порядке. Если граница не прямоугольная angular, используется только первое значение краски в наборе.

Примечание: Выше указано фактически из одной строки таблицы, но переполнение стека не дает возможности форматировать объекты в таблице.

То есть вы можете нацелить нижнюю границу только с помощью: 

.text-field {
  -fx-border-color: transparent transparent red transparent;
}

Свойство -fx-border-width CSS (и действительно все свойства CSS, относящиеся к свойствам Region#background и Region#border) ведут себя одинаково. Это означает, что вы можете выполнить sh то же самое, установив ширину каждой стороны, но снизу, до нуля, как в ответе mipa .

Вот пример с использованием inline CSS (т.е. setStyle): 

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.Region;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class App extends Application {

  @Override
  public void start(Stage primaryStage) {
    TextField field = new TextField("Hello, World!");
    field.setStyle("-fx-border-color: transparent transparent red transparent;");
    field.setMaxWidth(Region.USE_PREF_SIZE);
    primaryStage.setScene(new Scene(new StackPane(field), 300, 150));
    primaryStage.show();

    // Remove blue outline from when TextField is focused. This
    // makes it easier to see the red border.
    primaryStage.getScene().getRoot().requestFocus();
  }
}

, который дает следующий вывод:

screenshot of above code

Обратите внимание, что большинство «границы», добавленные modena.css (таблица стилей пользовательского агента по умолчанию в JavaFX 8+), на самом деле не являются границами. Вместо этого они представляют собой несколько фонов с разными вставками.

1 голос
/ 14 марта 2020

Вот быстрый и грязный пример того, как это можно сделать. 

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class TextFieldStyleTest extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane root = new BorderPane();

        VBox vBox = new VBox();
        vBox.setAlignment(Pos.CENTER);
        root.setCenter(vBox);

        HBox hBox = new HBox();
        hBox.setAlignment(Pos.CENTER);
        vBox.getChildren().add(hBox);

        TextField textField = new TextField("Hello World");
        textField.setAlignment(Pos.BASELINE_CENTER);
        hBox.getChildren().add(textField);

        textField.setStyle("-fx-border-color: red; -fx-border-width: 0 0 10 0;"); 


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

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

}

class TextFieldStyleTestLauncher {public static void main(String[] args) {TextFieldStyleTest.main(args);}}
...