JavaFX - style CSS listview

Question

J'ai un ListView et que vous souhaitez les suivantes:

• lignes impaires avec la couleur de fond blanc; ListView: lorsque vous passez la souris sur un élément, mettez en surbrillance avec une nuance bleue; ListView: lorsqu'un élément est sélectionné, peignez-le avec un dégradé; ListView: lorsque le focus est perdu dans ListView, l'élément sélectionné doit être peint avec dégradé; ListView: tous les éléments commencent par du texte noir. Mais à la souris et/ou sélectionné, il deviendra blanc.

C'est mon code. Cela fonctionne bien, sauf pour les lignes paires: sur la souris, elle est surlignée en blanc. Donc, le texte est blanc et ne peut pas être montré. Qu'est ce qui ne va pas avec ça?

.list-cell:filled:selected:focused, .list-cell:filled:selected { 
    -fx-background-color: linear-gradient(#328BDB 0%, #207BCF 25%, #1973C9 75%, #0A65BF 100%); 
    -fx-text-fill: white; 
} 

.list-cell:odd { 
    -fx-cell-hover-color: #0093ff; 
    -fx-background-color: white; 
} 

.list-cell:filled:hover { 
    -fx-cell-hover-color: #0093ff; 
    -fx-text-fill: white; 
} 

Merci d'avance.

Answer 1

EDIT:

changer légèrement votre css:

.list-cell:filled:selected:focused, .list-cell:filled:selected { 
    -fx-background-color: linear-gradient(#328BDB 0%, #207BCF 25%, #1973C9 75%, #0A65BF 100%); 
    -fx-text-fill: white; 
} 

.list-cell:even { /* <=== changed to even */ 
    -fx-background-color: white; 
} 

.list-cell:filled:hover { 
    -fx-background-color: #0093ff; 
    -fx-text-fill: white; 
} 

Ce produit css la présentation suivante:

Est-ce que cela donne ce que vous attendez? J'ai changé odd en even. La première cellule est paire, car sa valeur d'index est 0 (zéro). De plus, -fx-cell-hover-color n'est pas valide. Je l'ai changé à -fx-background-color où nécessaire ou l'enlevé.

---

Texte original: (notez que cela a une interprétation différente des pairs/impairs)

Mon opinion serait la suivante:.
(I inclus vos besoins dans une liste numérotée de référence dans le css I a également fait le gradient plus évident et a ajouté un fond vert pour les cellules même)

/* 
1. Odd rows with white background color; 
2. ListView: when mouse over an item, highlight with a blue shade; 
3. ListView: when an item is selected, paint it with a gradient; 
4. ListView: when focus is lost from ListView, selected item should be painted with gradient; 
5. ListView: all items will start with text-fill black. But on mouse over and/or selected it will change to white. 
*/ 

.list-cell:filled:selected:focused, .list-cell:filled:selected { 
    /* 3:, 4: */ 
    -fx-background-color: linear-gradient(#333 0%, #777 25%, #aaa 75%, #eee 100%); 
    -fx-text-fill: white; /* 5 */ 
} 
.list-cell { -fx-text-fill: black; /* 5 */ } 
.list-cell:odd { -fx-background-color: white; /* 1 */ } 
.list-cell:even { -fx-background-color: #8f8; /* for information */ } 
.list-cell:filled:hover { 
    -fx-background-color: #00f; /* 2 */ 
    -fx-text-fill: white; /* 5 */ 
} 

cela conduit à ce rendu.