Add alt icon support for TreeView disclosure node
Also introduce a color variable and tone down disclosure node color.
This commit is contained in:
parent
aa294eb773
commit
cbde1de246
@ -63,6 +63,11 @@ public class TreePage extends AbstractPage {
|
||||
}));
|
||||
showRootToggle.setSelected(true);
|
||||
|
||||
var altIconToggle = new ToggleSwitch("Alt icon");
|
||||
altIconToggle.selectedProperty().addListener((obs, old, val) ->
|
||||
findDisplayedTree().ifPresent(tv -> toggleStyleClass(tv, Tweaks.ALT_ICON))
|
||||
);
|
||||
|
||||
var edge2edgeToggle = new ToggleSwitch("Edge to edge");
|
||||
edge2edgeToggle.selectedProperty().addListener(
|
||||
(obs, old, val) -> findDisplayedTree().ifPresent(tv -> toggleStyleClass(tv, Tweaks.EDGE_TO_EDGE))
|
||||
@ -73,7 +78,7 @@ public class TreePage extends AbstractPage {
|
||||
if (val != null) { tv.setDisable(val); }
|
||||
}));
|
||||
|
||||
var controls = new HBox(BLOCK_HGAP, denseToggle, showRootToggle, edge2edgeToggle);
|
||||
var controls = new HBox(BLOCK_HGAP, denseToggle, showRootToggle, altIconToggle, edge2edgeToggle);
|
||||
controls.setAlignment(Pos.CENTER);
|
||||
|
||||
VBox.setVgrow(treeWrapper, Priority.ALWAYS);
|
||||
|
@ -57,12 +57,15 @@ public class TreeTablePage extends AbstractPage {
|
||||
var stripesToggle = new ToggleSwitch("Striped");
|
||||
stripesToggle.selectedProperty().addListener((obs, old, val) -> toggleStyleClass(treeTable, STRIPED));
|
||||
|
||||
var altIconToggle = new ToggleSwitch("Alt icon");
|
||||
altIconToggle.selectedProperty().addListener((obs, old, val) -> toggleStyleClass(treeTable, Tweaks.ALT_ICON));
|
||||
|
||||
var edge2edgeToggle = new ToggleSwitch("Edge to edge");
|
||||
edge2edgeToggle.selectedProperty().addListener(
|
||||
(obs, old, value) -> toggleStyleClass(treeTable, Tweaks.EDGE_TO_EDGE)
|
||||
);
|
||||
|
||||
var footer = new HBox(BLOCK_HGAP, bordersToggle, denseToggle, stripesToggle, edge2edgeToggle);
|
||||
var footer = new HBox(BLOCK_HGAP, bordersToggle, denseToggle, stripesToggle, altIconToggle, edge2edgeToggle);
|
||||
footer.setAlignment(Pos.CENTER);
|
||||
|
||||
// == TREE TABLE ==
|
||||
|
@ -9,6 +9,7 @@ $color-cell-bg-selected: if(cfg.$darkMode, -color-base-6, -color-base-1) !defaul
|
||||
$color-cell-fg-selected: -color-fg-default !default;
|
||||
$color-cell-bg-odd: -color-bg-subtle !default;
|
||||
$color-cell-border: -color-border-default !default;
|
||||
$color-disclosure: -color-fg-muted !default;
|
||||
|
||||
$color-header-bg: -color-bg-subtle !default;
|
||||
$color-header-fg: -color-fg-default !default;
|
||||
@ -36,6 +37,7 @@ $tree-cell-indent: 1em !default;
|
||||
-color-cell-fg-selected: $color-cell-fg-selected;
|
||||
-color-cell-bg-odd: $color-cell-bg-odd;
|
||||
-color-cell-border: $color-cell-border;
|
||||
-color-disclosure: $color-disclosure;
|
||||
|
||||
-fx-border-color: -color-cell-border;
|
||||
-fx-border-width: cfg.$border-width;
|
||||
@ -408,6 +410,22 @@ $tree-cell-indent: 1em !default;
|
||||
-fx-padding: $tree-cell-padding-y-dense 0 $tree-cell-padding-y-dense 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.alt-icon {
|
||||
.tree-cell>.tree-disclosure-node {
|
||||
-fx-padding: 0.2em $tree-cell-padding-x 0 $tree-cell-padding-x;
|
||||
}
|
||||
|
||||
.tree-cell>.tree-disclosure-node>.arrow {
|
||||
@include icons.get("plus-box", true);
|
||||
-fx-padding: 0.5em;
|
||||
}
|
||||
|
||||
.tree-cell:expanded>.tree-disclosure-node>.arrow {
|
||||
@include icons.get("minus-box", true);
|
||||
-fx-padding: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tree-cell {
|
||||
@ -424,7 +442,7 @@ $tree-cell-indent: 1em !default;
|
||||
// re-adjust paddings as well. Also learn about TreeCellSkin#maxDisclosureWidthMap.
|
||||
// #javafx-bug
|
||||
>.tree-disclosure-node {
|
||||
-fx-padding: 5px $tree-cell-padding-x 0 $tree-cell-padding-x;
|
||||
-fx-padding: 0.35em $tree-cell-padding-x 0 $tree-cell-padding-x;
|
||||
-fx-background-color: transparent;
|
||||
}
|
||||
}
|
||||
@ -432,7 +450,7 @@ $tree-cell-indent: 1em !default;
|
||||
.tree-cell>.tree-disclosure-node>.arrow,
|
||||
.tree-table-row-cell>.tree-disclosure-node>.arrow {
|
||||
@include icons.get("arrow-right", false);
|
||||
-fx-background-color: -color-cell-fg;
|
||||
-fx-background-color: -color-disclosure;
|
||||
-fx-padding: 0.333333em 0.229em 0.333333em 0.229em;
|
||||
}
|
||||
|
||||
@ -530,4 +548,16 @@ $tree-cell-indent: 1em !default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.alt-icon {
|
||||
.tree-table-row-cell>.tree-disclosure-node>.arrow {
|
||||
@include icons.get("plus-box", true);
|
||||
-fx-padding: 0.5em;
|
||||
}
|
||||
|
||||
.tree-table-row-cell:expanded>.tree-disclosure-node>.arrow {
|
||||
@include icons.get("minus-box", true);
|
||||
-fx-padding: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -13,8 +13,10 @@ $material-icons: (
|
||||
"expand-less": "M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z",
|
||||
"expand-more": "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z",
|
||||
"minus": "M 17,13 H 7 v -2 h 10 z",
|
||||
"minus-box": "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14zM7 11h10v2H7z",
|
||||
"more-vert": "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z",
|
||||
"plus": "M 18,12.857142 H 12.857142 V 18 H 11.142858 V 12.857142 H 6 v -1.714284 h 5.142858 V 6 h 1.714284 v 5.142858 H 18 Z",
|
||||
"plus-box": "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14zm-8-2h2v-4h4v-2h-4V7h-2v4H7v2h4z",
|
||||
"unfold-more": "M12 5.83L15.17 9l1.41-1.41L12 3 7.41 7.59 8.83 9 12 5.83zm0 12.34L8.83 15l-1.41 1.41L12 21l4.59-4.59L15.17 15 12 18.17z",
|
||||
);
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user