7

アイコンをイメージに変更したいのですが、CSS リファレンス ガイドを調べましたが、関連するものが見つからないようです。それは可能ですか?CSS を使用しているか、メインの JavaFX スクリプトから宣言的に使用しているかは問題ではありません。

4

4 に答える 4

8

このAudioPlayerでカスタムスライダーがどのようにレンダリングされるかのサンプルコードと画像を見てください。

また、インタラクティブなコントロールではなくフィードバックが必要な場合は、 JFXtrasライブラリに多数のゲージがあります。

これは、不変条件の答えによって指摘されたセレクターを使用したいくつかのサンプルcssです。画像全体を表示するには、画像の半分のサイズに-fx-padding仕様を追加する必要があることに注意してください。

/** slider.css
place in same directory as SliderCss.java
ensure build system copies the css file to the build output path */

.slider .thumb {
    -fx-background-image :url("http://icons.iconarchive.com/icons/double-j-design/diagram-free/128/piggy-bank-icon.png");   
    -fx-padding: 64;
}
/* Icon license: creative commons with attribution: http://www.doublejdesign.co.uk/products-page/icons/diagram */

サンプルアプリ:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;

public class SliderCss extends Application {
  public static void main(String[] args) { launch(args); }
  @Override public void start(Stage stage) throws Exception {
    VBox layout = new VBox();
    layout.setStyle("-fx-background-color: cornsilk; -fx-padding: 10px;");
    layout.getChildren().setAll(new Slider());
    layout.getStylesheets().add(getClass().getResource("slider.css").toExternalForm());
    stage.setScene(new Scene(layout));

    stage.show();
  }
}

サンプルプログラム出力:

貯金箱

于 2012-11-19T17:57:19.323 に答える
7

ここに画像の説明を入力

cssを使用してスライダーのつまみを変更できます

.slider .thumb{
 -fx-background-image :url("your image");   
 ...// more customization       
}
于 2012-11-19T19:00:29.733 に答える