FontAwesomeFX 8.14 released

I just released FontAwesomeFX 8.14 to Bintray.

This release contains some major fixes:

  • Fixed glyph size changing issue on mouse over
  • Fixed Issues #44 “CSS -glyph-size broken”
FontAwesomeFX 8.14
compile 'de.jensd:fontawesomefx-fontawesome:4.7.0-3'
compile 'de.jensd:fontawesomefx-icons525:3.0.0-2'
compile 'de.jensd:fontawesomefx-materialdesignfont:1.7.22-2'
compile 'de.jensd:fontawesomefx-materialicons:2.2.0-3'
compile 'de.jensd:fontawesomefx-octicons:4.3.0-3'
compile 'de.jensd:fontawesomefx-weathericons:2.0.10-3'
they are all depending on:
compile 'de.jensd:fontawesomefx-commons:8.14'
optional:
compile 'de.jensd:fontawesomefx-controls:8.14'

Also I updated the FontAwesomeFX GlyphsBrowser and the examples in respect to this release!

You can find the FontAwesomeFX bintray package here.

Source code available at Bitbucket

Please report issues here

Minor Update of FontAwesomeFX 8.13 packages

Updated font packs available!
Issues fixed when using dedicated fonts in JavaFX applications (thanks to Dirk Lemmermann (@dlemmermann) for reporting):

FontAwesomeFX 8.13
compile 'de.jensd:fontawesomefx-fontawesome:4.7.0-2'
compile 'de.jensd:fontawesomefx-icons525:3.0.0-1'
compile 'de.jensd:fontawesomefx-materialdesignfont:1.7.22-1'
compile 'de.jensd:fontawesomefx-materialicons:2.2.0-2'
compile 'de.jensd:fontawesomefx-octicons:4.3.0-2'
compile 'de.jensd:fontawesomefx-weathericons:2.0.10-2'

Some people also reported font loading issues with 32bit OpenJDK.
This might be related to this bug in FTFactory.java
http://mail.openjdk.java.net/pipermail/openjfx-dev/2016-March/018776.html
Many thanks to Andrea Vacondio (@Torakiki610) for investigation!

You can find the FontAwesomeFX bintray package here.

Source code available at Bitbucket

Please report issues here

FontAwesomeFX 8.13 released

Just released FontAwesomeFX 8.13 to Bintray.

Revisited and updated Icon Fonts:

Font Version What's new?
FontAwesome 4.7.0 7 new icons (many thanks to Steffen for his pull-request)
525Icons 3.0 Font updated on 30-10-2016
Material Design Font 1.7.22 73 new icons
FontAwesomeFX 8.13
compile 'de.jensd:fontawesomefx-fontawesome:4.7.0'
compile 'de.jensd:fontawesomefx-icons525:3.0.0'
compile 'de.jensd:fontawesomefx-materialdesignfont:1.7.22'
compile 'de.jensd:fontawesomefx-materialicons:2.2.0-1'
compile 'de.jensd:fontawesomefx-octicons:4.3.0-1'
compile 'de.jensd:fontawesomefx-weathericons:2.0.10-1'
they all depend on:
compile 'de.jensd:fontawesomefx-commons:8.13'
optional:
compile 'de.jensd:fontawesomefx-controls:8.13'
Demo apps
de.jensd.fx.glyphs.fontawesome.demo.FontAwesomeIconsDemoApp
de.jensd.fx.glyphs.materialdesignicons.demo.MaterialDesignIconsDemoApp
de.jensd.fx.glyphs.materialicons.demo.MaterialIconsDemoApp
de.jensd.fx.glyphs.octicons.demo.OctIconsDemoApp
de.jensd.fx.glyphs.weathericons.demo.WeatherIconsDemoApp
de.jensd.fx.glyphs.icons525.demo.Icons525DemoApp

You can find the FontAwesomeFX bintray package here.

Source code available at Bitbucket

Please report issues here

fafx813

FontAwesomeFX 8.12 is released!

Just released FontAwesomeFX 8.12 to Bintray.

Revisited and updated all Icon Fonts:

Font Version What's new?
FontAwesome 4.6.3 7 new icons
Material Icons 2.2.0 81 new icons
Material Design Font 1.6.50 193 new icons
Octicons 4.3.0 Icons refined (cleanup/22 icons removed)
525Icons 2.6.0 Font updated on 24-06-2016
FontAwesomeFX 8.12
compile 'de.jensd:fontawesomefx-fontawesome:4.6.3'
compile 'de.jensd:fontawesomefx-materialdesignfont:1.6.50'
compile 'de.jensd:fontawesomefx-materialicons:2.2.0'
compile 'de.jensd:fontawesomefx-octicons:4.3.0'
compile 'de.jensd:fontawesomefx-icons525:2.6.0'
compile 'de.jensd:fontawesomefx-weathericons:2.0-3'
They all depend on
compile 'de.jensd:fontawesomefx-commons:8.12'
Optional
compile 'de.jensd:fontawesomefx-controls:8.12'
Demo apps
de.jensd.fx.glyphs.fontawesome.demo.FontAwesomeIconsDemoApp
de.jensd.fx.glyphs.materialdesignicons.demo.MaterialDesignIconsDemoApp
de.jensd.fx.glyphs.materialicons.demo.MaterialIconsDemoApp
de.jensd.fx.glyphs.octicons.demo.OctIconsDemoApp
de.jensd.fx.glyphs.weathericons.demo.WeatherIconsDemoApp
de.jensd.fx.glyphs.icons525.demo.Icons525DemoApp

fafx812

Here you can find the FontAwesomeFX bintray package.

Source code available at Bitbucket

Please report issues here

FontAwesomeFX 8.11 is here!

Just uploaded FontAwesomeFX 8.11 to Bintray.

Now included:
FontAweseme 4.6.1 with 23 additional icons

and a new kid on the block:

525icons

525icons Font coming with (…surprise!) 525 icons on board.
Due to naming conventions and restrictions 525icons related stuff is called “icons525” in FontAwesomeFX, e.g. de.jensd.fx.glyphs.icons525.Icons525.

FontAwesomeFX 8.11

compile ‘de.jensd:fontawesomefx-fontawesome:4.6.1-2’
compile ‘de.jensd:fontawesomefx-materialdesignfont:1.4.57-2’
compile ‘de.jensd:fontawesomefx-materialicons:2.1-2’
compile ‘de.jensd:fontawesomefx-octicons:3.3.0-2’
compile ‘de.jensd:fontawesomefx-weathericons:2.0-2’
compile ‘de.jensd:fontawesomefx-icons525:2.0-2’

They all depend on

compile ‘de.jensd:fontawesomefx-commons:8.11’

Optional

compile ‘de.jensd:fontawesomefx-controls:8.11’

Demo apps

Did you know there is a little test app included in each font artifact?

de.jensd.fx.glyphs.fontawesome.demo.FontAwesomeIconsDemoApp
de.jensd.fx.glyphs.materialdesignicons.demo.MaterialDesignIconsDemoApp
de.jensd.fx.glyphs.materialicons.demo.MaterialIconsDemoApp
de.jensd.fx.glyphs.octicons.demo.OctIconsDemoApp
de.jensd.fx.glyphs.weathericons.demo.WeatherIconsDemoApp
de.jensd.fx.glyphs.icons525.demo.Icons525DemoApp

525icons2

Here you can find the bintray package.

Sources are here at Bitbucket

Report issues here

Button of Choice: Use ToggleButtons as RadioButtons

For MQTT.fx I wanted to use ToggleButtons to e.g. choose the de
coding of a MQTT Message or the QoS Level:

decode

qos

 

I found out that in context of a ToggleGroup ToggleButtons behave different than RadioButtons in terms of selection/deselection: unlike RadioButtons ToggleButtons can still be set to unselected state.

 

A RadioButton extends ToggleButton and overrides fire() (which is invoked when a user gesture indicates that an event for this ButtonBase should occur aka “Button was clicked”):
RadioButton:

@Override public void fire() {
  // we don't toggle from selected to not selected if part of a group
  if (getToggleGroup() == null || !isSelected()) {
    super.fire();
  }
}

ToggleButton:

@Override public void fire() {
  setSelected(!isSelected());
  fireEvent(new ActionEvent());
}

In a ToogleGroup ToggleButtons should behave like RadioButtons, so IMHO this is a bug worth a pull request for ToggleButton 😉

One way to handle this is for sure to create a custom extension of ToggleButton implementing fire() in respect to the RadioButton.
But I like more to add behavior to existing controls.
This is my tweak to modify default behavior by adding filters to all ToogleButtons of a ToggleGroup consuming unwanted MouseEvents:

public class JavaFXUtil {

    private static JavaFXUtil me;

    private JavaFXUtil() {
    }

    public static JavaFXUtil get() {
        if (me == null) {
            me = new JavaFXUtil();
        }
        return me;
    }

    public EventHandler<MouseEvent> consumeMouseEventfilter = (MouseEvent mouseEvent) -> {
        if (((Toggle) mouseEvent.getSource()).isSelected()) {
            mouseEvent.consume();
        }
    };

    public void addAlwaysOneSelectedSupport(final ToggleGroup toggleGroup) {
        toggleGroup.getToggles().addListener((Change<? extends Toggle> c) -> {
            while (c.next()) {
                for (final Toggle addedToggle : c.getAddedSubList()) {
                    addConsumeMouseEventfilter(addedToggle);
                }
            }
        });
        toggleGroup.getToggles().forEach(t -> {
            addConsumeMouseEventfilter(t);
        });
    }

    private void addConsumeMouseEventfilter(Toggle toggle) {
        ((ToggleButton) toggle).addEventFilter(MouseEvent.MOUSE_PRESSED, consumeMouseEventfilter);
        ((ToggleButton) toggle).addEventFilter(MouseEvent.MOUSE_RELEASED, consumeMouseEventfilter);
        ((ToggleButton) toggle).addEventFilter(MouseEvent.MOUSE_CLICKED, consumeMouseEventfilter);
    }

}
public class ButtonDemoController {
    @FXML
    private ToggleGroup g2;

    @FXML
    private ToggleGroup g3;

    public void initialize() {
        JavaFXUtil.get().addAlwaysOneSelectedSupport(g2);
        JavaFXUtil.get().addAlwaysOneSelectedSupport(g3);
    }

}

buttonofchoice

Example code at GitHub.

FontAwesomeFX 8.10: The artefacts act

Recently I created a demo an wanted to use just one FontAwesome icon and I notices that I need to add the whole ~600KB package for that. Clearly the package size is driven by the all the contained True Type Font files:

de.jensd:fontawesomefx-fontawesomefx:8.9 571 KB

So I thought about split the full package into separated artifacts per icon font: smaller footprint and easier to update (also the package versioning reflects the icon font version)

Coming with FontAwesomeFX 8.10

de.jensd:fontawesomefx-fontawesome:4.5.0 115.7 KB
de.jensd:fontawesomefx-materialdesignfont:1.4.57 246.4 KB
de.jensd:fontawesomefx-materialicons:2.1 92.2 KB
de.jensd:fontawesomefx-octicons:3.3.0 29.9 KB
de.jensd:fontawesomefx-weathericons:2.0 2.0 KB

PLUS:

de.jensd:fontawesomefx-common:8.10 13.4 KB

and optional:

de.jensd:fontawesomefx-controls:8.10 3.4 KB

Usage

E.g. to use WeatherIcons in your app you just have to add

repositories {
 jcenter()
}

dependencies {
 compile 'de.jensd:fontawesomefx-weathericons:2.0'
}

to your build.gradle and you are done with 16KB (font-pack + common) additional footprint.

wathericonsdemo

You can run contained demo by calling: de.jensd.fx.glyphs.weathericons.demo.WeatherIconsDemoApp

Please give it a try and feed me back if it works!

Next steps are:

  • rename it from FontAwesomeFX to e.g. IconsFX (in respect to the other supportet icon fonts) and
  • focus on Java9 and JigSaw….

Here you can find the new bintray package.

Sources are here at Bitbucket

Report issues here

Ordering via SortedList (and Properties Extractor)

Quite a while ago (almost 1,5 years 😱) I wrote a post about the JavaFX way to get ListViews and TableViews instantly updated on model data change: using Properties Extractor pattern.

TableColumns have a build-in support for sorting the data per column: just double-click the column header (. But how to order ListViews or get the table content get ordered by certain predicate instantly on data changes?

To sort elements the ObervableList has a sort(Comparator<? super E> c) method to sort the list according to the order induced by the specified Comparator (each time it is called).
Note: If the specified comparator is null then all elements in this list must implement the Comparable interface and the elements’ natural ordering should be used.

I have extended the demo app in terms of sorting:
GET THE APP HERE.
GET THE CODE HERE.
extractor_demo_main

SortedList and FilteredList

SortedList and FilteredList are very interesting and useful wrapper for OberservableLists to keep the content sorted and/or filtered (will add filtering soon).

SortedList: Wraps an ObservableList and sorts it’s content. All changes in the ObservableList are propagated immediately to the SortedList.

FilteredList: Wraps an ObservableList and filters it’s content using the provided Predicate. All changes in the ObservableList are propagated immediately to the FilteredList.

You can create a SortedList by creating it “manually”:

personSortedList = new SortedList(model.getPersonFXBeans());

or let the ObservableList do it for you:

personSortedList = model.getPersonFXBeans().sorted();

“Readonly TableView” and “ListView” are sharing the same SortedList wrapper:

readOnlyListView.setItems(personSortedList);
readOnlyTableView.setItems(personSortedList);

Sorting

extractor_demo_comparators

The “Sorting” ComboBox contains the available comparators for the SortedList:

personComparators = FXCollections.observableArrayList(new FirstNameComparator(),
                new LastNameComparator(),
                new DateOfBirthComparator(),
                new AgeComparator(),
                new DaysToNextBirthdayComparator(),
                new NextBirthdayComparator()
);
personOrderByComboBox.setItems(personComparators);
@FXML
public void onSortByComparator() {
  personSortedList.setComparator(personOrderByComboBox.getSelectionModel().getSelectedItem());
}

Also there is a toggle for the sort direction:

@FXML
public void onChangeSortDirection() {
  personSortedList.setComparator(personSortedList.getComparator().reversed());
}

The “Editable TableView” is still “self-sufficient” in terms of sorting.

All three views are sharing the same data model (model.getPersonFXBeans()) and editing the content is instantly notified by them (via property extractor).

If you play with the app by changing the data: note also the sorting take effect. 

One more thing

If you bind the comparatorProperty() of SortedList to the TableView, the sorting the content is triggered by the build-in ordering options ig TableView (via column header):

personSortedList.comparatorProperty().bind(editableTableView.comparatorProperty());

Note that other ways to trigger the SortedList e.g. by setCompartor() will fail then with exception as comparatorProperty is already bound.

MQTT driven NeoPixels

Here are some clips I recorded during last weeks when playing with NeoPixels driven by MQTT messages:

Many thanks to Gerrit Grunwald for sharing his ColorSelector control I used in this demo:

 

FontAwesomeFX 8.9 released

UPDATE: Google Material Icons v2.1

Coming with 96 additional icons.
Now 891 Icons included.

UPDATE: Material Design Icons v1.4.57

With 287 additional icons:
Contains now 1457 Icons!

AH! And I created a dedicated Twitter account: @FontAwesomeFX!

tmp

Get FontAwesomeFX 8.9

Download Binaries: Download
Sources available at Bitbucket

Maven:

<dependency>
  <groupId>de.jensd</groupId>
  <artifactId>fontawesomefx</artifactId>
  <version>8.9</version>
</dependency>

Please report issues here