JavaFx: jfxTextField with icons - javafx

Question

Hi I'm not able to add an icon to my jfxtextfield and found nothing about
could anyone help?
fxml:
<VBox fx:id="root" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="300.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1">
<children>
<HBox fx:id="boxLogo" alignment="CENTER" prefHeight="100.0" prefWidth="300.0">
<children>
<FontAwesomeIconView glyphName="HOME" size="50">
<fill>
<LinearGradient endX="1.0" endY="1.0" startY="0.49047619047619045">
<stops>
<Stop color="#0d96ff" />
<Stop color="#010f1b" offset="1.0" />
</stops>
</LinearGradient>
</fill>
</FontAwesomeIconView>
</children>
</HBox>
<GridPane fx:id="boxField" alignment="CENTER" prefHeight="222.0" prefWidth="300.0">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints maxHeight="131.0" minHeight="10.0" prefHeight="108.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="142.0" minHeight="10.0" prefHeight="107.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="142.0" minHeight="10.0" prefHeight="107.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<JFXTextField fx:id="userTxt" alignment="CENTER" focusColor="#1cffb3" labelFloat="true" maxWidth="-Infinity" prefWidth="200.0" text="Digite o seu Login" unFocusColor="#00fffb" GridPane.halignment="CENTER" />
<JFXTextField alignment="CENTER" focusColor="#00ff77" maxWidth="-Infinity" prefWidth="200.0" text="Digite a sua senha" unFocusColor="#00fffb" GridPane.halignment="CENTER" GridPane.rowIndex="1" />
<JFXCheckBox text="Lembrar Usuario" GridPane.halignment="RIGHT" GridPane.rowIndex="2">
<GridPane.margin>
<Insets right="50.0" />
</GridPane.margin>
</JFXCheckBox>
</children>
</GridPane>
<HBox fx:id="boxButtons" alignment="TOP_CENTER" prefHeight="100.0" prefWidth="300.0" spacing="30.0">
<children>
<JFXButton buttonType="RAISED" prefHeight="25.0" prefWidth="86.0" ripplerFill="#09fff7" style="-fx-background-color: #0DA5E2;" text="Entrar" textFill="WHITE" textOverrun="CLIP">
<font>
<Font name="Arial" size="12.0" />
</font>
</JFXButton>
</children>
</HBox>
</children>
</VBox>
my controller:
public class MainController {
#FXML
private VBox root;
#FXML
private HBox boxLogo;
#FXML
private GridPane boxField;
#FXML
private HBox boxButtons;
#FXML
private JFXTextField userTxt;
public void initialize() {
FontAwesomeIconView icon = new FontAwesomeIconView(FontAwesomeIcon.USER);
}
}
I wanted to add the icon I created to my textfiedl userTxt
I don't know if this can be done by controller or just by css?
From what I found is through css, but I would need to add a folder with a photo to work I wanted to do that with an icon is possible?

Answer 1

I propose to add this in your controller :
myJFXTextField.setstyle("-fx-background
image:url('http://icons.iconarchive.com/icons/rockettheme/halloween/32/pumpkin-
icon.png');");
and this in your css
.text-field {
-fx-background-repeat: no-repeat;
-fx-background-position: right center;
-fx-font-size: 20;
}
You can use a path or URL