JavaFX fxml-带有图标和文本的按钮

Question

我想包括使用FXML的图标和文本按钮。

我知道在FXML中，我可以用以下代码添加图像：

<ImageView id="boxImage" fitWidth="100" fitHeight="100">
  <image>
    <Image url="@/com/example/app/resources/icons/office.png" />
  </image>            
</ImageView>

但我想知道如何将其与按钮代码合并：

<Button text="DATE"/>

<Button text="INSTRUMENT" styleClass="">
    <graphic>
        <ImageView pickOnBounds="true" preserveRatio="true">
            <image>
                <Image url="/com/example/app/resources/icons/instrument.png" />
            </image>
        </ImageView>
    </graphic>
</Button>

Answer 1

您可以在fxml中执行类似的操作

<Button layoutX="104.0" layoutY="81.0" mnemonicParsing="false" text="Love&#10;Potion">
  <font>
    <Font size="30.0" />
  </font>
  <graphic>
    <ImageView fitHeight="150.0" fitWidth="200.0" pickOnBounds="true" preserveRatio="true">
      <image>
        <Image url="http://icons.iconarchive.com/icons/mirella-gabriele/fantasy-mediaeval/128/Poison-red-icon.png" />
      </image>
    </ImageView>
  </graphic>
</Button>

请参见这里仅使用FXML为JavaFX2按钮设置样式的示例--如何向按钮添加图像？

更新：如果您使用Java8