Add tweak to align table columns

base/src/main/java/atlantafx/base/theme/Tweaks.java

@@ -12,4 +12,9 @@ public final class Tweaks {
 
     /** Remover external control borders */
     public static final String EDGE_TO_EDGE = "edge-to-edge";
+
+    /** Alignment */
+    public static final String ALIGN_LEFT = "align-left";
+    public static final String ALIGN_CENTER = "align-center";
+    public static final String ALIGN_RIGHT = "align-right";
 }

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

@@ -4,7 +4,6 @@ package atlantafx.sampler.page.components;
 import atlantafx.base.controls.CaptionMenuItem;
 import atlantafx.base.controls.Spacer;
 import atlantafx.base.controls.ToggleSwitch;
-import atlantafx.base.theme.Tweaks;
 import atlantafx.sampler.fake.domain.Product;
 import atlantafx.sampler.page.AbstractPage;
 import javafx.beans.binding.Bindings;
@@ -22,9 +21,11 @@ import org.kordamp.ikonli.feather.Feather;
 import org.kordamp.ikonli.javafx.FontIconTableCell;
 
 import java.util.List;
+import java.util.Objects;
 import java.util.stream.IntStream;
 
 import static atlantafx.base.theme.Styles.*;
+import static atlantafx.base.theme.Tweaks.*;
 import static javafx.collections.FXCollections.observableArrayList;
 import static javafx.geometry.Orientation.HORIZONTAL;
 
@@ -229,12 +230,58 @@ public class TablePage extends AbstractPage {
         var edge2edgeItem = new CheckMenuItem("Edge to edge");
         edge2edgeItem.selectedProperty().addListener((obs, old, val) -> {
             if (!val) {
-                table.getStyleClass().remove(Tweaks.EDGE_TO_EDGE);
+                table.getStyleClass().remove(EDGE_TO_EDGE);
             } else {
-                table.getStyleClass().add(Tweaks.EDGE_TO_EDGE);
+                table.getStyleClass().add(EDGE_TO_EDGE);
             }
         });
 
+        // ~
+
+        var alignToggleGroup = new ToggleGroup();
+
+        var alignLeftItem = new RadioMenuItem("Left");
+        alignLeftItem.setToggleGroup(alignToggleGroup);
+        alignLeftItem.selectedProperty().addListener((obs, old, val) -> {
+            for (TableColumn<?, ?> c : table.getColumns()) {
+                addStyleClass(c, ALIGN_LEFT, ALIGN_CENTER, ALIGN_RIGHT);
+            }
+        });
+
+        var alignCenterItem = new RadioMenuItem("Center");
+        alignCenterItem.setToggleGroup(alignToggleGroup);
+        alignCenterItem.selectedProperty().addListener((obs, old, val) -> {
+            for (TableColumn<?, ?> c : table.getColumns()) {
+                addStyleClass(c, ALIGN_CENTER, ALIGN_LEFT, ALIGN_RIGHT);
+            }
+        });
+
+        var alignRightItem = new RadioMenuItem("Right");
+        alignRightItem.setToggleGroup(alignToggleGroup);
+        alignRightItem.selectedProperty().addListener((obs, old, val) -> {
+            for (TableColumn<?, ?> c : table.getColumns()) {
+                addStyleClass(c, ALIGN_RIGHT, ALIGN_LEFT, ALIGN_CENTER);
+            }
+        });
+
+        var alignDefaultItem = new MenuItem("Default");
+        alignDefaultItem.setOnAction(e -> {
+            for (TableColumn<?, ?> c : table.getColumns()) {
+                c.getStyleClass().removeAll(ALIGN_LEFT, ALIGN_CENTER, ALIGN_RIGHT);
+            }
+        });
+
+        var alignMenu = new Menu("Align columns");
+        alignMenu.getItems().setAll(
+                alignLeftItem,
+                alignCenterItem,
+                alignRightItem,
+                new SeparatorMenuItem(),
+                alignDefaultItem
+        );
+
+        // ~
+
         var menuButtonItem = new CheckMenuItem("Show menu button");
         table.tableMenuButtonVisibleProperty().bind(menuButtonItem.selectedProperty());
         menuButtonItem.setSelected(true);
@@ -250,9 +297,20 @@ public class TablePage extends AbstractPage {
                     new SeparatorMenuItem(),
                     editCellsItem,
                     cellSelectionItem,
+                    alignMenu,
                     edge2edgeItem,
                     menuButtonItem
             );
         }};
     }
+
+    private static void addStyleClass(TableColumn<?, ?> c, String styleClass, String... excludes) {
+        Objects.requireNonNull(c);
+        Objects.requireNonNull(styleClass);
+
+        if (excludes != null && excludes.length > 0) {
+            c.getStyleClass().removeAll(excludes);
+        }
+        c.getStyleClass().add(styleClass);
+    }
 }

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

@@ -16,9 +16,11 @@ import javafx.scene.layout.VBox;
 import javafx.util.Callback;
 
 import java.util.List;
+import java.util.Objects;
 import java.util.stream.IntStream;
 
 import static atlantafx.base.theme.Styles.*;
+import static atlantafx.base.theme.Tweaks.*;
 
 public class TreeTablePage extends AbstractPage {
 
@@ -223,6 +225,52 @@ public class TreeTablePage extends AbstractPage {
             }
         });
 
+        // ~
+
+        var alignToggleGroup = new ToggleGroup();
+
+        var alignLeftItem = new RadioMenuItem("Left");
+        alignLeftItem.setToggleGroup(alignToggleGroup);
+        alignLeftItem.selectedProperty().addListener((obs, old, val) -> {
+            for (TreeTableColumn<?, ?> c : treeTable.getColumns()) {
+                addStyleClass(c, ALIGN_LEFT, ALIGN_CENTER, ALIGN_RIGHT);
+            }
+        });
+
+        var alignCenterItem = new RadioMenuItem("Center");
+        alignCenterItem.setToggleGroup(alignToggleGroup);
+        alignCenterItem.selectedProperty().addListener((obs, old, val) -> {
+            for (TreeTableColumn<?, ?> c : treeTable.getColumns()) {
+                addStyleClass(c, ALIGN_CENTER, ALIGN_LEFT, ALIGN_RIGHT);
+            }
+        });
+
+        var alignRightItem = new RadioMenuItem("Right");
+        alignRightItem.setToggleGroup(alignToggleGroup);
+        alignRightItem.selectedProperty().addListener((obs, old, val) -> {
+            for (TreeTableColumn<?, ?> c : treeTable.getColumns()) {
+                addStyleClass(c, ALIGN_RIGHT, ALIGN_LEFT, ALIGN_CENTER);
+            }
+        });
+
+        var alignDefaultItem = new MenuItem("Default");
+        alignDefaultItem.setOnAction(e -> {
+            for (TreeTableColumn<?, ?> c : treeTable.getColumns()) {
+                c.getStyleClass().removeAll(ALIGN_LEFT, ALIGN_CENTER, ALIGN_RIGHT);
+            }
+        });
+
+        var alignMenu = new Menu("Align columns");
+        alignMenu.getItems().setAll(
+                alignLeftItem,
+                alignCenterItem,
+                alignRightItem,
+                new SeparatorMenuItem(),
+                alignDefaultItem
+        );
+
+        // ~
+
         var menuButtonItem = new CheckMenuItem("Show menu button");
         treeTable.tableMenuButtonVisibleProperty().bind(menuButtonItem.selectedProperty());
         menuButtonItem.setSelected(true);
@@ -239,9 +287,20 @@ public class TreeTablePage extends AbstractPage {
                     showRootItem,
                     editCellsItem,
                     cellSelectionItem,
+                    alignMenu,
                     edge2edgeItem,
                     menuButtonItem
             );
         }};
     }
+
+    private static void addStyleClass(TreeTableColumn<?, ?> c, String styleClass, String... excludes) {
+        Objects.requireNonNull(c);
+        Objects.requireNonNull(styleClass);
+
+        if (excludes != null && excludes.length > 0) {
+            c.getStyleClass().removeAll(excludes);
+        }
+        c.getStyleClass().add(styleClass);
+    }
 }

sampler/src/main/java/atlantafx/sampler/page/showcase/filemanager/TableDirectoryView.java

@@ -2,6 +2,7 @@
 package atlantafx.sampler.page.showcase.filemanager;
 
 import atlantafx.base.theme.Styles;
+import atlantafx.base.theme.Tweaks;
 import atlantafx.sampler.util.Containers;
 import atlantafx.sampler.util.HumanReadableFormat;
 import javafx.beans.property.SimpleLongProperty;
@@ -66,7 +67,7 @@ final class TableDirectoryView extends AnchorPane implements DirectoryView {
         var mtimeCol = new TableColumn<Path, FileTime>("Modified");
         mtimeCol.setCellValueFactory(param -> new SimpleObjectProperty<>(fileMTime(param.getValue(), NOFOLLOW_LINKS)));
         mtimeCol.setCellFactory(col -> new FileTimeCell());
-        mtimeCol.setStyle("-fx-alignment: CENTER-RIGHT;");
+        mtimeCol.getStyleClass().add(Tweaks.ALIGN_RIGHT);
 
         // ~
 
@@ -193,8 +194,8 @@ final class TableDirectoryView extends AnchorPane implements DirectoryView {
                 setText(null);
             } else {
                 setText(fileTime != null ?
-                                HumanReadableFormat.date(fileTime.toInstant().atZone(ZoneId.systemDefault()).toLocalDateTime()) :
+                        HumanReadableFormat.date(fileTime.toInstant().atZone(ZoneId.systemDefault()).toLocalDateTime()) :
-                                UNKNOWN
+                        UNKNOWN
                 );
             }
         }

styles/src/components/_data.scss

@@ -3,37 +3,37 @@
 @use "../settings/config" as cfg;
 @use "../settings/icons";
 
-$color-cell-bg:          -color-bg-default !default;
+$color-cell-bg: -color-bg-default !default;
-$color-cell-fg:          -color-fg-default !default;
+$color-cell-fg: -color-fg-default !default;
 $color-cell-bg-selected: if(cfg.$darkMode, -color-base-6, -color-base-1) !default;
 $color-cell-fg-selected: -color-fg-default !default;
-$color-cell-bg-odd:      -color-bg-subtle  !default;
+$color-cell-bg-odd: -color-bg-subtle !default;
-$color-cell-border:      -color-border-default  !default;
+$color-cell-border: -color-border-default !default;
-$color-header-bg:        -color-bg-subtle  !default;
+$color-header-bg: -color-bg-subtle !default;
-$color-header-fg:        -color-fg-default !default;
+$color-header-fg: -color-fg-default !default;
-$color-resize-line:      -color-accent-emphasis !default;
+$color-resize-line: -color-accent-emphasis !default;
-$color-drag-header:      -color-accent-muted !default;
+$color-drag-header: -color-accent-muted !default;
-$color-drag-overlay:     -color-accent-muted !default;
+$color-drag-overlay: -color-accent-muted !default;
 
 $cell-size-normal: 2.8em !default;
-$cell-size-dense:  2em   !default;
+$cell-size-dense: 2em !default;
-$cell-padding-x:   0.5em !default;
+$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-x: $cell-padding-x  !default;
-$tree-cell-padding-y-normal: 0.5em  !default;
+$tree-cell-padding-y-normal: 0.5em !default;
-$tree-cell-padding-y-dense:  0.25em !default;
+$tree-cell-padding-y-dense: 0.25em !default;
 $tree-cell-indent: 1em !default;
 
 @mixin _base() {
 
-  -color-cell-bg:          $color-cell-bg;
+  -color-cell-bg: $color-cell-bg;
-  -color-cell-fg:          $color-cell-fg;
+  -color-cell-fg: $color-cell-fg;
   -color-cell-bg-selected: $color-cell-bg-selected;
   -color-cell-fg-selected: $color-cell-fg-selected;
-  -color-cell-bg-odd:      $color-cell-bg-odd;
+  -color-cell-bg-odd: $color-cell-bg-odd;
-  -color-cell-border:      $color-cell-border;
+  -color-cell-border: $color-cell-border;
 
   -fx-border-color: -color-cell-border;
   -fx-border-width: cfg.$border-width;
@@ -195,7 +195,6 @@ $tree-cell-indent: 1em !default;
     -fx-background-insets: 0, 0 0 1 0;
 
     // there's also
-    // .table-column { }
     // .nested-column-header { }
 
     // columns headers can be nested, so there's no child combinator here
@@ -339,7 +338,7 @@ $tree-cell-indent: 1em !default;
       -fx-background-insets: 0;
 
       >.table-cell {
-        -fx-border-color:transparent;
+        -fx-border-color: transparent;
       }
     }
 
@@ -347,6 +346,21 @@ $tree-cell-indent: 1em !default;
       -fx-padding: 0 $cell-padding-x 0 $cell-padding-x;
       -fx-text-fill: -color-cell-fg;
       -fx-alignment: CENTER_LEFT;
+
+      // #tweak/align-left
+      &.table-column.align-left {
+        -fx-alignment: CENTER_LEFT;
+      }
+
+      // #tweak/align-center
+      &.table-column.align-center {
+        -fx-alignment: CENTER;
+      }
+
+      // #tweak/align-right
+      &.table-column.align-right {
+        -fx-alignment: CENTER-RIGHT;
+      }
     }
   }
 }
@@ -484,6 +498,21 @@ $tree-cell-indent: 1em !default;
       -fx-padding: 0 $cell-padding-x 0 $cell-padding-x;
       -fx-text-fill: -color-cell-fg;
       -fx-alignment: CENTER_LEFT;
+
+      // #tweak/align-left
+      &.table-column.align-left {
+        -fx-alignment: CENTER_LEFT;
+      }
+
+      // #tweak/align-center
+      &.table-column.align-center {
+        -fx-alignment: CENTER;
+      }
+
+      // #tweak/align-right
+      &.table-column.align-right {
+        -fx-alignment: CENTER-RIGHT;
+      }
     }
   }
-}
+}