Uploaded image for project: 'JDK'
  1. JDK
  2. JDK-8120643

ComboBox .list-view / .list-cell styles are not loaded from css (RT-28916 Related)

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Duplicate
    • Icon: P5 P5
    • None
    • 8
    • javafx
    • None
    • Windows 7 32 and 64 bits, Red Hat 6.3 64 bits
      Java 8 b79

      ComboBox styles for list-cell and list-view are not loaded.

      You must set a CellFactory where you can not use style class (RT-28936).

      Attached test Class

      ---ComboBoxTest.java

      package es.indra.ifocucs.hmi.components.test.header;

      import javafx.application.Application;
      import javafx.collections.FXCollections;
      import javafx.collections.ObservableList;
      import javafx.event.EventHandler;
      import javafx.fxml.FXMLLoader;
      import javafx.fxml.JavaFXBuilderFactory;
      import javafx.scene.Scene;
      import javafx.scene.control.ComboBox;
      import javafx.scene.control.ContentDisplay;
      import javafx.scene.control.Label;
      import javafx.scene.control.ListCell;
      import javafx.scene.control.ListView;
      import javafx.scene.effect.DropShadow;
      import javafx.scene.input.MouseEvent;
      import javafx.scene.layout.AnchorPane;
      import javafx.scene.layout.Background;
      import javafx.scene.layout.BackgroundFill;
      import javafx.scene.paint.Color;
      import javafx.stage.Stage;
      import javafx.util.Callback;

      public class ComboBoxTest extends Application {

      private AnchorPane root = new AnchorPane();

      @Override
      public void start(Stage primaryStage) {

      root.setPrefSize(200, 200);
      root.setStyle("-fx-background-color:#ffffff;");

      ObservableList<String> list = FXCollections.observableArrayList("First","Second","Third","Fourth","Fifth");

      ComboBox<String> comboBox = new ComboBox<String>(list);
      comboBox.setId("my-combo");
      comboBox.getStyleClass().add("my-combo");
      comboBox.getSelectionModel().selectFirst();
      comboBox.setLayoutX(50);
      comboBox.setLayoutY(50);
      //comboBox.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {
      //@Override
      //public ListCell<String> call(ListView<String> p) {
      //p.setPrefHeight(130);
      //p.setPrefWidth(110);
      //p.setStyle("-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E); " +
      //"-fx-border-width:1 1 1 1; -fx-border-color:#C4D019; " +
      //"-fx-border-radius: 5 5 5 5; -fx-background-radius:5 5 5 5; " +
      //"-fx-font-family:Arial; -fx-font-size:14px; -fx-text-fill: #FFFFFF;" +
      //"-fx-graphic:url('imgcab_cmbperfil.png');");
      //
      //
      //return new ListCell<String>() {
      //{
      //setStyle("-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E); " +
      //"-fx-border-width:1px 0px 0px 0px; -fx-border-color:#9E9E9E;" +
      //"-fx-font-family:Arial; -fx-font-size:14px; -fx-text-fill: #FFFFFF;" +
      //"-fx-graphic:url('imgcab_cmbperfil.png');");
      //
      //setOnMouseEntered(new EventHandler<MouseEvent>() {
      //@Override public void handle(MouseEvent mouseEvent) {
      //if (!isSelected())
      //setStyle("-fx-background-color: linear-gradient(to bottom,#C4D019, #586f25); " +
      //"-fx-font-family:Arial; -fx-font-size:14px; -fx-text-fill: #FFFFFF;");
      //}
      //});
      //
      //setOnMouseExited(new EventHandler<MouseEvent>() {
      //@Override public void handle(MouseEvent mouseEvent) {
      //if (!isSelected())
      //setStyle("-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E); " +
      //"-fx-font-family:Arial; -fx-font-size:14px; -fx-text-fill: #FFFFFF;");
      //}
      //});
      //}
      //
      //@Override
      //public void updateSelected(boolean selected)
      //{
      //if (selected)
      //{
      ////setStyle("-fx-background-color: linear-gradient(to bottom,#C4D019, #586F25); -fx-graphic:url('imgcab_cmbperfil.png'); " +
      ////"-fx-graphic-text-gap:10;");
      //
      // getStyleClass().add("selectedLabel");
      //}
      //else
      //{
      //setStyle("-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E); -fx-label-padding:0px 0px 0px 0px;" +
      //"-fx-font-family:Arial; -fx-font-size:14px; -fx-text-fill: #FFFFFF;");
      //}
      //super.updateSelected(selected);
      //}
      //
      //@Override
      //protected void updateItem(String item, boolean empty)
      //{
      //super.updateItem(item, empty);
      //setText(item);
      //}
      //
      //};
      //}
      //});

      root.setStyle("-fx-background-color: #FF0000;");
      root.getChildren().add(comboBox);

      Scene scene = new Scene(root);
      String cssURL = getClass().getResource("combo-box.css").toExternalForm();
      scene.getStylesheets().add(cssURL);

      primaryStage.setScene(scene);
      primaryStage.show();
      }

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




      ----combo-box.css

      #my-combo{
      -fx-background-color: linear-gradient(to bottom,#5C5C5C, #1C1C1C);
          -fx-border-color: #FFFFFF;
          -fx-border-width: 1 1 1 1;
          -fx-border-radius: 5 5 5 5;
          -fx-padding:0 0 0 10;
      }

      #my-combo:hover{
      -fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
      -fx-border-color:#C4D019;
      }

      #my-combo .arrow-button{
      -fx-background-color: linear-gradient(to bottom,#5C5C5C, #1C1C1C);
      -fx-padding:11 10 10 10;
      -fx-background-radius: 5 5 5 5;
      -fx-border-width:0 0 0 1;
          -fx-border-color:#222323;
      }


      #my-combo .arrow-button:hover{
      -fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
      }

      #my-combo .arrow-button .arrow{
      -fx-background-color: #FFFFFF;
      }

      #my-combo .list-cell {
        -fx-font-family:Arial;
        -fx-font-size: 14px;
        -fx-text-fill: #FFFFFF;
      }

      .comboLabel{
      -fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
      -fx-border-width:1 1 1 1;
      -fx-border-color:#C4D019;
      -fx-border-radius: 5 5 5 5;
      -fx-background-radius:5 5 5 5;
      -fx-font-family:Arial;
      -fx-font-size:14px;
      -fx-text-fill: #FFFFFF;
      }

      .selectedLabel{
      -fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
      -fx-graphic:url('imgcab_cmbperfil.png');
      -fx-graphic-text-gap:10;
      }


      #my-combo .list-view{
      -fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
      -fx-border-width:1 1 1 1;
          -fx-border-color:#C4D019;
          -fx-border-radius: 5 5 5 5;
          -fx-background-radius:5 5 5 5;
      }


      #my-combo .list-view .list-cell {
        -fx-background-color: rgba(0,0,0,0);
        -fx-font-family:Arial;
      -fx-font-size:14px;
      -fx-text-fill: #FFFFFF;
      -fx-border-width:1px 0px 0px 0px;
      -fx-border-color:#9E9E9E;
      }

       
      #my-combo .list-view .list-cell:hover
      {
      -fx-background-color: linear-gradient(to bottom,#C4D019, #586f25);
      }


      #my-combo .list-view .list-cell.profile-cell:selected {
        -fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
         -fx-graphic:url("imgcab_cmbperfil.png");
        -fx-graphic-text-gap:10;
      }

      #my-combo .list-view .list-cell.workspaces-cell:selected {
        -fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
         /* -fx-graphic:url("imgcab_wspace.png");
         
        -fx-graphic-text-gap:10;*/
          -fx-background-image:url("imgcab_wspace.png");
        -fx-background-repeat: no-repeat;
        -fx-label-padding:0px 0px 0px 30px;
        -fx-background-position:10;

      }

            jgiles Jonathan Giles
            rruizjfx Ricardo Ruiz (Inactive)
            Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

              Created:
              Updated:
              Resolved:
              Imported: