Overview
In this tutorial, we show you how to remove the borders from TextField in JavaFX.
Remove the borders from TextField using JavaFX Scene Builder 2.0
If you are using
JavaFX Scene Builder 2.0, go to the Style of the TextField in the Properties section of the Inspector panel.
Add Css Style:
-fx-background-color: -fx-control-inner-background;
Remove the borders from TextField by edit *.fxml file
Edit Example.fxml file, then Add CSS Style
style="-fx-background-color: -fx-control-inner-background;" to TextField tag.
<TextField layoutX="200.0" layoutY="100.0" prefHeight="50.0" prefWidth="200.0" promptText="Email" style="-fx-background-color: -fx-control-inner-background;" />
Remove the borders from TextField using javafx.scene.control.TextField.setStyle
Using method
javafx.scene.control.TextField.setStyle
package com.jackrutorial;
import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.TextField;
public class ExampleController implements Initializable {
@FXML
private TextField txtEmail;
/**
* Initializes the controller class.
*/
@Override
public void initialize(URL url, ResourceBundle rb) {
txtEmail.setStyle("-fx-background-color: -fx-control-inner-background;");
}
}
Before Remove The Borders From Email TextField
 |
| Demo Before Remove The Borders From Email TextField |
After Remove The Borders From Email TextField
 |
| Demo After Remove The Borders From Email TextField |
|
Full Source Code
ExampleController.java
package com.jackrutorial;
import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.TextField;
public class ExampleController implements Initializable {
@FXML
private TextField txtEmail;
/**
* Initializes the controller class.
*/
@Override
public void initialize(URL url, ResourceBundle rb) {
txtEmail.setStyle("-fx-background-color: -fx-control-inner-background;");
}
}
Example.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.image.*?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<AnchorPane id="AnchorPane" fx:id="main" prefHeight="400.0" prefWidth="600.0" style="-fx-background-color: #fff;" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.jackrutorial.ExampleController">
<children>
<TextField fx:id="txtEmail" layoutX="200.0" layoutY="100.0" prefHeight="50.0" prefWidth="200.0" promptText="Email" />
<TextField layoutX="200.0" layoutY="160.0" prefHeight="50.0" prefWidth="200.0" promptText="Password" />
<Button layoutX="200.0" layoutY="234.0" mnemonicParsing="false" prefHeight="50.0" prefWidth="200.0" text="Login" />
</children>
</AnchorPane>
