From 0f8b23be9155b786eecd98ffe18683aefdfe3aeb Mon Sep 17 00:00:00 2001 From: Timi Date: Fri, 26 Jun 2026 18:00:15 +0800 Subject: [PATCH] fix css var --- .../ui/components/SegmentedButtonGroup.java | 365 ------------------ .../components/SegmentedButtonGroupSkin.java | 86 ----- src/main/resources/timifx/style/base.css | 31 +- .../style/components/date-time-picker.css | 5 +- .../timifx/style/components/hyperlink.css | 3 +- .../timifx/style/components/icon-button.css | 1 + .../style/components/label-progress-bar.css | 1 + .../timifx/style/components/navigation.css | 3 +- .../style/components/progress-slider.css | 1 + .../components/segmented-button-group.css | 38 -- .../style/components/selectable-label.css | 1 + .../timifx/style/components/tab-pane.css | 1 + .../style/components/text-area-editor.css | 3 +- .../timifx/style/components/time-picker.css | 5 +- .../timifx/style/components/toggle-icon.css | 1 + .../timifx/style/components/tray-menu.css | 1 + src/main/resources/timifx/style/controls.css | 16 +- src/main/resources/timifx/style/font.css | 1 + src/main/resources/timifx/style/layout.css | 1 + src/main/resources/timifx/style/style.css | 2 + src/main/resources/timifx/style/utility.css | 42 +- .../imyeyu/fx/ui/examples/view/ViewMain.java | 8 +- 22 files changed, 84 insertions(+), 532 deletions(-) delete mode 100644 src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroup.java delete mode 100644 src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroupSkin.java delete mode 100644 src/main/resources/timifx/style/components/segmented-button-group.css diff --git a/src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroup.java b/src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroup.java deleted file mode 100644 index 1d9481e..0000000 --- a/src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroup.java +++ /dev/null @@ -1,365 +0,0 @@ -package com.imyeyu.fx.ui.components; - -import com.imyeyu.fx.ui.TimiFXUI; -import javafx.beans.property.*; -import javafx.collections.FXCollections; -import javafx.collections.ListChangeListener; -import javafx.collections.ObservableList; -import javafx.geometry.Pos; -import javafx.scene.control.Control; -import javafx.scene.control.Skin; -import javafx.scene.control.ToggleButton; -import javafx.scene.control.ToggleGroup; - -/** - * 分段按钮组组件，使用单选模式组织多个切换按钮 - * - * @author 夜雨 - * @since 2026-06-25 - */ -public class SegmentedButtonGroup extends Control { - - /** 根样式 */ - public static final String STYLE_CLASS = "segmented-button-group"; - - /** 按钮容器样式 */ - public static final String STYLE_CLASS_BOX = "segmented-button-group-box"; - - /** 按钮样式 */ - public static final String STYLE_CLASS_BUTTON = "segmented-button-group-button"; - - /** 首按钮样式 */ - public static final String STYLE_CLASS_FIRST = "first"; - - /** 中间按钮样式 */ - public static final String STYLE_CLASS_MIDDLE = "middle"; - - /** 末按钮样式 */ - public static final String STYLE_CLASS_LAST = "last"; - - /** 单按钮样式 */ - public static final String STYLE_CLASS_SINGLE = "single"; - - /** 按钮列表 */ - private final ObservableList buttons; - - /** 按钮组 */ - private final ToggleGroup toggleGroup; - - /** 当前选中按钮 */ - private final ReadOnlyObjectWrapper selectedButton; - - /** 当前选中下标 */ - private final IntegerProperty selectedIndex; - - /** 按钮间距 */ - private final DoubleProperty spacing; - - /** 布局对齐方式 */ - private final ObjectProperty alignment; - - /** true 为允许清空选中 */ - private final BooleanProperty allowClearSelection; - - /** - * 默认构造器 - */ - public SegmentedButtonGroup() { - buttons = FXCollections.observableArrayList(); - toggleGroup = new ToggleGroup(); - selectedButton = new ReadOnlyObjectWrapper<>(); - selectedIndex = new SimpleIntegerProperty(-1); - spacing = new SimpleDoubleProperty(); - alignment = new SimpleObjectProperty<>(Pos.CENTER_LEFT); - allowClearSelection = new SimpleBooleanProperty(); - - getStyleClass().add(STYLE_CLASS); - setFocusTraversable(false); - - initSelectionSync(); - initButtonsListener(); - } - - /** - * 初始化选中同步 - */ - private void initSelectionSync() { - toggleGroup.selectedToggleProperty().addListener((obs, o, toggle) -> { - if (toggle instanceof ToggleButton button) { - selectedButton.set(button); - selectedIndex.set(buttons.indexOf(button)); - return; - } - selectedButton.set(null); - selectedIndex.set(-1); - }); - selectedIndex.addListener((obs, o, newIndex) -> { - int index = newIndex == null ? -1 : newIndex.intValue(); - if (index < 0) { - if (isAllowClearSelection()) { - toggleGroup.selectToggle(null); - } - return; - } - if (index < buttons.size()) { - toggleGroup.selectToggle(buttons.get(index)); - } - }); - } - - /** - * 初始化按钮监听 - */ - private void initButtonsListener() { - buttons.addListener((ListChangeListener) change -> { - while (change.next()) { - if (change.wasRemoved()) { - for (ToggleButton button : change.getRemoved()) { - detachButton(button); - } - } - if (change.wasAdded()) { - for (ToggleButton button : change.getAddedSubList()) { - attachButton(button); - } - } - } - syncSelectionState(); - }); - } - - /** - * 挂载按钮到当前组件 - * - * @param button 按钮 - */ - private void attachButton(ToggleButton button) { - if (button == null) { - throw new IllegalArgumentException("button must not be null"); - } - button.setToggleGroup(toggleGroup); - button.addEventFilter(javafx.scene.input.MouseEvent.MOUSE_PRESSED, SegmentedButtonGroupSkin.EVENT_KEEP_SELECTED); - } - - /** - * 卸载按钮 - * - * @param button 按钮 - */ - private void detachButton(ToggleButton button) { - button.removeEventFilter(javafx.scene.input.MouseEvent.MOUSE_PRESSED, SegmentedButtonGroupSkin.EVENT_KEEP_SELECTED); - if (button.getToggleGroup() == toggleGroup) { - button.setToggleGroup(null); - } - } - - /** - * 同步当前选中状态 - */ - private void syncSelectionState() { - ToggleButton currentSelectedButton = getSelectedButton(); - if (currentSelectedButton != null && !buttons.contains(currentSelectedButton)) { - if (isAllowClearSelection()) { - toggleGroup.selectToggle(null); - } else if (!buttons.isEmpty()) { - toggleGroup.selectToggle(buttons.getFirst()); - } - return; - } - int index = selectedIndex.get(); - if (index < 0 || buttons.size() <= index) { - if (!buttons.isEmpty() && !isAllowClearSelection() && toggleGroup.getSelectedToggle() == null) { - toggleGroup.selectToggle(buttons.getFirst()); - } - return; - } - toggleGroup.selectToggle(buttons.get(index)); - } - - @Override - protected Skin createDefaultSkin() { - return new SegmentedButtonGroupSkin(this); - } - - @Override - public String getUserAgentStylesheet() { - return SegmentedButtonGroup.class.getResource(TimiFXUI.RESOURCE + "style/components/segmented-button-group.css").toExternalForm(); - } - - /** - * 获取按钮列表 - * - * @return 按钮列表 - */ - public ObservableList getButtons() { - return buttons; - } - - /** - * 添加按钮 - * - * @param buttons 按钮列表 - */ - public void addButton(ToggleButton... buttons) { - getButtons().addAll(buttons); - } - - /** - * 添加文本按钮 - * - * @param text 按钮文本 - * @return 新增按钮 - */ - public ToggleButton addButton(String text) { - ToggleButton button = new ToggleButton(text); - getButtons().add(button); - return button; - } - - /** - * 设置当前选中按钮 - * - * @param button 当前选中按钮 - */ - public void setSelectedButton(ToggleButton button) { - if (button == null) { - if (isAllowClearSelection()) { - toggleGroup.selectToggle(null); - } - return; - } - if (!buttons.contains(button)) { - throw new IllegalArgumentException("button must belong to current group"); - } - toggleGroup.selectToggle(button); - } - - /** - * 获取当前选中按钮 - * - * @return 当前选中按钮 - */ - public ToggleButton getSelectedButton() { - return selectedButton.get(); - } - - /** - * 获取当前选中按钮属性 - * - * @return 当前选中按钮属性 - */ - public ReadOnlyObjectProperty selectedButtonProperty() { - return selectedButton.getReadOnlyProperty(); - } - - /** - * 设置当前选中下标 - * - * @param selectedIndex 当前选中下标 - */ - public void setSelectedIndex(int selectedIndex) { - this.selectedIndex.set(selectedIndex); - } - - /** - * 获取当前选中下标 - * - * @return 当前选中下标 - */ - public int getSelectedIndex() { - return selectedIndex.get(); - } - - /** - * 获取当前选中下标属性 - * - * @return 当前选中下标属性 - */ - public IntegerProperty selectedIndexProperty() { - return selectedIndex; - } - - /** - * 设置按钮间距 - * - * @param spacing 按钮间距 - */ - public void setSpacing(double spacing) { - this.spacing.set(Math.max(0, spacing)); - } - - /** - * 获取按钮间距 - * - * @return 按钮间距 - */ - public double getSpacing() { - return spacing.get(); - } - - /** - * 获取按钮间距属性 - * - * @return 按钮间距属性 - */ - public DoubleProperty spacingProperty() { - return spacing; - } - - /** - * 设置布局对齐方式 - * - * @param alignment 布局对齐方式 - */ - public void setAlignment(Pos alignment) { - this.alignment.set(alignment); - } - - /** - * 获取布局对齐方式 - * - * @return 布局对齐方式 - */ - public Pos getAlignment() { - return alignment.get(); - } - - /** - * 获取布局对齐方式属性 - * - * @return 布局对齐方式属性 - */ - public ObjectProperty alignmentProperty() { - return alignment; - } - - /** - * 设置是否允许清空选中 - * - * @param allowClearSelection true 为允许清空选中 - */ - public void setAllowClearSelection(boolean allowClearSelection) { - this.allowClearSelection.set(allowClearSelection); - if (!allowClearSelection && toggleGroup.getSelectedToggle() == null && !buttons.isEmpty()) { - toggleGroup.selectToggle(buttons.getFirst()); - } - } - - /** - * 获取是否允许清空选中 - * - * @return true 为允许清空选中 - */ - public boolean isAllowClearSelection() { - return allowClearSelection.get(); - } - - /** - * 获取是否允许清空选中属性 - * - * @return 是否允许清空选中属性 - */ - public BooleanProperty allowClearSelectionProperty() { - return allowClearSelection; - } -} diff --git a/src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroupSkin.java b/src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroupSkin.java deleted file mode 100644 index 7c8330a..0000000 --- a/src/main/java/com/imyeyu/fx/ui/components/SegmentedButtonGroupSkin.java +++ /dev/null @@ -1,86 +0,0 @@ -package com.imyeyu.fx.ui.components; - -import javafx.collections.ListChangeListener; -import javafx.scene.control.SkinBase; -import javafx.scene.control.ToggleButton; -import javafx.scene.input.MouseEvent; -import javafx.scene.layout.HBox; - -/** - * 分段按钮组皮肤 - * - * @author 夜雨 - * @since 2026-06-25 - */ -public class SegmentedButtonGroupSkin extends SkinBase { - - /** 保持当前选中状态 */ - static final javafx.event.EventHandler EVENT_KEEP_SELECTED = event -> { - if (event.getSource() instanceof ToggleButton button && button.isSelected()) { - event.consume(); - } - }; - - /** 按钮容器 */ - private final HBox box; - - /** - * 构造按钮组皮肤 - * - * @param control 按钮组控件 - */ - public SegmentedButtonGroupSkin(SegmentedButtonGroup control) { - super(control); - - box = new HBox(); - box.getStyleClass().add(SegmentedButtonGroup.STYLE_CLASS_BOX); - box.spacingProperty().bind(control.spacingProperty()); - box.alignmentProperty().bind(control.alignmentProperty()); - - getChildren().add(box); - - rebuildButtons(); - control.getButtons().addListener((ListChangeListener) change -> rebuildButtons()); - } - - /** - * 重建按钮结构 - */ - private void rebuildButtons() { - box.getChildren().setAll(getSkinnable().getButtons()); - syncButtonStyleClass(); - } - - /** - * 同步按钮样式 - */ - private void syncButtonStyleClass() { - int size = getSkinnable().getButtons().size(); - for (int i = 0; i < size; i++) { - ToggleButton button = getSkinnable().getButtons().get(i); - button.setMaxWidth(Double.MAX_VALUE); - button.getStyleClass().removeAll( - SegmentedButtonGroup.STYLE_CLASS_BUTTON, - SegmentedButtonGroup.STYLE_CLASS_FIRST, - SegmentedButtonGroup.STYLE_CLASS_MIDDLE, - SegmentedButtonGroup.STYLE_CLASS_LAST, - SegmentedButtonGroup.STYLE_CLASS_SINGLE - ); - button.getStyleClass().add(SegmentedButtonGroup.STYLE_CLASS_BUTTON); - - if (size == 1) { - button.getStyleClass().add(SegmentedButtonGroup.STYLE_CLASS_SINGLE); - continue; - } - if (i == 0) { - button.getStyleClass().add(SegmentedButtonGroup.STYLE_CLASS_FIRST); - continue; - } - if (i == size - 1) { - button.getStyleClass().add(SegmentedButtonGroup.STYLE_CLASS_LAST); - continue; - } - button.getStyleClass().add(SegmentedButtonGroup.STYLE_CLASS_MIDDLE); - } - } -} diff --git a/src/main/resources/timifx/style/base.css b/src/main/resources/timifx/style/base.css index 678bb74..bf0b1af 100644 --- a/src/main/resources/timifx/style/base.css +++ b/src/main/resources/timifx/style/base.css @@ -30,9 +30,30 @@ -fx-font-smoothing-type: gray; } .root { - -timi-fx-color: #177CB0; - -timi-fx-icon-color: #333; - -timi-fx-border-color: #B5B5B5; + -timi-fx-white-color: #FFF; + -timi-fx-red-color: #F30; + -timi-fx-brown-color: #A67D7B; + -timi-fx-black-color: #000; + -timi-fx-orange-color: #F60; + -timi-fx-yellow-color: #FF0; + -timi-fx-green-color: #393; + -timi-fx-dark-green-color: #373; + -timi-fx-gray-color: #666; + -timi-fx-blue-color: #008DCB; + -timi-fx-light-blue-color: #DDEAF0; + -timi-fx-gray-white-color: #F4F4F4; + -timi-fx-light-gray-color: #B5B5B5; + -timi-fx-dark-gray-color: #333; + -timi-fx-pink-color: #FF7A9B; + -timi-fx-transparent: transparent; + -timi-fx-focused-default-color: #177CB0; + -timi-fx-focused-light-color: #55B0DF; + -timi-fx-focused-dark-color: #0B6C9E; + -timi-fx-icon-disabled-color: #939393; + + -timi-fx-color: -timi-fx-focused-default-color; + -timi-fx-icon-color: -timi-fx-dark-gray-color; + -timi-fx-border-color: -timi-fx-light-gray-color; -timi-fx-popup-shadow: dropshadow(three-pass-box, rgba(0, 0, 0, .3), 5, 0, 0, 1); -timi-fx-opacity-hover: .7; -timi-fx-selected-color: #7CC4FF; @@ -45,7 +66,7 @@ -fx-faint-focus-color: transparent; -fx-shadow-highlight-color: transparent; -fx-cell-focus-inner-border: transparent; - -fx-control-inner-background: #FFF; + -fx-control-inner-background: -timi-fx-white-color; } /* --------------------------- 聚焦边距 --------------------------- */ .text-area:focused, @@ -64,5 +85,5 @@ /* --------------------------- 只读 --------------------------- */ .text-area:readonly, .text-field:readonly { - -fx-text-fill: #666; + -fx-text-fill: -timi-fx-gray-color; } diff --git a/src/main/resources/timifx/style/components/date-time-picker.css b/src/main/resources/timifx/style/components/date-time-picker.css index a8f6c67..751a30d 100644 --- a/src/main/resources/timifx/style/components/date-time-picker.css +++ b/src/main/resources/timifx/style/components/date-time-picker.css @@ -4,7 +4,7 @@ .date-time-picker-time-pane { -fx-border-width: 0 0 0 1; -fx-border-color: -timi-fx-border-color; - -fx-background-color: #F4F4F4; + -fx-background-color: -timi-fx-gray-white-color; -fx-translate-y: -1; -fx-effect: dropshadow(three-pass-box, rgba(0, 0, 0, .25), 4, 0, 0, 1); } @@ -15,5 +15,6 @@ -fx-alignment: center-right; } .date-time-picker-clear { - -fx-background-color: #F4F4F4; + -fx-background-color: -timi-fx-gray-white-color; } + diff --git a/src/main/resources/timifx/style/components/hyperlink.css b/src/main/resources/timifx/style/components/hyperlink.css index 43b4e78..3e8eab0 100644 --- a/src/main/resources/timifx/style/components/hyperlink.css +++ b/src/main/resources/timifx/style/components/hyperlink.css @@ -1,6 +1,7 @@ .x-hyperlink { - -fx-text-fill: #177CB0; + -fx-text-fill: -timi-fx-focused-default-color; } .x-hyperlink:hover { -fx-underline: true; } + diff --git a/src/main/resources/timifx/style/components/icon-button.css b/src/main/resources/timifx/style/components/icon-button.css index 3515714..d508a99 100644 --- a/src/main/resources/timifx/style/components/icon-button.css +++ b/src/main/resources/timifx/style/components/icon-button.css @@ -2,3 +2,4 @@ -fx-border-width: 1; -fx-border-color: transparent; } + diff --git a/src/main/resources/timifx/style/components/label-progress-bar.css b/src/main/resources/timifx/style/components/label-progress-bar.css index 7d432ba..a5e03d8 100644 --- a/src/main/resources/timifx/style/components/label-progress-bar.css +++ b/src/main/resources/timifx/style/components/label-progress-bar.css @@ -4,3 +4,4 @@ .label-progress-bar:indeterminate .bar { -fx-background-color: linear-gradient(to left, transparent, #7ACAF4); } + diff --git a/src/main/resources/timifx/style/components/navigation.css b/src/main/resources/timifx/style/components/navigation.css index 23ab7c7..afedbda 100644 --- a/src/main/resources/timifx/style/components/navigation.css +++ b/src/main/resources/timifx/style/components/navigation.css @@ -14,7 +14,7 @@ -fx-background-color: #CCC; } .navigation .navigation-button:selected { - -fx-text-fill: #FFF; + -fx-text-fill: -timi-fx-white-color; -fx-background-color: -timi-fx-color; } .navigation .navigation-button:disabled { @@ -31,3 +31,4 @@ .group-pane .content { -fx-padding: 0; } + diff --git a/src/main/resources/timifx/style/components/progress-slider.css b/src/main/resources/timifx/style/components/progress-slider.css index 26870ba..e419ea8 100644 --- a/src/main/resources/timifx/style/components/progress-slider.css +++ b/src/main/resources/timifx/style/components/progress-slider.css @@ -5,3 +5,4 @@ -fx-pref-height: 6; -fx-background-insets: 0; } + diff --git a/src/main/resources/timifx/style/components/segmented-button-group.css b/src/main/resources/timifx/style/components/segmented-button-group.css deleted file mode 100644 index 062adf6..0000000 --- a/src/main/resources/timifx/style/components/segmented-button-group.css +++ /dev/null @@ -1,38 +0,0 @@ -.segmented-button-group { - -fx-skin: "com.imyeyu.fx.ui.components.SegmentedButtonGroupSkin"; -} -.segmented-button-group .segmented-button-group-box { - -fx-spacing: 0; - -fx-alignment: center-left; -} -.segmented-button-group .segmented-button-group-button { - -fx-background-radius: 0; - -fx-border-radius: 0; - -fx-border-width: 1 1 1 0; - -fx-padding: .333333em 1em; /* 4 12 */ - -fx-background-color: #FFF; -} -.segmented-button-group .segmented-button-group-button.first, -.segmented-button-group .segmented-button-group-button.single { - -fx-border-width: 1; -} -.segmented-button-group .segmented-button-group-button.single { - -fx-background-radius: .083333em; - -fx-border-radius: .083333em; -} -.segmented-button-group .segmented-button-group-button.first { - -fx-background-radius: .083333em 0 0 .083333em; - -fx-border-radius: .083333em 0 0 .083333em; -} -.segmented-button-group .segmented-button-group-button.last { - -fx-background-radius: 0 .083333em .083333em 0; - -fx-border-radius: 0 .083333em .083333em 0; -} -.segmented-button-group .segmented-button-group-button:hover { - -fx-background-color: #F4F9FC; -} -.segmented-button-group .segmented-button-group-button:selected { - -fx-background-color: -timi-fx-color; - -fx-border-color: -timi-fx-color; - -fx-text-fill: #FFF; -} diff --git a/src/main/resources/timifx/style/components/selectable-label.css b/src/main/resources/timifx/style/components/selectable-label.css index a58e48a..4e7e546 100644 --- a/src/main/resources/timifx/style/components/selectable-label.css +++ b/src/main/resources/timifx/style/components/selectable-label.css @@ -5,3 +5,4 @@ -fx-hbar-policy: never; -fx-vbar-policy: never; } + diff --git a/src/main/resources/timifx/style/components/tab-pane.css b/src/main/resources/timifx/style/components/tab-pane.css index c0c1b22..1cc298f 100644 --- a/src/main/resources/timifx/style/components/tab-pane.css +++ b/src/main/resources/timifx/style/components/tab-pane.css @@ -33,3 +33,4 @@ .tab-pane:top > .tab-header-area { -fx-padding: 0; } + diff --git a/src/main/resources/timifx/style/components/text-area-editor.css b/src/main/resources/timifx/style/components/text-area-editor.css index f699771..a905cc2 100644 --- a/src/main/resources/timifx/style/components/text-area-editor.css +++ b/src/main/resources/timifx/style/components/text-area-editor.css @@ -1,7 +1,8 @@ .text-area-editor .find-field { - -fx-background-color: #FFF; + -fx-background-color: -timi-fx-white-color; -fx-background-insets: 0; } .text-area-editor .replace-field { -fx-padding: .25em .333333em .25em 1.25em; /* 3 4 3 15 */ } + diff --git a/src/main/resources/timifx/style/components/time-picker.css b/src/main/resources/timifx/style/components/time-picker.css index b1e7aa5..183f88b 100644 --- a/src/main/resources/timifx/style/components/time-picker.css +++ b/src/main/resources/timifx/style/components/time-picker.css @@ -1,11 +1,11 @@ .time-picker .text-field:readonly { - -fx-text-fill: #666; + -fx-text-fill: -timi-fx-gray-color; } .time-picker-popup { -fx-effect: dropshadow(three-pass-box, rgba(0, 0, 0, .3), 5, 0, 0, 1); -fx-border-width: 1; -fx-border-color: -timi-fx-border-color; - -fx-background-color: #F4F4F4; + -fx-background-color: -timi-fx-gray-white-color; } .time-picker-time-box { -fx-spacing: 0; @@ -13,3 +13,4 @@ .time-picker-now { -fx-alignment: center-right; } + diff --git a/src/main/resources/timifx/style/components/toggle-icon.css b/src/main/resources/timifx/style/components/toggle-icon.css index b8ffb7d..3c7d0f9 100644 --- a/src/main/resources/timifx/style/components/toggle-icon.css +++ b/src/main/resources/timifx/style/components/toggle-icon.css @@ -4,3 +4,4 @@ .toggle-icon:disabled .icon { -fx-opacity: -timi-fx-opacity-disabled; } + diff --git a/src/main/resources/timifx/style/components/tray-menu.css b/src/main/resources/timifx/style/components/tray-menu.css index 53311ab..e3bd9dd 100644 --- a/src/main/resources/timifx/style/components/tray-menu.css +++ b/src/main/resources/timifx/style/components/tray-menu.css @@ -1,3 +1,4 @@ .tray-menu { -fx-border-width: 0; } + diff --git a/src/main/resources/timifx/style/controls.css b/src/main/resources/timifx/style/controls.css index 583b118..433307d 100644 --- a/src/main/resources/timifx/style/controls.css +++ b/src/main/resources/timifx/style/controls.css @@ -9,6 +9,7 @@ } .toggle-button { -fx-padding: .25em .833333em; /* 3 10 */ + -fx-pref-height: 26; -fx-border-width: 1; -fx-border-color: -timi-fx-border-color; -fx-background-color: transparent; @@ -114,7 +115,7 @@ .combo-box .text-input, .date-picker .text-input { -fx-padding: 4; - -fx-background-color: -fx-text-box-border, #FFF; + -fx-background-color: -fx-text-box-border, -timi-fx-white-color; -fx-background-insets: 0, 0 1 0 0; -fx-background-radius: 0; } @@ -150,7 +151,7 @@ -fx-padding: 0; -fx-translate-y: -1; -fx-border-width: 1 1 0 1; - -fx-background-color: -timi-fx-border-color, #FFF; + -fx-background-color: -timi-fx-border-color, -timi-fx-white-color; -fx-background-insets: 0, 0 0 1 0; } .combo-box .combo-box-popup .list-view .list-cell { @@ -158,12 +159,12 @@ -fx-background-color: transparent; } .combo-box .combo-box-popup .list-view .list-cell:filled:hover { - -fx-text-fill: #FFF; + -fx-text-fill: -timi-fx-white-color; -fx-background-color: -timi-fx-color; } .combo-box .combo-box-popup .list-view .list-cell:filled:selected, .combo-box .combo-box-popup .list-view .list-cell:filled:selected:hover { - -fx-text-fill: #FFF; + -fx-text-fill: -timi-fx-white-color; -fx-background-color: -timi-fx-color; } .combo-box .combo-box-popup .list-view .scroll-bar:vertical { @@ -201,14 +202,14 @@ -fx-padding: 0; -fx-border-width: 1; -fx-border-color: -timi-fx-border-color; - -fx-background-color: #FFF; + -fx-background-color: -timi-fx-white-color; -fx-background-insets: 0; } .context-menu .menu-item:focused { -fx-background-color: -timi-fx-selected-color; } .context-menu .menu-item:focused .label { - -fx-text-fill: #333; + -fx-text-fill: -timi-fx-dark-gray-color; } .context-menu .separator { -fx-padding: 0; @@ -391,7 +392,7 @@ -fx-padding: 0; -fx-border-width: 2 0 0 0; -fx-border-color: -timi-fx-border-color; - -fx-background-color: #FFF; + -fx-background-color: -timi-fx-white-color; -fx-background-insets: 0; } .titled-group .titled-pane { @@ -424,3 +425,4 @@ -fx-pref-height: 1; -fx-background-color: -timi-fx-border-color; } + diff --git a/src/main/resources/timifx/style/font.css b/src/main/resources/timifx/style/font.css index d17127f..6de88f0 100644 --- a/src/main/resources/timifx/style/font.css +++ b/src/main/resources/timifx/style/font.css @@ -15,6 +15,7 @@ .text-area, .text-field, .list-view > *, +.toggle-button, .table-view > *, .minecraft-ae { -fx-font-size: 16; diff --git a/src/main/resources/timifx/style/layout.css b/src/main/resources/timifx/style/layout.css index c0b0a5d..8e3f19f 100644 --- a/src/main/resources/timifx/style/layout.css +++ b/src/main/resources/timifx/style/layout.css @@ -11,3 +11,4 @@ -fx-background-color: transparent; -fx-background-insets: 0; } + diff --git a/src/main/resources/timifx/style/style.css b/src/main/resources/timifx/style/style.css index 600fb31..d2788b3 100644 --- a/src/main/resources/timifx/style/style.css +++ b/src/main/resources/timifx/style/style.css @@ -2,3 +2,5 @@ @import "controls.css"; @import "layout.css"; @import "utility.css"; + +@import "components/radio-button-group.css"; diff --git a/src/main/resources/timifx/style/utility.css b/src/main/resources/timifx/style/utility.css index 80a89d2..28ac644 100644 --- a/src/main/resources/timifx/style/utility.css +++ b/src/main/resources/timifx/style/utility.css @@ -5,13 +5,13 @@ -fx-background-insets: 0; } .bg-white { - -fx-background-color: #FFF; + -fx-background-color: -timi-fx-white-color; } .bg-black { - -fx-background-color: #000; + -fx-background-color: -timi-fx-black-color; } .bg-default { - -fx-background-color: #F4F4F4; + -fx-background-color: -timi-fx-gray-white-color; } .bg-button-static { -fx-border-color: -timi-fx-border-color; @@ -67,7 +67,7 @@ -fx-border-width: .083333em .083333em .083333em 0; /* 1 1 1 0 */ } .editable-table .table-row-cell .text-field { - -fx-background-color: -timi-fx-color, #FFF; + -fx-background-color: -timi-fx-color, -timi-fx-white-color; -fx-background-insets: 0, 0; } .editable-table .table-row-cell .text-field:focused { @@ -77,52 +77,52 @@ -fx-padding: 0; } .white { - -fx-text-fill: #FFF; + -fx-text-fill: -timi-fx-white-color; } .red { - -fx-text-fill: #F30; + -fx-text-fill: -timi-fx-red-color; } .brown { - -fx-text-fill: #A67D7B; + -fx-text-fill: -timi-fx-brown-color; } .black { - -fx-text-fill: #000; + -fx-text-fill: -timi-fx-black-color; } .orange { - -fx-text-fill: #F60; + -fx-text-fill: -timi-fx-orange-color; } .yellow { - -fx-text-fill: #FF0; + -fx-text-fill: -timi-fx-yellow-color; } .green { - -fx-text-fill: #393; + -fx-text-fill: -timi-fx-green-color; } .dark-green { - -fx-text-fill: #373; + -fx-text-fill: -timi-fx-dark-green-color; } .gray { - -fx-text-fill: #666; + -fx-text-fill: -timi-fx-gray-color; } .blue { - -fx-text-fill: #008DCB; + -fx-text-fill: -timi-fx-blue-color; } .light-blue { - -fx-text-fill: #DDEAF0; + -fx-text-fill: -timi-fx-light-blue-color; } .gray-white { - -fx-text-fill: #F4F4F4; + -fx-text-fill: -timi-fx-gray-white-color; } .light-gray { - -fx-text-fill: #B5B5B5; + -fx-text-fill: -timi-fx-light-gray-color; } .dark-gray { - -fx-text-fill: #333; + -fx-text-fill: -timi-fx-dark-gray-color; } .pink { - -fx-text-fill: #FF7A9B; + -fx-text-fill: -timi-fx-pink-color; } .transparent { - -fx-text-fill: #FFFFFF00; + -fx-text-fill: -timi-fx-transparent; } .border-all { -fx-border-width: 1; @@ -172,3 +172,5 @@ .border-lr { -fx-border-width: 0 1 0 1; } + + diff --git a/src/test/java/com/imyeyu/fx/ui/examples/view/ViewMain.java b/src/test/java/com/imyeyu/fx/ui/examples/view/ViewMain.java index 930a647..d71b65c 100644 --- a/src/test/java/com/imyeyu/fx/ui/examples/view/ViewMain.java +++ b/src/test/java/com/imyeyu/fx/ui/examples/view/ViewMain.java @@ -1,14 +1,14 @@ package com.imyeyu.fx.ui.examples.view; +import com.imyeyu.fx.ui.TimiFXUI; +import com.imyeyu.fx.ui.examples.bean.Config; +import com.imyeyu.fx.ui.examples.component.RootLayout; +import com.imyeyu.inject.annotation.Inject; import javafx.application.Application; import javafx.scene.PerspectiveCamera; import javafx.scene.Scene; import javafx.scene.image.Image; import javafx.stage.Stage; -import com.imyeyu.fx.ui.TimiFXUI; -import com.imyeyu.fx.ui.examples.bean.Config; -import com.imyeyu.fx.ui.examples.component.RootLayout; -import com.imyeyu.inject.annotation.Inject; /** * 主界面