tablet/atlantafx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add alt icon and dense style support for TitledPane

Browse Source
This commit is contained in:
mkpaz 2022-10-05 13:31:33 +04:00
parent cbde1de246
commit dec8b80781
3 changed files with 86 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
sampler/src/main/java/atlantafx/sampler/page/components/AccordionPage.java
View File

@ -2,6 +2,7 @@
package atlantafx.sampler.page.components;
import atlantafx.base.controls.ToggleSwitch;
import atlantafx.base.theme.Tweaks;
import atlantafx.sampler.Resources;
import atlantafx.sampler.page.AbstractPage;
import atlantafx.sampler.page.SampleBlock;
@ -21,6 +22,10 @@ import javafx.scene.layout.VBox;
import javafx.scene.text.Text;
import javafx.scene.text.TextFlow;
import static atlantafx.base.theme.Styles.DENSE;
import static atlantafx.base.theme.Styles.toggleStyleClass;
import static atlantafx.sampler.page.SampleBlock.BLOCK_HGAP;
public class AccordionPage extends AbstractPage {
public static final String NAME = "Accordion";
@ -31,12 +36,15 @@ public class AccordionPage extends AbstractPage {
private final BooleanProperty expandedProperty = new SimpleBooleanProperty(true);
private final BooleanProperty animatedProperty = new SimpleBooleanProperty(true);
private final Accordion accordion;
public AccordionPage() {
super();
accordion = createPlayground();
var sample = new SampleBlock(
"Playground",
new VBox(SampleBlock.BLOCK_VGAP, createControls(), createPlayground())
new VBox(SampleBlock.BLOCK_VGAP, createControls(), accordion)
);
sample.setFillHeight(true);
setUserContent(sample);
@ -51,7 +59,23 @@ public class AccordionPage extends AbstractPage {
expandedProperty.bind(expandedToggle.selectedProperty());
expandedToggle.setSelected(true);
var controls = new HBox(SampleBlock.BLOCK_HGAP, animatedToggle, expandedToggle);
var denseToggle = new ToggleSwitch("Dense");
denseToggle.selectedProperty().addListener(
(obs, old, val) -> accordion.getPanes().forEach(p -> toggleStyleClass(p, DENSE))
);
var altIconToggle = new ToggleSwitch("Alt icon");
altIconToggle.selectedProperty().addListener(
(obs, old, val) -> accordion.getPanes().forEach(p -> toggleStyleClass(p, Tweaks.ALT_ICON))
);
var controls = new HBox(
BLOCK_HGAP,
animatedToggle,
expandedToggle,
denseToggle,
altIconToggle
);
controls.setAlignment(Pos.CENTER);
controls.setPadding(new Insets(0, 0, 0, 2));

32
sampler/src/main/java/atlantafx/sampler/page/components/TitledPanePage.java
View File

@ -3,6 +3,7 @@ package atlantafx.sampler.page.components;
import atlantafx.base.controls.Spacer;
import atlantafx.base.controls.ToggleSwitch;
import atlantafx.base.theme.Tweaks;
import atlantafx.sampler.page.AbstractPage;
import atlantafx.sampler.page.Page;
import javafx.geometry.Pos;
@ -10,17 +11,15 @@ import javafx.scene.control.CheckBox;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.control.TitledPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.scene.layout.VBox;
import javafx.scene.layout.*;
import javafx.scene.text.Text;
import javafx.scene.text.TextFlow;
import static atlantafx.base.theme.Styles.ELEVATED_2;
import static atlantafx.base.theme.Styles.INTERACTIVE;
import static atlantafx.base.theme.Styles.*;
import static atlantafx.sampler.page.SampleBlock.BLOCK_HGAP;
import static atlantafx.sampler.page.SampleBlock.BLOCK_VGAP;
import static javafx.geometry.HPos.RIGHT;
import static javafx.scene.layout.Priority.NEVER;
public class TitledPanePage extends AbstractPage {
@ -91,6 +90,24 @@ public class TitledPanePage extends AbstractPage {
animateToggle.setSelected(true);
playground.animatedProperty().bind(animateToggle.selectedProperty());
var denseToggle = new ToggleSwitch("Dense");
denseToggle.selectedProperty().addListener((obs, old, val) -> toggleStyleClass(playground, DENSE));
var altIconToggle = new ToggleSwitch("Alt icon");
altIconToggle.selectedProperty().addListener((obs, old, val) -> toggleStyleClass(playground, Tweaks.ALT_ICON));
var toggles = new GridPane();
toggles.setVgap(10);
toggles.setHgap(BLOCK_HGAP);
toggles.getColumnConstraints().setAll(
new ColumnConstraints(-1, -1, -1, NEVER, RIGHT, false),
new ColumnConstraints(-1, -1, -1, NEVER, RIGHT, false)
);
toggles.add(collapseToggle, 0, 0);
toggles.add(animateToggle, 1, 0);
toggles.add(denseToggle, 0, 1);
toggles.add(altIconToggle, 1, 1);
var controls = new HBox(BLOCK_HGAP);
controls.setMinHeight(80);
controls.setFillHeight(false);
@ -99,8 +116,7 @@ public class TitledPanePage extends AbstractPage {
new Label("Elevation"),
elevationSlider,
new Spacer(),
collapseToggle,
animateToggle
toggles
);
var content = new VBox(BLOCK_VGAP, textFlow, controls);

40
styles/src/components/_titled-pane.scss
View File

@ -4,11 +4,15 @@
@use "../settings/effects";
@use "../settings/icons";
$padding-x: 20px !default;
$padding-y: 10px !default;
$padding-x: 20px !default;
$padding-x-dense: 10px !default;
$padding-y: 10px !default;
$padding-y-dense: 5px !default;
$margin-arrow: 10px !default;
$margin-content: 20px !default;
$margin-arrow: 10px !default;
$margin-arrow-dense: 10px !default;
$margin-content: 20px !default;
$margin-content-dense: 10px !default;
.titled-pane {
-fx-background-color: -color-bg-default;
@ -92,4 +96,32 @@ $margin-content: 20px !default;
&:show-mnemonics>.mnemonic-underline {
-fx-stroke: -color-fg-default;
}
&.dense {
>.title {
-fx-padding: $padding-y-dense $padding-x-dense $padding-y-dense $padding-x-dense;
>.text {
-fx-font-size: 1.1em;
}
>.arrow-button {
-fx-padding: 0 $margin-arrow-dense 0 0;
}
}
>.content {
-fx-padding: $margin-content-dense $padding-x-dense $padding-y-dense $padding-x-dense;
}
}
&.alt-icon {
>.title {
>.arrow-button {
>.arrow {
@include icons.get("arrow-drop-down", false);
}
}
}
}
}