web-dev-qa-db-ja.com

FXMLプロジェクトで素晴らしいフォントを使用する方法（javafx）

プロジェクトで素晴らしいフォントfontを使用したいのですが、プロジェクトで素晴らしいフォントを使用する方法がわかりません。

いくつかの例を見つけましたが、fxmlでは使用できません。

font awesome javafx

Fxmlを使用してプロジェクトでそれを使用する方法のヘルプが必要です

ありがとうございました。

javajavafxjavafx-2javafx-8fxml
14
user3749316

これはあなたが必要としているものだと思います ControlFX フォントの素晴らしいサポートが含まれています。詳細は javadoc を参照してください（ただし、ある日テストしたところ、問題なく動作しました）

9
agonist_

Jens Detersのアプローチ を適用することで、FAアイコンを使用して達成しました。

彼のルーチンは、fxmlの宣言的な方法に反対する動的GUI構成を対象としています。それにもかかわらず、 his AwesomeIcon enumeration （FAのわかりやすい名前とUnicode文字をマッピングする）は、私の意図に完全に適合しています。

Main/appクラスのフォントを静的に読み込むことから始めます。

public class App extends Application {
    static {
        Font.loadFont(App.class.getResource("/font/fontawesome-webfont.ttf").toExternalForm(), 10);
    }

    @Override
    public void start(final Stage primaryStage) throws Exception {
        URL resource = getClass().getResource("/fxml/app.fxml");
        primaryStage.setScene(new Scene((Parent) FXMLLoader.load(resource), 500, 500));
        primaryStage.setTitle("FontAwesomeFX demo");
        primaryStage.show();
    }

    public static void main(String... args){
        launch(args);
    }
}

（FAアイコンを指定するために必要に応じて）fxmlでUnicode文字を使用することはできませんが、そのような値を持つ属性を動的に設定することはできます。したがって、上記の列挙（AwesomeIcon）があるため、作業は完了しました。

  1. インポート：

    <?import de.jensd.fx.fontawesome.AwesomeIcon?>

  2. ノード：

    <Label styleClass="awesome"
       style="-fx-font-family: FontAwesome; -fx-font-size: 16.0;">
    <text><AwesomeIcon fx:constant="FILE"/></text>
</Label>

2つのプロパティを持つコードの量を再開するために、Icon Widget/Control/Componentを実装することになります。

  1. value：FAアイコン名;
  2. size：スタイルのスタイル可能な属性-fx-font-sizeラベル。

新しいコード（同じ効果）：

<Icon value="FILE" size="16"/>

そのコントロールのコードは here にあります。フォントとテストコードが含まれているため、実際に動作する例も見つけることができます。

14
Nuno Rafael Figueiredo

Mike Penzが開発したAndroid-IconicsライブラリをFXに移植しました。アップデートはすぐに続きます（ドキュメントも）。

Showcase.jarは、アイコンの概要を示します。

使用法（Java 1.8が必要）：

FxIconicsLabel labelTextDefault =
                (FxIconicsLabel) new FxIconicsLabel.Builder(FxFontGoogleMaterial.Icons.gmd_folder_special)
                        .size(24)
                        .text("Right (default)")
                        .color(MaterialColor.ORANGE_500)
                        .build();

（またはDialogPlayGround.Javaを参照）

FitIconics on GitHub

enter image description hereenter image description here

6
Martin Pfeffer

SceneBuilder を使用する場合は、これを試してください。

  • まず 'fontawesomefx' をダウンロードします。
  • 次に、SceneBuilderのJar/FXML Managerを使用して、jarをSceneBuilderにインポートします。
  • 3番目に、FontAwesomeIconView、GlyphCheckBox、MaterialDesignIconView、MaterialIconView、またはWeatherIconViewのライブラリ検索

FXMLの例：

<?xml version="1.0" encoding="UTF-8"?>

<?import de.jensd.fx.glyphs.control.GlyphCheckBox?>
<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
<?import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIconView?>
<?import de.jensd.fx.glyphs.materialicons.MaterialIconView?>
<?import de.jensd.fx.glyphs.weathericons.WeatherIconView?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>


<StackPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <VBox maxHeight="-Infinity" maxWidth="-Infinity">
         <children>
            <Label text="FontAwesomeIconView">
               <graphic>
                  <FontAwesomeIconView />
               </graphic>
            </Label>
            <Label text="GlyphCheckBox">
               <graphic>
                  <GlyphCheckBox />
               </graphic>
            </Label>
            <Label text="MaterialDesignIconView">
               <graphic>
                  <MaterialDesignIconView />
               </graphic>
            </Label>
            <Label text="MaterialIconView">
               <graphic>
                  <MaterialIconView />
               </graphic>
            </Label>
            <Label text="WeatherIconView">
               <graphic>
                  <WeatherIconView />
               </graphic>
            </Label>
         </children>
      </VBox>
   </children>
</StackPane>

enter image description here

これらのjarをプロジェクトのクラスパスに追加することを忘れないでください！

4
Sedrick

@Sedrickによると、次のように fontawesomefx ライブラリを使用してFXMLで使用できます。

注：JavaFX 8およびFontAwesomeFx v8.9

dashboard.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane xmlns="http://javafx.com/javafx/8.0.121" 
    xmlns:fx="http://javafx.com/fxml/1"
    fx:controller="com.example.DashboardController" 
    prefHeight="760" prefWidth="1080">

    <Button text="Close" AnchorPane.topAnchor="0" AnchorPane.leftAnchor="0">
        <graphic>
            <FontAwesomeIconView glyphName="CLOSE" glyphSize="24"/>
        </graphic>
    </Button>

</AnchorPane>

シーンビルダーでは以下のようになります： screenshot of iconised button

3
Omkar

Scene Builderで.jarファイルを使用して fontawesomefx ライブラリを使用でき、 Fontawesome-fx Glyph browser で使用可能なすべてのアイコンを参照できます

1
Amine ABBAOUI