Add dense style support for TreeView

sampler/src/main/java/atlantafx/sampler/page/components/TreePage.java

@@ -1,8 +1,8 @@
 /* SPDX-License-Identifier: MIT */
 package atlantafx.sampler.page.components;
 
-import atlantafx.base.controls.ToggleSwitch;
 import atlantafx.base.controls.Spacer;
+import atlantafx.base.controls.ToggleSwitch;
 import atlantafx.sampler.page.AbstractPage;
 import javafx.geometry.Orientation;
 import javafx.scene.control.*;
@@ -22,6 +22,9 @@ import java.util.Objects;
 import java.util.Optional;
 import java.util.function.Supplier;
 
+import static atlantafx.base.theme.Styles.DENSE;
+import static atlantafx.base.theme.Styles.toggleStyleClass;
+
 public class TreePage extends AbstractPage {
 
     public static final String NAME = "TreeView";
@@ -57,6 +60,11 @@ public class TreePage extends AbstractPage {
         var playground = new VBox(10);
         playground.setMinHeight(100);
 
+        var denseToggle = new ToggleSwitch("Dense");
+        denseToggle.selectedProperty().addListener(
+                (obs, old, value) -> findDisplayedTree().ifPresent(tv -> toggleStyleClass(tv, DENSE))
+        );
+
         var showRootToggle = new ToggleSwitch("Show root");
         showRootToggle.selectedProperty().addListener((obs, old, val) -> findDisplayedTree().ifPresent(tv -> {
             if (val != null) { tv.setShowRoot(val); }
@@ -70,6 +78,7 @@ public class TreePage extends AbstractPage {
 
         var controls = new HBox(20,
                 new Spacer(),
+                denseToggle,
                 showRootToggle,
                 disableToggle,
                 new Spacer()
@@ -100,8 +109,10 @@ public class TreePage extends AbstractPage {
             // copy existing style classes and properties to the new tree
             findDisplayedTree().ifPresent(tv -> {
                 List<String> currentStyles = tv.getStyleClass();
+                System.out.println("C = " + currentStyles);
                 currentStyles.remove("tree-view");
                 newTree.getStyleClass().addAll(currentStyles);
+                System.out.println("N = " + newTree.getStyleClass());
 
                 newTree.setShowRoot(tv.isShowRoot());
                 newTree.setDisable(tv.isDisable());

styles/src/components/_data.scss

@@ -10,8 +10,9 @@ $cell-padding-x:   0.5em !default;
 // .tree-cell doesn't support -fx-cell-size
 // its height should be set via vertical paddings
 $tree-cell-padding-x: $cell-padding-x !default;
-$tree-cell-padding-y: $cell-padding-x !default;
+$tree-cell-padding-y-normal: 0.5em  !default;
-$tree-cell-indent:    1em !default;
+$tree-cell-padding-y-dense:  0.25em !default;
+$tree-cell-indent: 1em !default;
 
 @mixin _base() {
 
@@ -362,12 +363,18 @@ $tree-cell-indent:    1em !default;
 
 .tree-view {
   @include _base();
+
+  &.dense {
+    .tree-cell {
+      -fx-padding: $tree-cell-padding-y-dense 0 $tree-cell-padding-y-dense 0;
+    }
+  }
 }
 
 .tree-cell {
   -fx-background-color: -color-cell-bg;
   -fx-text-fill: -color-cell-fg;
-  -fx-padding: $tree-cell-padding-y 0 $tree-cell-padding-y 0;
+  -fx-padding: $tree-cell-padding-y-normal 0 $tree-cell-padding-y-normal 0;
   -fx-indent: $tree-cell-indent;
 
   // NOTE:
@@ -378,7 +385,7 @@ $tree-cell-indent:    1em !default;
   // re-adjust paddings as well. Also learn about TreeCellSkin#maxDisclosureWidthMap.
   // #javafx-bug
   >.tree-disclosure-node {
-    -fx-padding: 4px $tree-cell-padding-x 4px $tree-cell-padding-x;
+    -fx-padding: 5px $tree-cell-padding-x 0 $tree-cell-padding-x;
     -fx-background-color: transparent;
   }
 }