CSS Error parsing file JavaFX but i have no clue what it wrong

Question

From my program i receive this error: Eclipse console output

All i am trying to do is use the hover effect on buttons to turn the text white. Here is my code: Main.java:

import java.util.Date;

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.EventHandler;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.control.TableView;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.Pane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class Main extends Application {


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

@Override
public void start(Stage primaryStage) throws Exception {
    Pane mainPane = (Pane) FXMLLoader.load(Main.class.getResource("Main.fxml"));
    primaryStage.setScene(new Scene(mainPane));
    primaryStage.show();
    }

}

Here is my Main.fxml file:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.image.*?>
<?import javafx.scene.shape.*?>
<?import javafx.scene.effect.*?>
<?import javafx.scene.text.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>

<Pane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="318.0" prefWidth="1000.0" stylesheets="@myStyle.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="MyController">
   <children>
      <TextField fx:id="tf_input" alignment="BOTTOM_RIGHT" editable="true" layoutX="450.0" layoutY="22.0" prefHeight="35.0" prefWidth="300.0" styleClass="display">
         <font>
            <Font name="Lucida Console" size="20.0" />
         </font>
         <effect>
            <DropShadow />
         </effect>
      </TextField>
      <Button fx:id="bOne" layoutX="472.0" layoutY="102.0" mnemonicParsing="false" onAction="#click1" prefHeight="35.0" prefWidth="64.0" text="1" />
      <Button fx:id="bTwo" layoutX="536.0" layoutY="102.0" mnemonicParsing="false" onAction="#click2" prefHeight="35.0" prefWidth="64.0" text="2" />
      <Button fx:id="bThree" layoutX="600.0" layoutY="102.0" mnemonicParsing="false" onAction="#click3" prefHeight="35.0" prefWidth="64.0" text="3" />
      <Button fx:id="bSix" layoutX="600.0" layoutY="137.0" mnemonicParsing="false" onAction="#click6" prefHeight="35.0" prefWidth="64.0" text="6" />
      <Button fx:id="bFive" layoutX="536.0" layoutY="137.0" mnemonicParsing="false" onAction="#click5" prefHeight="35.0" prefWidth="64.0" text="5" />
      <Button fx:id="bFour" layoutX="472.0" layoutY="137.0" mnemonicParsing="false" onAction="#click4" prefHeight="35.0" prefWidth="64.0" text="4" />
      <Button fx:id="bNine" layoutX="600.0" layoutY="172.0" mnemonicParsing="false" onAction="#click9" prefHeight="35.0" prefWidth="64.0" text="9" />
      <Button fx:id="bEight" layoutX="536.0" layoutY="172.0" mnemonicParsing="false" onAction="#click8" prefHeight="35.0" prefWidth="64.0" text="8" />
      <Button fx:id="bSeven" layoutX="472.0" layoutY="172.0" mnemonicParsing="false" onAction="#click7" prefHeight="35.0" prefWidth="64.0" text="7" />
      <Button fx:id="bB" layoutX="536.0" layoutY="207.0" mnemonicParsing="false" onAction="#clickB" prefHeight="35.0" prefWidth="64.0" text="B" />
      <Button fx:id="bA" layoutX="472.0" layoutY="207.0" mnemonicParsing="false" onAction="#clickA" prefHeight="35.0" prefWidth="64.0" text="A" />
      <Button fx:id="bZero" layoutX="472.0" layoutY="68.0" mnemonicParsing="false" onAction="#click0" prefHeight="35.0" prefWidth="64.0" text="0" />
      <Button fx:id="bE" layoutX="536.0" layoutY="242.0" mnemonicParsing="false" onAction="#clickE" prefHeight="35.0" prefWidth="64.0" text="E" />
      <Button fx:id="bD" layoutX="472.0" layoutY="242.0" mnemonicParsing="false" onAction="#clickD" prefHeight="35.0" prefWidth="64.0" text="D" />
      <Button fx:id="bC" layoutX="600.0" layoutY="207.0" mnemonicParsing="false" onAction="#clickC" prefHeight="35.0" prefWidth="64.0" text="C" />
      <Button fx:id="bF" layoutX="600.0" layoutY="242.0" mnemonicParsing="false" onAction="#clickF" prefHeight="35.0" prefWidth="64.0" text="F" />
      <Button fx:id="bPlus" layoutX="664.0" layoutY="102.0" mnemonicParsing="false" onAction="#clickplus" prefHeight="35.0" prefWidth="64.0" text="+" />
      <Button fx:id="bMinus" layoutX="664.0" layoutY="137.0" mnemonicParsing="false" onAction="#clickminus" prefHeight="35.0" prefWidth="64.0" text="-" />
      <Button fx:id="bDivide" layoutX="664.0" layoutY="207.0" mnemonicParsing="false" onAction="#clickdivide" prefHeight="35.0" prefWidth="64.0" text="/" />
      <Button fx:id="bTimes" layoutX="664.0" layoutY="172.0" mnemonicParsing="false" onAction="#clicktimes" prefHeight="35.0" prefWidth="64.0" text="*" />
      <Button fx:id="bEquals" layoutX="664.0" layoutY="242.0" mnemonicParsing="false" onAction="#clickequals" prefHeight="35.0" prefWidth="64.0" text="=" />
      <Label alignment="CENTER" layoutX="798.0" layoutY="21.0" prefHeight="23.0" prefWidth="161.0" styleClass="display" text="Output:">
         <font>
            <Font name="Lucida Console" size="20.0" />
         </font>
      </Label>
          <TextField fx:id="tf_output" alignment="BOTTOM_RIGHT" editable="false" layoutX="769.0" layoutY="68.0" prefHeight="153.0" prefWidth="219.0" styleClass="display">
         <font>
            <Font name="Lucida Console" size="20.0" />
         </font>
         <effect>
            <InnerShadow />
         </effect>
      </TextField>
      <Button fx:id="bAc" layoutX="600.0" layoutY="68.0" mnemonicParsing="false" onAction="#clickclear" prefHeight="35.0" prefWidth="64.0" text="AC" />
      <Button fx:id="bDel" layoutX="536.0" layoutY="68.0" mnemonicParsing="false" onAction="#clickdel" prefHeight="35.0" prefWidth="64.0" text="DEL" />
      <Button fx:id="bSquare" layoutX="664.0" layoutY="68.0" mnemonicParsing="false" onAction="#clicksquare" prefHeight="35.0" prefWidth="64.0" text="^2" />
      <RadioButton fx:id="Insixteen" layoutX="50.0" layoutY="121.0" mnemonicParsing="false" onAction="#clickin16" selected="true" text="Base 16 (Hex)" />
      <RadioButton fx:id="Inten" layoutX="50.0" layoutY="87.0" mnemonicParsing="false" onAction="#clickin10" text="Base 10 (Denary)" />
      <RadioButton fx:id="Intwo" layoutX="50.0" layoutY="53.0" mnemonicParsing="false" onAction="#clickin2" text="Base 2 (Binary)" />
      <Label alignment="BOTTOM_RIGHT" layoutX="50.0" layoutY="22.0" prefHeight="21.0" prefWidth="136.0" text="Base Input:" underline="true">
         <font>
            <Font name="Lucida Console" size="20.0" />
         </font>
      </Label>
      <Label alignment="BOTTOM_RIGHT" layoutX="234.0" layoutY="22.0" prefHeight="21.0" prefWidth="147.0" text="Base Output:" underline="true">
         <font>
            <Font name="Lucida Console" size="20.0" />
         </font>
      </Label>
      <RadioButton fx:id="Outtwo" layoutX="234.0" layoutY="53.0" mnemonicParsing="false" onAction="#clickout2" text="Base 2 (Binary)" />
      <RadioButton fx:id="Outten" layoutX="234.0" layoutY="87.0" mnemonicParsing="false" onAction="#clickout10" selected="true" text="Base 10 (Denary)" />
      <RadioButton fx:id="Outsixteen" layoutX="234.0" layoutY="121.0" mnemonicParsing="false" onAction="#clickout16" text="Base 16 (Hex)" />
   </children>
</Pane>

Here is MyController.java:

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Button;
import javafx.scene.control.RadioButton;
import javafx.scene.control.TextField;

public class MyController {

@FXML
private RadioButton Inten;

@FXML
private Button bMinus;

@FXML
private Button bTimes;

@FXML
private Button bOne;

@FXML
private Button bSix;

@FXML
private Button bDivide;

@FXML
private Button bEquals;

@FXML
private TextField tf_output;

@FXML
private Button bThree;

@FXML
private Button bPlus;

@FXML
private RadioButton Outten;

@FXML
private Button bA;

@FXML
private RadioButton Intwo;

@FXML
private Button bB;

@FXML
private Button bC;

@FXML
private Button bD;

@FXML
private Button bE;

@FXML
private Button bF;

@FXML
private Button bDel;

@FXML
private Button bZero;

@FXML
private Button bAc;

@FXML
private TextField tf_input;

@FXML
private Button bTwo;

@FXML
private RadioButton Outtwo;

@FXML
private Button bSquare;

@FXML
private RadioButton Outsixteen;

@FXML
private Button bFour;

@FXML
private Button bFive;

@FXML
private Button bEight;

@FXML
private Button bSeven;

@FXML
private RadioButton Insixteen;

@FXML
private Button bNine;

@FXML
void click1(ActionEvent event) {

}

@FXML
void click2(ActionEvent event) {

}

@FXML
void click3(ActionEvent event) {

}

@FXML
void click6(ActionEvent event) {

}

@FXML
void click5(ActionEvent event) {

}

@FXML
void click4(ActionEvent event) {

}

@FXML
void click9(ActionEvent event) {

}

@FXML
void click8(ActionEvent event) {

}

@FXML
void click7(ActionEvent event) {

}

@FXML
void clickB(ActionEvent event) {

}

@FXML
void clickA(ActionEvent event) {

}

@FXML
void click0(ActionEvent event) {

}

@FXML
void clickE(ActionEvent event) {

}

@FXML
void clickD(ActionEvent event) {

}

@FXML
void clickC(ActionEvent event) {

}

@FXML
void clickF(ActionEvent event) {

}

@FXML
void clickplus(ActionEvent event) {

}

@FXML
void clickminus(ActionEvent event) {

}

@FXML
void clickdivide(ActionEvent event) {

}

@FXML
void clicktimes(ActionEvent event) {

}

@FXML
void clickequals(ActionEvent event) {

}

@FXML
void clickclear(ActionEvent event) {

}

@FXML
void clickdel(ActionEvent event) {

}

@FXML
void clicksquare(ActionEvent event) {

}

@FXML
void clickin16(ActionEvent event) {

}

@FXML
void clickin10(ActionEvent event) {

}

@FXML
void clickin2(ActionEvent event) {

}

@FXML
void clickout2(ActionEvent event) {

}

@FXML
void clickout10(ActionEvent event) {

}

@FXML
void clickout16(ActionEvent event) {

}

}

Finally here is my myStyle.css file:

@charset "ISO-8859-1";
.button:hover{
    -fx-text-fill: #fffff;
}

I have only had a month to program so far so please don't flame my code or my easy slip ups. All thanks in advance for helping to solve the problem, i have been using scene builder and css style sheets for less than a day but i need to make progress fast as i have not been programming like the rest of my year have for almost 5 years.

Depends on your project structure. Try put your css file under your src directory. You also have to add the stylesheet. https://stackoverflow.com/questions/13946372/adding-css-file-to-stylesheets-in-javafx — Miles, Oct 25 '17 at 12:14
@Miles This is clearly not the problem. If the stylesheet were not added, or if it were in the wrong place, there is no way you would get a parse error from the stylesheet (since the parser can't produce an error from a file it can't find, or isn't looking for). — James_D, Oct 25 '17 at 12:53

score 0 · Accepted Answer · answered Oct 25 '17 at 12:51

JavaFX CSS does not support the full CSS specification; only a subset of it. In particular, the only "@-Rules" listed as supported are @import and @font-face. Consequently, the @charset rule you have on the first line is not supported.

Removing the first line of the CSS file (containing @charset) will enable the CSS file to be parsed.

Also, you stated you want the text to turn white on hover: you need #ffffff (six 'f's); you have #fffff (only five 'f's).

CSS Error parsing file JavaFX but i have no clue what it wrong

1 Answers1