Question

我遇到了一些问题。所以我有一个自定义上下文菜单validation-error-context和相应的css：

#validation-error-context
{
    -fx-background-color: #ffbbbb;  
    -fx-border-color: #f00; 
}

在此上下文中，我还想设置MenuItem的样式，以便将以下css应用于它们：

#error-menu-item
{
    -fx-background-color: #ffbbbb;  
}

.error-menu-item:focused
{
    -fx-background-color: #ffbbbb;
    -fx-text-fill: red;
}

这一切都按计划进行，项目和上下文都有红色背景和边框。现在问题是当我想在MenuItem的聚焦状态上设置文本填充颜色时，传统上通过以下方式完成：

.menu-item:focused .label 
{
  -fx-text-fill: red;
}

然而，这显然会将该样式应用于项目中的所有menuItem，这不是我想要的，并且使用下面的语句对我正在使用的实例不起作用。

.error-menu-item:focused .label 
{
    -fx-text-fill: red;
}

有没有办法通过css或代码设置焦点标签的文本填充属性？我甚至不确定它是否可能，但是在正确方向上的任何指针都将非常受欢迎。

Answer 1

只要您将错误设置为css Classes而不是ID，您的代码就可以运行：（＃）

使用您的代码查看最小的可编译示例：

<强> MenuController.java

import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.MenuButton;
import javafx.scene.control.MenuItem;
public class MenuController implements Initializable {
    @FXML private MenuButton OkMenu;
    @FXML private MenuItem foo1;
    @FXML private MenuItem bar2;
    @Override
    public void initialize(URL arg0, ResourceBundle arg1) {
        //Define foo1 and bar 2 as errors:
        foo1.getStyleClass().add("error-menu-item");
        bar2.getStyleClass().add("error-menu-item");
    }
}

Main.java ＆lt; - 只需加载css和FXML

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("menu.fxml"));
        Scene scene = new Scene(root);
        scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
        stage.setScene(scene);
        stage.setTitle("Menu");
        stage.show();

    }
    public static void main(String[] args) {
        launch(args);
    }
}

<强>的style.css

.error-menu-item
{
    -fx-background-color: #ffbbbb;  
}

.error-menu-item:focused .label
{
    -fx-text-fill: red;
}

<强> menu.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="MenuController">
<children><MenuButton layoutX="0.37109375" layoutY="7.5" mnemonicParsing="false" text="FooMenu">
  <items>
    <MenuItem fx:id="foo1" mnemonicParsing="false" text="Foo1" />
    <MenuItem fx:id="foo2" mnemonicParsing="false" text="Foo2" /><MenuItem fx:id="foo3" mnemonicParsing="false" text="Foo3" />
  </items>
</MenuButton><MenuButton layoutX="99.7421875" layoutY="7.5" mnemonicParsing="false" text="BarMenu">
  <items>
    <MenuItem fx:id="bar1" mnemonicParsing="false" text="Bar1" />
    <MenuItem fx:id="bar2" mnemonicParsing="false" text="Bar2" /><MenuItem fx:id="bar3" mnemonicParsing="false" text="Bar3" />
  </items>
</MenuButton>
</children>

您可以在Gist上下载此代码。

MenuItem聚焦标签JavaFX上的CSS样式

1 个答案: