JavaFX: Text Area comes blurry from FXML File and not expanded

Question

I have two issues:

First issue is that the second panel, with a text area, comes in blurry upon instantiatation. Any ideas why?

Second issue: when I instantiate this object, it comes in where both panes are collapsed, even though I set one of them to be expanded. Any ideas why could this be the case?

Below is the FXML code:

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

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

<AnchorPane id="AnchorPane" fx:id="statePreview" cacheShape="false" centerShape="false" minWidth="0.0" prefHeight="350.0" prefWidth="400.0" scaleShape="false" style="-fx-background-color: whitesmoke; -fx-border-color: grey; -fx-border-width: 0.5;" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
    <Accordion cacheShape="false" centerShape="false" prefHeight="350.0" prefWidth="400.0" scaleShape="false" style="-fx-border-color: black; -fx-border-width: 0.5;" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="1.0" AnchorPane.rightAnchor="1.0" AnchorPane.topAnchor="0.0">
        <panes>
            <TitledPane fx:id="contentTP" alignment="CENTER" animated="false" centerShape="false" contentDisplay="CENTER" focusTraversable="false" maxHeight="350.0" maxWidth="400.0" prefHeight="350.0" prefWidth="400.0" scaleShape="false">
                <content>
                    <AnchorPane fx:id="contentAP" prefHeight="300.0" prefWidth="400.0">
                        <children>
                            <CheckBox fx:id="include" mnemonicParsing="false" prefWidth="60.0" text="Select" AnchorPane.leftAnchor="10.0" AnchorPane.topAnchor="-2.5" />
                            <BorderPane fx:id="borderPane" layoutX="8.5" layoutY="8.5" style="-fx-border-color: black; -fx-border-width: 0.15;" AnchorPane.bottomAnchor="10.0" AnchorPane.leftAnchor="10.0" AnchorPane.rightAnchor="10.0" AnchorPane.topAnchor="20.0" />
                            <Label fx:id="order" alignment="CENTER" contentDisplay="CENTER" layoutX="78.5" layoutY="279.5" prefHeight="17.0" prefWidth="205.0" AnchorPane.leftAnchor="80.0" AnchorPane.rightAnchor="120.0" AnchorPane.topAnchor="-2.5" />
                            <ToggleButton fx:id="publicPrivate" layoutX="293.5" layoutY="271.5" maxHeight="20.0" minHeight="20.0" mnemonicParsing="false" prefHeight="20.0" prefWidth="60.0" text="Public" AnchorPane.rightAnchor="35.0" AnchorPane.topAnchor="-5.0">
                                <font>
                                    <Font size="10.0" />
                                </font>
                            </ToggleButton>

                        </children>
                    </AnchorPane>
                </content>
                <graphic>
                    <Label contentDisplay="RIGHT" layoutX="23.0" layoutY="8.0" prefHeight="17.0" text="Text-Block #">
                        <graphic>
                            <Label fx:id="stateNumber" contentDisplay="RIGHT" layoutX="200.0" layoutY="7.5" prefHeight="20.0" text="000" AnchorPane.topAnchor="10.0">
                                <opaqueInsets>
                                    <Insets left="500.0" />
                                </opaqueInsets>
                                <graphic>
                                    <Label alignment="BASELINE_RIGHT" text="Content" />
                                </graphic>
                            </Label>
                        </graphic>
                    </Label>
                </graphic>
            </TitledPane>
            <TitledPane fx:id="commentTP" alignment="CENTER" animated="false" cacheShape="false" centerShape="false" contentDisplay="CENTER" maxHeight="350.0" maxWidth="400.0" prefHeight="350.0" prefWidth="400.0" scaleShape="false" text="User Comments">
                <content>
                    <AnchorPane fx:id="commentAP" minHeight="0.0" minWidth="0.0" prefHeight="300.0" prefWidth="300.0">
                        <children>
                            <TextArea fx:id="commentArea" layoutX="14.0" layoutY="14.0"     prefHeight="274.0" prefWidth="382.0" promptText="Enter comments about this Text-Block" wrapText="true" AnchorPane.bottomAnchor="10.0" AnchorPane.leftAnchor="10.0" AnchorPane.rightAnchor="10.0" AnchorPane.topAnchor="10.0" />
                        </children>
                    </AnchorPane>
                </content>
            </TitledPane>
        </panes>
    </Accordion>

</children>
<padding>
    <Insets bottom="-2.0" left="-2.0" right="-2.0" top="-2.0" />
</padding>
</AnchorPane>

score 0 · Accepted Answer · answered May 30 '14 at 21:07

0

I had a similar issue with the blurry text. Using JavaFX Scene Builder, I noticed that under Layout: Position, I had Layout X / Y a non zero value (like 9.893739 etc). when I replaced those with 0, the blurry text went away.

answered May 30 '14 at 21:07

RobinFago

189
2
6

1

Thanks . i tried that but i still get a blurry by text area :( – melkhaldi Jun 02 '14 at 00:27
6

Another thing to test out: try removing any anchor pane constraints. I've found weird calculations being done that is causing the width/length to be weird fractions and causing blurriness. – RobinFago Jun 02 '14 at 16:01
I had put a bounty on this a long time ago. why don't you answer it to get the bounty? here is the link http://stackoverflow.com/questions/22119479/adding-anchorpanes-to-scrollpanes-javafx-8 – melkhaldi Jun 08 '14 at 01:59

JavaFX: Text Area comes blurry from FXML File and not expanded

1 Answers1