bet*_*man 2 css listview javafx-2
有没有办法在列表视图中更改选择栏文本颜色?最好使用CSS.在TableView中,您可以使用:
-fx-selection-bar-text: white;
Run Code Online (Sandbox Code Playgroud)
但这对ListView不起作用.
更新:使用CellFactories渲染单元格时会出现上述情况.
lvRooms.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {
@Override public ListCell<String> call(ListView<String> list) {
return new RoomCell();
}
});
Run Code Online (Sandbox Code Playgroud)
在Cell Factory类中,我很乐意介绍选择行时的情况.
但是:它在开始时只调用一次,而不是每次移动选择栏时,因此isSelected()方法总是呈现为false.
更新2:这是RoomCell实现:
class RoomCell extends ListCell<String> {
@Override
public void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
if (item != null) {
Log.debug("RoomCell called, item: "+item);
final Label lbl = new Label(item); // The room name will be displayed here
lbl.setFont(Font.font("Segoe UI", FontWeight.BOLD, 18));
lbl.setStyle("-fx-text-fill: black");
//lbl.setTextFill(isSelected()?Color.WHITE: Color.BLACK);
if (isSelected()) // This is always false :(
lbl.setStyle("-fx-text-fill: yellow");
if (Rooms.getBoolean(item, "OwnerStatus")) {
lbl.setEffect(new DropShadow(15, Color.BLUEVIOLET));
lbl.setGraphic(new ImageView(
new Image(getClass().getResourceAsStream("images/universal.png"))));
} else {
lbl.setGraphic(new ImageView(
new Image(getClass().getResourceAsStream("images/yin-yang.png"))));
lbl.setEffect(new DropShadow(15, Color.WHITE));
}
setGraphic(lbl);
}
}
}
Run Code Online (Sandbox Code Playgroud)
-fx-selection-bar-text是根默认CSS选择器中定义的调色板(不是css属性),它是选择器Scene.我不知道你是如何使用它的,但如果你定义它(全局,因为它是场景的选择器),如:
.root{
-fx-selection-bar-text: red;
}
Run Code Online (Sandbox Code Playgroud)
在你的CSS文件中,然后所有控件的css属性-fx-selection-bar-text都是红色的.ListView也会受到影响(请参阅下面的原始用法评论).
但是,如果您只想自定义ListView的样式,请以这种方式覆盖默认属性
(注意:仅-fx-text-fill覆盖.原始值已注释掉,-fx-selection-bar-text使用的位置):
/* When the list-cell is selected and focused */
.list-view:focused .list-cell:filled:focused:selected {
-fx-background-color: -fx-focus-color, -fx-cell-focus-inner-border, -fx-selection-bar;
-fx-background-insets: 0, 1, 2;
-fx-background: -fx-accent;
/* -fx-text-fill: -fx-selection-bar-text; */
-fx-text-fill: red;
}
/* When the list-cell is selected and selected-hovered but not focused.
Applied when the multiple items are selected but not focused */
.list-view:focused .list-cell:filled:selected, .list-view:focused .list-cell:filled:selected:hover {
-fx-background: -fx-accent;
-fx-background-color: -fx-selection-bar;
/* -fx-text-fill: -fx-selection-bar-text; */
-fx-text-fill: green;
}
/* When the list-cell is selected, focused and mouse hovered */
.list-view:focused .list-cell:filled:focused:selected:hover {
-fx-background: -fx-accent;
-fx-background-color: -fx-focus-color, -fx-cell-focus-inner-border, -fx-selection-bar;
-fx-background-insets: 0, 1, 2;
/* -fx-text-fill: -fx-selection-bar-text; */
-fx-text-fill: yellow;
}
Run Code Online (Sandbox Code Playgroud)
内置的caspian.css可以使用这些CSS属性和更多属性.
更新:我强烈建议您阅读Cell API.从那里
...我们仅使用极少数单元表示非常大的数据集.每个Cell都被"回收"或重复使用.
请注意,不同的String项可能使用相同的单元格,以误导性的视觉效果/渲染结束,就像isSelected()在代码中一样.此外,它在API中说
因为到目前为止,单元格最常见的用例是向用户显示文本,此用例专门针对Cell内部进行了优化.这是通过从Labeled扩展的Cell完成的.这意味着Cell的子类只需要设置text属性,而不是创建一个单独的Label并在Cell中设置它.
所以我重构你的代码如下.
class RoomCell extends ListCell<String> {
@Override
public void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
if (item != null) {
Log.debug("RoomCell called, item: "+item);
setFont(Font.font("Segoe UI", FontWeight.BOLD, 18));
ImageView iView = new ImageView();
if (Rooms.getBoolean(item, "OwnerStatus")) {
iView.setEffect(new DropShadow(15, Color.BLUEVIOLET));
iView.setImage(new Image(getClass().getResourceAsStream("images/universal.png")));
} else {
iView.setEffect(new DropShadow(15, Color.WHITE));
iView.setImage(new Image(getClass().getResourceAsStream("images/yin-yang.png")));
}
setGraphic(iView); // The image will be displayed here
setText(item); // The room name will be displayed here
}
}
}
Run Code Online (Sandbox Code Playgroud)
-fx-text-fill单元格文本的所有样式都将根据CSS文件中的定义进行更改.
现在这里是单元格的文本阴影效果和CSS文件的填充颜色之间的权衡:
- 如果你想使用阴影效果,你应该像当前的方式,即创建标签,设置其文本,给予dorpshadow效果label和setGraphic(标签).但是这次你不喜欢设置setText(item)单元格的text()因此CSS文件中的文本颜色样式将不起作用.
- 另一方面,如果您更喜欢我重构的代码,那么您应该通过将其设置为or 来禁用-fx-background-color单元格(扩展Labeled),并在CSS文件中设置to dropshadow以便能够将drophadow效果应用于直接发短信.清除单元格的背景不是IMO的首选方式.代码解释:transparentnull-fx-effect
Label lbl = new Label("This text will have a dropshadow on itself directly");
lbl.setEffect(new DropShadow(15, Color.BLUE));
Label another_lbl = new Label("This text will have a dropshadow applied on the background bounds, not to text");
another_lbl.setEffect(new DropShadow(15, Color.BLUE));
another_lbl.setStyle("-fx-background-color:gray");
Run Code Online (Sandbox Code Playgroud)
测试它们以查看差异.就这样.