web-dev-qa-db-ja.com

JavaFX CSSでの外部フォントの指定

JavaFXアプリケーションでCSSを使用してフォントを指定することは可能ですか？ FXMLシーンと対応するCSSファイルがあります。 Javaコードでは、setFontメソッドを使用してフォントを指定できます：

text.setFont(Font.loadFont("file:resources/fonts/SourceSansPro-Bold.ttf", 12));

私は次のようなさまざまな構造を試しました：

-fx-font-family: url("../fonts/SourceSansPro-Bold.ttf");

しかし、それは機能しません。

cssfontsjavafx
17
syscreat

あなたはソリューションに近かった：

-fx-font-family: 'Helvetica', Arial, sans-serif;

これを試してみてください。うまくいくはずです。

多分これは助けになるでしょうか？ （私はJavaFXの専門家ではありません）

https://forums.Oracle.com/forums/thread.jspa?messageID=10107625

[〜＃〜]編集[〜＃〜]：

フォントをロードします。

@font-face {
    font-family: Delicious;
    src: url('Delicious-Roman.otf');
}

-fx-でフォントを使用：

-fx-font-family: 'Delicious';
15
Andrea Turri

アプリケーションコードとCSSの組み合わせを使用して、外部フォントでスタイルを設定しています。

オーバーライドされたアプリケーションのinitメソッド内にloadFont呼び出しを配置し​​て、アプリケーションで何かが発生する前に呼び出されるようにします。

Font.loadFont(CustomFontTest.class.getResource("TRON.TTF").toExternalForm(), 10);

フォントを使用するには、CSSのフォントファミリーでフォントを参照します。

.menu-bar {
    -fx-background-color: transparent;
    -fx-font-family: TRON;
    -fx-font-size: 40px;
}

.context-menu {
    -fx-font-family: TRON;
    -fx-background-color: transparent;
    -fx-font-size: 12px;
}

CSSがフォントのサイズを適切に設定しているのは素晴らしいことです。フォントがサイズ10でロードされた場合でも、フォントはCSSで指定されたサイズに正しくサイズ変更されました-fx-font-size仕様。

アプリケーションの初期化中に読み込まれたFontを使用したCSSによるラベルのインラインスタイル設定も正常に機能します。

Label testControl = new Label("TRON");
testControl.setStyle("-fx-font-family: TRON; -fx-font-size: 120;");

TRON font はdafontからダウンロードされ、CustomFontTestクラスと同じディレクトリに配置され、ビルドシステムによってビルド出力ディレクトリにコピーされました。

"Using Custom Fonts" に関するフォーラム投稿への私の回答からコピーされた回答。

19
jewelsea

もう1つの詳細がわかりました。JavaFX-8では、同じフォントの通常の太字のバリアントが必要な場合は、@ font-faceの2つのインスタンスでそれらを指定できます。次に、-fx-font-weight：bold;を使用できます。

@font-face {
    font-family: 'Droid Sans';
    src: url('DroidSans.ttf');
}

@font-face {
    font-family: 'Droid Sans Bold';
    src: url('DroidSans-Bold.ttf');
}

.root {
    -fx-font-family: 'Droid Sans'; 
}

.table-row-cell:focused .text {
    -fx-font-weight: bold;
}
4
rli

JavaFx CSSフォント（.ttfをインポート）：

/* import fonts */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src: url("/fonts/OpenSans-Regular.ttf");
}
@font-face {
    font-family: "Open Sans Light";
    font-style: normal;
    font-weight: 300;
    src: url("/fonts/OpenSans-Light.ttf");
}
@font-face {
    font-family: "Open Sans Bold";
    font-style: normal;
    font-weight: 700;
    src: url("/fonts/OpenSans-Bold.ttf");
}
@font-face {
    font-family: "Open Sans ExtraBold";
    font-style: normal;
    font-weight: 900;
    src: url("/fonts/OpenSans-ExtraBold.ttf");
}

/* Set fonts */

.settings-name{
    -fx-font-size: 33px;
    -fx-font-family: "Open Sans Light";
    -fx-font-weight: 300;
    -fx-text-fill: #09f;
}

.settings-username{
    -fx-font-size: 19px;
    -fx-font-family: "Open Sans ExtraBold";
    -fx-font-weight: 900;
    -fx-text-fill: #09f;
}
1
FxMax

別の方法は、FileIUnputStreamを使用してフォントをロードすることです。したがって、cssを使用する必要はありません。

 @FXML
    private Label myLabel;

@Override
    public void initialize(URL arg0, ResourceBundle arg1){

Font myFont = null;

        try {
            myFont = Font.loadFont(new FileInputStream(new File("patch_to_font.ttf")), 10);
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        }

        myLabel.setFont(myFont);

}
1
RichardK