作為RIA技術(shù)之一，為了讓應(yīng)用程序的界面看起來更加的漂亮或者更有個(gè)性，皮膚功能自然是必不可少的。

在JavaFX中，可以使用CSS樣式表來進(jìn)行皮膚的更換。不過JavaFX中的CSS是基于W3C CSS version 2.1，但又不完全相同。

JavaFX中的換膚有幾種方式。

1.完全重新定義的控件樣式

我們首先創(chuàng)建一個(gè)CSS文件，命名為skin1.css，在里面定義一個(gè)Button的樣式。

.CustomButton{

-fx-background-color: #aaffff;

-fx-text-fill: #000000

}

如上所示，只是簡(jiǎn)單的改變背景色和文本顏色。

當(dāng)然大家很容易看出來，與標(biāo)準(zhǔn)的CSS相差不大。

那么，我們就在程序中使用一下看看效果。

新建一個(gè)JavaFX Project，寫下如下代碼。

public class Skintest extends Application {public static void main(String[] args) {

launch(args);

}

@Override

public void start(Stage primaryStage) {

primaryStage.setTitle("Test Skin in JavaFX");

final Button btn = new Button("I am a Button");StackPane root = new StackPane();

Scene scene = new Scene(root, 800, 600);

scene.getStylesheets().add("skin1.css");

btn.getStyleClass().add("CustomButton");

root.getChildren().add(btn);

primaryStage.setScene(scene);

primaryStage.show();

}

}

在程序只創(chuàng)建了一個(gè)Button。

首先通過Scene.getStylesheets().add(String str)方法進(jìn)行添加樣式。

然后使用button.getStyleClass().add(String str)方法讓Button應(yīng)用這個(gè)樣式。

右上圖可以看到，這個(gè)Button已經(jīng)與默認(rèn)的按鈕完全不一樣了。

下面我們?cè)趕kin1.css中，新添加一個(gè)Button的樣式,暫命名為CustomButton2。

.CustomButton2{

-fx-background-color: #000000;

-fx-text-fill: #FFFFFF

}

然后添加Button的事件，讓Button在點(diǎn)擊后，應(yīng)用這個(gè)樣式。

btn.setOnAction(new EventHandler() {

@Override

public void handle(ActionEvent event) {

btn.getStyleClass().add("CustomButton1");

}

});

記住如果在事件中使用控件，定義的時(shí)候必須定義為final類型。

那么，我們運(yùn)行之后，點(diǎn)擊Button看看。

如圖所示，點(diǎn)擊之后，Button應(yīng)用了新的樣式，變成了黑底白字了。

怎么樣？雖然只是簡(jiǎn)單的改變了背景色和文字色，但其實(shí)看起來效果還是不錯(cuò)的。

2.重寫控件的樣式

有的人會(huì)覺得，每個(gè)控件都設(shè)置一次樣式很麻煩，為何不能直接設(shè)置所有Button的樣式呢？當(dāng)然，JavaFX也提供這

個(gè)功能，我們只需要把上面的skin1.css中的.CustomButton改為.button，就會(huì)覆蓋Button控件的樣式。

那么我們更改為.button后，再添加一個(gè)Button看看運(yùn)行的效果。

你會(huì)發(fā)現(xiàn)，沒有單獨(dú)設(shè)置Button的樣式，但是將skin1.css添加進(jìn)Scene的StyleSheets中后，所有的Button樣式都改變了。

3.更改整個(gè)程序的樣式

同樣的，既然可以更改所有button的樣式，我們也可以進(jìn)行少許修改，就能更改整個(gè)應(yīng)用軟件的風(fēng)格了。

我們只需要添加.root的樣式即可。

.root{

-fx-font-size: 16pt;

-fx-base: rgb(255, 145, 47);

-fx-background: rgb(255, 255, 255);

}

然后往代碼中添加幾個(gè)其他的控件，運(yùn)行看看。

大家可以看到，整體的風(fēng)格都改變了。這也是更換主題的很方便的方法。

另外, CSS中有class styles 和id styles，同樣的JavaFX中也有。對(duì)于控件而言只需要setId()即可應(yīng)用idstyles。

OK，時(shí)間已經(jīng)很晚了，JavaFX的換膚功能就講到這里了。該睡覺去了。

總結(jié)

以上是生活随笔為你收集整理的java fx 皮肤_JavaFX 皮肤功能的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。