JavaFX - phong cách CSS listview

Question

Tôi có một ListView và muốn những điều sau:

• hàng Odd với màu nền trắng;
• Chế độ xem danh sách: khi di chuột qua một mục, đánh dấu bằng màu xanh lam;
• Chế độ xem danh sách: khi một mục được chọn, tô nó bằng một gradient;
• Chế độ xem danh sách: khi tiêu điểm bị mất khỏi ListView, mục được chọn sẽ được tô màu với độ dốc;
• Chế độ xem danh sách: tất cả các mục sẽ bắt đầu bằng màu đen điền văn bản. Nhưng trên chuột và/hoặc chọn nó sẽ chuyển sang màu trắng.

Đó là mã của tôi. Nó hoạt động tốt, ngoại trừ các hàng thậm chí: trên chuột, nó nổi bật bằng màu trắng. Vì vậy, văn bản của màu trắng và không thể được hiển thị. Có gì sai với nó?

.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; 
} 

Xin cảm ơn trước.

Answer 1

EDIT:

Hơi thay đổi css của bạn:

.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; 
} 

css này tạo ra trình bày sau:

Điều này cung cấp cho những gì bạn mong đợi?

Tôi đã thay đổi odd thành even. Ô đầu tiên là ngay cả vì giá trị chỉ mục của nó là 0 (không). Ngoài ra -fx-cell-hover-color không hợp lệ. Tôi đã đổi nó thành -fx-background-color nếu cần hoặc xóa nó.

---

gốc văn bản: (lưu ý rằng đây có giải thích khác nhau của chẵn/lẻ)

mất của tôi sẽ là: Tôi
(I bao gồm các yêu cầu của bạn trong một danh sách đánh số để tham khảo trong css. cũng làm gradient rõ ràng hơn và bổ sung thêm một nền màu xanh lá cây cho các tế bào thậm chí)

/* 
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 */ 
} 

Điều này dẫn đến vẽ này:.