#サンプルの紹介
JavaFXにはLabelというコンポーネントがあります。setStyle()メソッドを使い、このコンポーネントにJavaFX CSSを動的に適応するサンプルを作りました。ただし、JavaFX CSSはLabel特有のものに限りました。
Labelに適応できるJavaFX CSSは[JavaFX CSSリファレンス・ガイド](https://docs.oracle.com/javase/jp/8/javafx/api/javafx/scene/doc-files/cssref.html"JavaFX CSSリファレンス・ガイド")で調べました。
今回作ったアプリケーションは以下のような画面です。
コンボボックスでJavaFX CSSのプロパティを選択できます。
今回作ったアプリケーションは以下のgithubリポジトリに載せました。
#適応例
以下、JavaFX CSSを適応してみた感想です。
##-fx-alignment
centerにすると上下左右の中央になります。
baseline-[ center | left | right ]は[ center | left | right ]とそれぞれ同じでした。他はプロパティ名から想像できる配置通りです。
###center
##-fx-text-alignment
[ left | center | right | justify ]それぞれ変化がありませんでした。
##-fx-text-overrun
ellipsisという単語が含まれるプロパティでは省略の仕方が変わります。clipは省略しません。Labelを含むBorderの領域も変化しました。
###center-ellipsis
###center-word-ellipsis
###clip
###ellipsis
###leading-ellipsis
###leading-word-ellipsis
###word-ellipsis
##-fx-wrap-text
trueにするとテキストが省略されなくなりました。
###true
###false
##-fx-underline
trueにすると、アンダーラインがテキストに引かれます。
###true
###false
##-fx-label-padding
パディングの量が変わります。
##-fx-text-fill
テキストの色が変わります。線形グラデーション、放射状グラデーションを指定することもできます。
###linear-gradient(to bottom right, red, black);
###radial-gradient(radius 100%, red, darkgray, black);
##-fx-ellipsis-string
省略記号を指定できます。
##-fx-font-family
これはシステム依存です。monospaceの変化が分かりやすかったです。
###serif
###sans-serif
###cursive
###fantasy
###monospace
##-fx-font-size
フォントの大きさです。
##-fx-font-style
以下のプロパティ名を指定できます。
- normal
- italic
- oblique
しかし、変化しませんでした。
##-fx-font-weight
normalとlighter、boldとbolderは区別がつきませんでした。
###normal
###bold
###bolder
###lighter
##-fx-graphic、-fx-graphic-text-gap、-fx-content-display
- -fx-graphicで画像を選択できます
- -fx-graphic-text-gapで画像とテキストの間の幅を調節できます。
- -fx-content-displayでテキストに対する画像の位置を設定できます。
