美文网首页
JavaFX自定义样式的正确引用

JavaFX自定义样式的正确引用

作者: 陶然然_niit | 来源:发表于2018-11-21 17:10 被阅读0次

JavaFX提供了布局(fxml)和样式(css)分离的特性,那么,我们如何在Java代码和布局文件中分别使用样式表来美化自己的组件呢?以一个圆角按钮效果为例,方法如下:

1.在css文件中定义样式

注意:一般来说,样式命名,使用"-"符号

.border-button{
    /*文本颜色*/
    -fx-text-fill:#FFFFFF;
    /*字体大小*/
    -fx-font-size: 14px;
    /*背景色*/
    -fx-background-color: rgb(234, 111, 90);
     /*设置圆角效果*/
    -fx-border-radius: 25;
    -fx-background-radius: 25;
    /*合适大小*/
    -fx-pref-width: 120px;
    -fx-pref-height: 35px;
}

2.在布局文件中引用样式,并使用<graphic>标签添加图标

<Button text="圆角按钮" styleClass="border-button">
            <graphic>
                <ImageView>
                    <Image url="/img/pen.png"/>
                </ImageView>
            </graphic>
  </Button>

3.在Java代码中引用样式

   Button myButton = new Button("圆角按钮");
   myButton.getStyleClass().add("border-button");
   myButton.setGraphic(new ImageView(new Image("/img/pen.png")));

4.运行效果

效果

相关文章

网友评论

      本文标题:JavaFX自定义样式的正确引用

      本文链接:https://www.haomeiwen.com/subject/whbcqqtx.html