setstyle+java,javafx 2和css伪类:在setStyle方法中设置hover属性

I have a simple Scene with this code:

scene.getStylesheets().add("packagename/testcss.css");

And my testcss.css is:

.button {

-fx-background-color: #DDFFA4;

}

.button:hover {

-fx-background-color: #9ACD32;

}

What i achieve is the nice effect that is aka hover when in web applications.

RLe33.png ...

GE4t9.png

QUESTION

How can i achieve the same effect but without a separate css file, just via the setStyle method of my Button?

The problem is that setStyle accepts just the style definition and leave out the selector.

button.setStyle("-fx-background-color: #DDFFA4;");

The selector, in my hover case is the pseudo-class:

.button:hover

but where am I supposed to set it?

Moreover, the javadoc is explicit in excluding the selector from the setStyle method argument:

Note that, like the HTML style attribute, this variable contains style

properties and values and not the selector portion of a style rule.

解决方案

As you note in your question, as of JavaFX 2.2, the css pseudoclasses aren't exposed as part of the public API you can use for style manipulation inside Java code.

If you want to change style attributes from Java code without using a stylesheet, you need to set the styles based on events or changelisteners. There are a couple of options in the sample below.

import javafx.application.Application;

import javafx.beans.binding.*;

import javafx.beans.property.SimpleStringProperty;

import javafx.event.EventHandler;

import javafx.geometry.Pos;

import javafx.scene.*;

import javafx.scene.control.Button;

import javafx.scene.input.MouseEvent;

import javafx.scene.layout.*;

import javafx.stage.Stage;

/** Changing button styles on hover without a css stylesheet. */

public class ButtonBackgroundChanger extends Application {

private static final String STANDARD_BUTTON_STYLE = "-fx-background-color: #DDFFA4;";

private static final String HOVERED_BUTTON_STYLE = "-fx-background-color: #9ACD32;";

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

@Override public void start(final Stage stage) throws Exception {

Button configure = new Button("Configure");

changeBackgroundOnHoverUsingBinding(configure);

Button update = new Button("Update");

changeBackgroundOnHoverUsingEvents(update);

VBox layout = new VBox(10);

layout.setAlignment(Pos.CENTER);

layout.setStyle("-fx-padding: 10;");

layout.getChildren().addAll(configure, update);

stage.setScene(new Scene(layout));

stage.show();

}

private void changeBackgroundOnHoverUsingBinding(Node node) {

node.styleProperty().bind(

Bindings

.when(node.hoverProperty())

.then(

new SimpleStringProperty(HOVERED_BUTTON_STYLE)

)

.otherwise(

new SimpleStringProperty(STANDARD_BUTTON_STYLE)

)

);

}

public void changeBackgroundOnHoverUsingEvents(final Node node) {

node.setStyle(STANDARD_BUTTON_STYLE);

node.setOnMouseEntered(new EventHandler() {

@Override public void handle(MouseEvent mouseEvent) {

node.setStyle(HOVERED_BUTTON_STYLE);

}

});

node.setOnMouseExited(new EventHandler() {

@Override public void handle(MouseEvent mouseEvent) {

node.setStyle(STANDARD_BUTTON_STYLE);

}

});

}

}

I'd only really do it in code rather than a stylesheet if colors needed to be really dynamic making use of stylesheets with predefined colors and styles problematic, or if there was some other aversion to using css stylesheets.

In JavaFX 8 there is be a public API which allows you (if you want to) to manipulate Region background colors without use of CSS.

Sample program output (with the Update button hovered):

awHqs.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值