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

Add label page

Browse Source 
Also support settings label color via pseudo-classes.
This commit is contained in:
mkpaz 2023-02-08 19:45:33 +04:00
parent 2bade687f7
commit ae41f89023
4 changed files with 166 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
sampler/src/main/java/atlantafx/sampler/layout/Sidebar.java
View File

@ -187,6 +187,7 @@ class Sidebar extends StackPane {
navLink(DatePickerPage.NAME, DatePickerPage.class),
navLink(DialogPage.NAME, DialogPage.class),
navLink(HTMLEditorPage.NAME, HTMLEditorPage.class),
navLink(LabelPage.NAME, LabelPage.class),
navLink(ListPage.NAME, ListPage.class),
navLink(MenuPage.NAME, MenuPage.class),
navLink(MenuButtonPage.NAME, MenuButtonPage.class, "SplitMenuButton"),

74
sampler/src/main/java/atlantafx/sampler/page/components/LabelPage.java Normal file
View File

@ -0,0 +1,74 @@
/* SPDX-License-Identifier: MIT */
package atlantafx.sampler.page.components;
import atlantafx.base.theme.Styles;
import atlantafx.sampler.page.AbstractPage;
import atlantafx.sampler.page.SampleBlock;
import javafx.scene.control.Label;
import javafx.scene.layout.FlowPane;
import javafx.scene.layout.VBox;
import org.kordamp.ikonli.javafx.FontIcon;
import org.kordamp.ikonli.material2.Material2AL;
import static atlantafx.sampler.page.SampleBlock.BLOCK_HGAP;
import static atlantafx.sampler.page.SampleBlock.BLOCK_VGAP;
public class LabelPage extends AbstractPage {
public static final String NAME = "Label";
@Override
public String getName() { return NAME; }
public LabelPage() {
super();
createView();
}
private void createView() {
setUserContent(new VBox(
PAGE_VGAP,
expandingHBox(colorSample())
));
}
private SampleBlock colorSample() {
var defaultLabel = new Label("default", createFontIcon());
var accentLabel = new Label("accent", createFontIcon());
accentLabel.getStyleClass().add(Styles.ACCENT);
var successLabel = new Label("success", createFontIcon());
successLabel.getStyleClass().add(Styles.SUCCESS);
var warningLabel = new Label("warning", createFontIcon());
warningLabel.getStyleClass().add(Styles.WARNING);
var dangerLabel = new Label("danger", createFontIcon());
dangerLabel.getStyleClass().add(Styles.DANGER);
var mutedLabel = new Label("muted", createFontIcon());
mutedLabel.getStyleClass().add(Styles.TEXT_MUTED);
var subtleLabel = new Label("subtle", createFontIcon());
subtleLabel.getStyleClass().add(Styles.TEXT_SUBTLE);
var content = new VBox(
BLOCK_VGAP,
new Label("You can also use pseudo-classes to set Label color."),
new Label("Note that icon inherits label color by default."),
new FlowPane(
BLOCK_HGAP, BLOCK_VGAP,
defaultLabel, accentLabel, successLabel, warningLabel, dangerLabel,
mutedLabel, subtleLabel
));
return new SampleBlock("Colors", content);
}
private FontIcon createFontIcon(String... stylesClass) {
var icon = new FontIcon(Material2AL.LABEL);
icon.getStyleClass().addAll(stylesClass);
return icon;
}
}

92
styles/src/components/_label.scss
View File

@ -32,4 +32,94 @@
&.right-pill {
-fx-background-radius: 0 cfg.$border-radius cfg.$border-radius 0, 0 cfg.$inner-border-radius cfg.$inner-border-radius 0;
}
}
&.accent {
-fx-text-fill: -color-accent-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-accent-fg;
-fx-fill: -color-accent-fg;
}
}
&.success {
-fx-text-fill: -color-success-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-success-fg;
-fx-fill: -color-success-fg;
}
}
&.warning {
-fx-text-fill: -color-warning-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-warning-fg;
-fx-fill: -color-warning-fg;
}
}
&.danger {
-fx-text-fill: -color-danger-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-danger-fg;
-fx-fill: -color-danger-fg;
}
}
&.text-muted {
-fx-text-fill: -color-fg-muted;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-fg-muted;
-fx-fill: -color-fg-muted;
}
}
&.text-subtle {
-fx-text-fill: -color-fg-subtle;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-fg-subtle;
-fx-fill: -color-fg-subtle;
}
}
&:accent {
-fx-text-fill: -color-accent-emphasis;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-accent-fg;
-fx-fill: -color-accent-fg;
}
}
&:success {
-fx-text-fill: -color-success-emphasis;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-success-fg;
-fx-fill: -color-success-fg;
}
}
&:warning {
-fx-text-fill: -color-warning-emphasis;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-warning-fg;
-fx-fill: -color-warning-fg;
}
}
&:danger {
-fx-text-fill: -color-danger-emphasis;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-danger-fg;
-fx-fill: -color-danger-fg;
}
}
}

48
styles/src/general/_text.scss
View File

@ -46,69 +46,21 @@ Text {
.text.accent {
-fx-fill: -color-accent-fg;
}
.label.accent {
-fx-text-fill: -color-accent-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-accent-fg;
-fx-fill: -color-accent-fg;
}
}
.text.success {
-fx-fill: -color-success-fg;
}
.label.success {
-fx-text-fill: -color-success-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-success-fg;
-fx-fill: -color-success-fg;
}
}
.text.warning {
-fx-fill: -color-warning-fg;
}
.label.warning {
-fx-text-fill: -color-warning-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-warning-fg;
-fx-fill: -color-warning-fg;
}
}
.text.danger {
-fx-fill: -color-danger-fg;
}
.label.danger {
-fx-text-fill: -color-danger-fg;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-danger-fg;
-fx-fill: -color-danger-fg;
}
}
.text-muted {
-fx-fill: -color-fg-muted;
}
.label.text-muted {
-fx-text-fill: -color-fg-muted;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-fg-muted;
-fx-fill: -color-fg-muted;
}
}
.text-subtle {
-fx-fill: -color-fg-subtle;
}
.label.text-subtle {
-fx-text-fill: -color-fg-subtle;
#{cfg.$font-icon-selector} {
-fx-icon-color: -color-fg-subtle;
-fx-fill: -color-fg-subtle;
}
}
// font weight
// JavaFX CSS parser recognizes all values, but JavaFX engine