:recycle: Fix/enhancement for Issue #71

demo/src/main/java/io/github/palexdev/materialfx/demo/TestDemo.java

@@ -18,29 +18,23 @@
 
 package io.github.palexdev.materialfx.demo;
 
-import io.github.palexdev.materialfx.beans.NumberRange;
-import io.github.palexdev.materialfx.beans.properties.ResettableDoubleProperty;
 import io.github.palexdev.materialfx.controls.MFXButton;
 import io.github.palexdev.materialfx.controls.MFXIconWrapper;
-import io.github.palexdev.materialfx.controls.MFXSlider;
+import io.github.palexdev.materialfx.controls.MFXRectangleToggleNode;
 import io.github.palexdev.materialfx.controls.MFXTableView;
 import io.github.palexdev.materialfx.controls.cell.MFXTableColumn;
 import io.github.palexdev.materialfx.controls.cell.MFXTableRowCell;
-import io.github.palexdev.materialfx.controls.enums.SliderEnums.SliderPopupSide;
 import io.github.palexdev.materialfx.demo.model.FilterablePerson;
 import io.github.palexdev.materialfx.font.FontResources;
 import io.github.palexdev.materialfx.font.MFXFontIcon;
 import io.github.palexdev.materialfx.utils.ColorUtils;
-import io.github.palexdev.materialfx.utils.NumberUtils;
 import javafx.application.Application;
-import javafx.beans.binding.Bindings;
-import javafx.geometry.Orientation;
 import javafx.geometry.Pos;
 import javafx.scene.Scene;
-import javafx.scene.control.Label;
 import javafx.scene.layout.HBox;
 import javafx.scene.layout.VBox;
 import javafx.stage.Stage;
+import org.scenicview.ScenicView;
 
 import java.util.Random;
 
@@ -53,67 +47,45 @@ public class TestDemo extends Application {
         VBox box = new VBox(100);
         box.setAlignment(Pos.CENTER);
 
-        MFXSlider slider = new MFXSlider();
-        //slider.setSliderMode(SliderEnums.SliderMode.SNAP_TO_TICKS);
-        slider.setBidirectional(false);
-        slider.setPrefWidth(200);
-        slider.setMin(10);
-        slider.setMax(100);
-        slider.setValue(-50);
-        slider.setBidirectional(false);
-
-        slider.getRanges1().add(NumberRange.of(slider.getMin()));
-        slider.getRanges2().add(NumberRange.of(50.0));
-        slider.getRanges3().add(NumberRange.of(slider.getMax()));
-
         HBox bbox = new HBox(20);
         bbox.setAlignment(Pos.CENTER);
 
-        ResettableDoubleProperty property = new ResettableDoubleProperty(0.0, 10.5);
-        property.setFireChangeOnReset(true);
-
-        MFXButton b1 = new MFXButton("Change Thumb");
-        MFXButton b2 = new MFXButton("Change Popup");
-        MFXButton b3 = new MFXButton("Change Min");
-        MFXButton b4 = new MFXButton("Change Max");
-        MFXButton b5 = new MFXButton("Change Value");
-
-        b1.setOnAction(event -> slider.setThumbSupplier(() -> {
-            MFXButton button = new MFXButton("Thumb");
-            button.setPrefSize(40, 30);
-            return button;
-        }));
-        b2.setOnAction(event -> slider.setPopupSupplier(() -> {
-            Label label = new Label();
-            label.textProperty().bind(Bindings.createStringBinding(
-                    () -> NumberUtils.formatToString(slider.getValue(), slider.getDecimalPrecision()),
-                    slider.valueProperty()
-            ));
-            label.setStyle("-fx-border-color: orange");
-            return label;
-        }));
+        MFXButton b1 = new MFXButton("Set Leading");
+        MFXButton b2 = new MFXButton("Set Trailing");
+        MFXButton b3 = new MFXButton("Set Graphic");
+        MFXButton b4 = new MFXButton("Remove Graphic");
+        MFXButton b5 = new MFXButton("Remove Label Graphic");
+        MFXRectangleToggleNode rtn = new MFXRectangleToggleNode("");
+        rtn.setPrefSize(32, 32);
+        rtn.setAlignment(Pos.CENTER);
+
+        b1.setOnAction(event -> {
+            rtn.setLabelLeadingIcon(MFXFontIcon.getRandomIcon(12, ColorUtils.getRandomColor()));
+        });
+        b2.setOnAction(event -> {
+            rtn.setLabelTrailingIcon(MFXFontIcon.getRandomIcon(12, ColorUtils.getRandomColor()));
+        });
         b3.setOnAction(event -> {
-            slider.setOrientation(slider.getOrientation() == Orientation.HORIZONTAL ? Orientation.VERTICAL : Orientation.HORIZONTAL);
+            rtn.setGraphic(MFXFontIcon.getRandomIcon(12, ColorUtils.getRandomColor()));
         });
         b4.setOnAction(event -> {
-            slider.setPopupSide(slider.getPopupSide() == SliderPopupSide.DEFAULT ? SliderPopupSide.OTHER_SIDE : SliderPopupSide.DEFAULT);
+            rtn.setGraphic(null);
         });
         b5.setOnAction(event -> {
-            property.reset();
+            rtn.setLabelLeadingIcon(null);
+            rtn.setLabelTrailingIcon(null);
         });
 
-        property.addListener((observable, oldValue, newValue) -> System.out.println(newValue));
-
         bbox.getChildren().addAll(b1, b2, b3, b4, b5);
 
-        box.getChildren().addAll(slider, bbox);
+        box.getChildren().addAll(rtn, bbox);
         box.getStylesheets().add(MFXDemoResourcesLoader.load("css/TestDemo.css"));
 
         Scene scene = new Scene(box, 800, 600);
         primaryStage.setScene(scene);
         primaryStage.show();
 
-        //ScenicView.show(scene);
+        ScenicView.show(scene);
     }
 
     public static void main(String[] args) {

materialfx/src/main/java/io/github/palexdev/materialfx/controls/MFXRectangleToggleNode.java

@@ -34,7 +34,11 @@ import javafx.scene.control.ToggleButton;
  * <p></p>
  * Extends {@link ToggleButton} and redefines the style class to "mfx-toggle-node" for usage in CSS.
  * <p>
- * Allows to specify up to two icons for toggle's label.
+ * Allows to specify up to two icons for toggle's label. Also, if you want a toggle node without text but just with
+ * the icon, the property to set is the {@link #graphicProperty()}, setting the leading or the trailing in this case can lead to
+ * misaligned icons as those two icons are meant to be used with text. Note that whenever the graphic property is set to
+ * a not null value it will be prioritized over the other two icons and the label. The label will hidden and only the
+ * graphic property will be shown. Setting it back to null will show the label, leading and trailing icons back again.
  */
 public class MFXRectangleToggleNode extends AbstractMFXToggleNode {
     //================================================================================

materialfx/src/main/java/io/github/palexdev/materialfx/skins/MFXRectangleToggleNodeSkin.java

@@ -71,6 +71,7 @@ public class MFXRectangleToggleNodeSkin extends SkinBase<MFXRectangleToggleNode>
         rippleGenerator = new MFXCircleRippleGenerator(toggleNode);
 
         container.getChildren().setAll(rippleGenerator, label);
+        handleGraphics();
 
         setupRippleGenerator();
         setListeners();
@@ -97,10 +98,8 @@ public class MFXRectangleToggleNodeSkin extends SkinBase<MFXRectangleToggleNode>
      * Adds listeners for:
      * <p>
      * <p> - {@link MFXRectangleToggleNode}: to update the ripple generator's clip supplier.
-     * <p></p>
-     * Adds bindings for:
-     * <p>
-     * <p> - Binds the {@link MFXLabel} icons properties to the corresponding toggle's properties.
+     * <p> - {@link MFXRectangleToggleNode#graphicProperty()}, {@link MFXRectangleToggleNode#labelLeadingIconProperty()},
+     * {@link MFXRectangleToggleNode#labelTrailingIconProperty()}, to properly handle the various settable icons, call to {@link #handleGraphics()}
      * <p></p>
      * Adds event filters/handlers for:
      * <p>
@@ -111,8 +110,15 @@ public class MFXRectangleToggleNodeSkin extends SkinBase<MFXRectangleToggleNode>
         MFXRectangleToggleNode toggleNode = getSkinnable();
 
         toggleNode.rippleClipTypeFactoryProperty().addListener((observable, oldValue, newValue) -> rippleGenerator.setClipSupplier(() -> newValue.build(container)));
-        label.leadingIconProperty().bind(toggleNode.labelLeadingIconProperty());
-        label.trailingIconProperty().bind(toggleNode.labelTrailingIconProperty());
+
+        toggleNode.graphicProperty().addListener((observable, oldValue, newValue) -> {
+            if (oldValue != null) {
+                container.getChildren().remove(oldValue);
+            }
+            handleGraphics();
+        });
+        toggleNode.labelLeadingIconProperty().addListener((observable, oldValue, newValue) -> handleGraphics());
+        toggleNode.labelTrailingIconProperty().addListener((observable, oldValue, newValue) -> handleGraphics());
 
         container.addEventFilter(MouseEvent.MOUSE_PRESSED, event -> {
             Node leadingIcon = label.getLeadingIcon();
@@ -145,6 +151,35 @@ public class MFXRectangleToggleNodeSkin extends SkinBase<MFXRectangleToggleNode>
         });
     }
 
+    /**
+     * Handles the various settable icons of this control.
+     * <p>
+     * Prioritizes the nodes coming from the {@link MFXRectangleToggleNode#graphicProperty()}, meaning that even
+     * if there is text, even if the leading or trailing icons are set, they will be hidden whenever the graphic property
+     * is not null.
+     */
+    protected void handleGraphics() {
+        MFXRectangleToggleNode toggleNode = getSkinnable();
+
+        Node graphic = toggleNode.getGraphic();
+        Node leading = toggleNode.getLabelLeadingIcon();
+        Node trailing = toggleNode.getLabelTrailingIcon();
+        label.setLeadingIcon(leading);
+        label.setTrailingIcon(trailing);
+        if (leading != null || trailing != null) {
+            label.setVisible(graphic == null);
+        }
+
+        if (graphic != null) {
+            label.setVisible(false);
+            if (!container.getChildren().contains(graphic)) {
+                container.getChildren().add(graphic);
+            }
+        } else {
+            label.setVisible(true);
+        }
+    }
+
     //================================================================================
     // Override Methods
     //================================================================================