Collapsing and disappearing icons

[Craig Cavanaugh]

I'm running into issues where glyphs will be visible, but depending on enabled or focused state, they are disappearing or truncating. Truncating depends on the glyph used. TRASH_ALT will truncate (button gets shorter) and TRASH will just disappear.

Screen shots are attached and the section of the FXML file is below.

I suspect its caused by inheriting Text instead of Label. Without use of Label, it's not impossible to enforce a minimum width.

This occurs under 8u45 and 8u60ea

<center>
        <VBox>
            <children>
                <StackPane fx:id="registerTablePane" VBox.vgrow="ALWAYS"/>
                <ToolBar VBox.vgrow="NEVER">
                    <items>
                        <Button fx:id="newButton" mnemonicParsing="false" text="%Button.New">
                            <graphic>
                                <FontAwesomeIconView glyphName="MONEY"/>
                            </graphic>
                        </Button>
                        <Button fx:id="duplicateButton" mnemonicParsing="false" onAction="#handleDuplicateAction" text="%Button.Duplicate">
                            <graphic>
                                <FontAwesomeIconView glyphName="COPY"/>
                            </graphic>
                        </Button>
                        <Button fx:id="deleteButton" mnemonicParsing="false" onAction="#handleDeleteAction" text="%Button.Delete">
                            <graphic>
                                <FontAwesomeIconView glyphName="TRASH"/>
                            </graphic>
                        </Button>
                        <Button mnemonicParsing="false" onAction="#handleSecuritiesAction" text="%Button.AvailSecurities">
                            <graphic>
                                <FontAwesomeIconView glyphName="LIST"/>
                            </graphic>
                        </Button>
                    </items>
                </ToolBar>
            </children>
        </VBox>
    </center>

[Jens Deters]

Ok, thanks Craig! Will have a look and consider to return to Label.

[Craig Cavanaugh]

I've also created an implementation based on caching an Image. If you are interested, I have no issue change the license to contribute the code.

I had played with the ControlsFX version and ran into weird sizing issues.

https://github.com/ccavanaugh/jgnash/blob/master/jgnash-fx/src/main/java/jgnash/resource/font/FontAwesomeImageView.java

Thanks, Craig

[Rene Gielen]

I seem to have the same a related issue, and I found something interesting I guess.

When using the following code to add an icon to a HBox in my app, the first icon would disappear on click while the second one would behave nicely

        pane.getChildren().add(GlyphsBuilder.create(FontAwesomeIconView.class).glyph(FontAwesomeIcon.BITBUCKET).build());
        pane.getChildren().add(GlyphsDude.createIcon(FontAwesomeIcon.BITBUCKET));

As it turned out, the main difference between the full GlyphIcon built by GlyphsBuilder and the styled Text element built by GlyphsDude is the .root style class that gets added to GlyphIcon, but not to the GlyphsDude Text element.

Looking into my main css file, I had only one style element in my root class

.root{
    -fx-font-size: 1.0em;
}

Out of curiosity, I removed the style and checked again:

.root{
    /*
    -fx-font-size: 1.0em;
    */
}

After that change, both icons would behave perfectly nice, no more symbol vanishing when being clicked.

I am not sure if this is a desired effect that I am too dumb to understand, or if it's a weird bug in CSS resolution. Nevertheless, this might help to track down the issue and maybe find general workarounds besides moving to Label again.

[timo reichen]

Same issue here. See also ticket #21, using -fx-font-family will show rectangles instead the icons. Hope that helps to solve it.