私はjavaとjavafxを使って素敵な小さなアプリケーションを作って、最近CSSでスタイルを作成し始めました。別のテーマ（黄色、青色など）を持っていると思っていましたが、これを行うには良い方法がないと分かりました。私が何かを変えたいと思ったら、単に変数の値を変更するだけですが、CSSでは可能だとは思いません。だから私の質問には、アプリケーション内のボタンをクリックするだけでテーマを変更する最善の方法はありますか？私は心配していますか？テーマごとに別のスタイルシートを作成し、スタイルシートを切り替える必要がありますか？何か助けてくれてありがとう。CSSテーマを変更する
は、私はあなたが必要なものを行うには、2つの方法を知っています。 2.メインコンテナからのルックアンドフィールを変更するクラスを変更します。
第一の方法：変更のcssリンク
あなたが唯一の色のみに変更される2つのCSSファイルを作成する必要があります。
ライブ例：http://seantheme.com/color-admin-v1.9/admin/html/index_v2.html
カラーテーマコントローラを表示するには、設定アイコン（COG）をクリックします。
第二の方法：あなたがメインのコンテナに追加されます一つのクラス.redまたは.red-themeを使用する必要があり、あなたがウェブサイトのための3色のテーマを持っているとしましょうメインの容器に
をクラスを追加します。その下のすべてのセレクタの色が変わります。
EX：私は明確な答えのために生きてテストを行ったが、私はそれがステータスだに応じて変化します情報とボックスのコンテキスト状態を使用しますので、私たちは.warning、.infoと.success状態と定期を持っていますそのクラスは.post-wrapperです。
/* General Classes
* First we will give theme bases that include padding, margin, font-size
* or default colors, etc.
*/
.post-wrapper{ /* Regular theme */
padding: 15px;
margin-bottom: 30px;
border: 1px solid #ccc;
box-shadow: 2px 2px 2px rgba(0,0,0, 0.2);
border-radius: 5px;
}
そして、私たちのHTMLは次のようになります。
/* CSS THEMES
* Here we will set every color that will change with our current state.
* It could change colors, widths, font-sizes, :hover, or anything that we need
* to be changed.
*/
.warning{
color: #9A2C2C;
background-color: #FFE2E2;
border-color: #9A2C2C;
}
.info{
color: #2D5E7D;
background-color: #CEEAF1;
border-color: #2D5E7D;
}
.success{
color: #2D7D36;
background-color: #CEF1D2;
border-color: #2D7D36;
}
そして、私たちのHTMLは、状態に応じて変化します：
<article class="post-wrapper">
...
</article>
その後、我々は我々のカラーテーマを設定し
<article class="post-wrapper info">
...
</article>
<article class="post-wrapper success">
...
</article>
<article class="post-wrapper warning">
...
</article>
ライブ元十分な：私は見つかっていないので、
が、私は2番目のオプションを好きで、より多くのそれを使用する必要があり： http://getbootstrap.com/css/#helper-classes-colors
結論：私はここにコンテキストの色を示し、ブートストラップの例を残してhttps://jsfiddle.net/xwazzo/Ls9f313g/2/
さまざまな色の複数のCSSファイルを簡単かつ迅速に作成し、ウェブサイトの重量をあまり大きくしない方法です。
あなたのスタイルシートに含まれるクラスの数が少なくて済み、KBが少なくて済みますので、第1の方法が最適です。
CSSスタイルシートについては、それらを置き換えることができますか？ CSSファイルを置き換えるだけで、別々のテーマを使用できますか？とにかく
、私はから想定するとあなたは、実行時にコンポーネントのスタイルを変更したい場合：
は、それは私が恐れているように、は、私は別のスタイルシートを作成しなければならないのですテーマごとに、スタイルシート間を切り替えますか？
実行時にすべてのコンポーネントのスタイルを変更できます。 JavaFXのすべてのオブジェクトは、Nodeから続きます。これは次にStyleableを実装します。これはあなたに複数のスタイリングオプションを与えます。
スタイルシート全体を変更したい場合は、シーンのスタイルシートを追加したり削除したりすることもできます。カラーテーマblue.cssにデフォルトのテーマdefault.cssから
1.-変更CSSのリンク：
JavaFX-CSSの正しいアプローチは、カラー変数（および派生/ラダー関数）を使用することです。デフォルトのカラー変数を
であなたのstyle.cssには、次のようになります。
.button {
-fx-background-color: my-button-background-color;
}
そして、あなたのテーマ-default.cssは、次のようになり
.root {
my-button-background-color: #f00;
}
そして、あなたのテーマblue.cssは、次のようになります。あなたがテーマ-default.cssを削除するには、シンプルいただきたいテーマを反転したい場合
.root {
my-button-background-color: #00f;
}
Sceneから「blue.css」というテーマを追加してください（逆の場合は逆にする）。擬似コード：
Scene s = ...
s.getStylesheet().addAll("style.css", "theme-default.css");
// ...
button.setOnAction(e -> {
if(s.getStylesheet().contains("theme-default.css")) {
s.getStylesheet().remove("theme-default.css");
s.getStylesheet().add("theme-blue.css");
} else {
s.getStylesheet().remove("theme-blue.css");
s.getStylesheet().add("theme-default.css");
}
});