• JavaFx 使用字体图标记录


    本文为作者原创,允许转载,不过请在文章开头明显处注明链接和出处!!! 谢谢配合~
    作者:stars-one
    链接:https://www.cnblogs.com/stars-one/p/16793359.html

    本篇大约有2948个字,阅读预计需要3.69分钟


    原文:JavaFx 使用字体图标记录 - Stars-One的杂货小窝

    之前其实也是研究过关于字体图标的使用,还整了个库Tornadofx学习笔记(4)——IconTextFx开源库,整合5000+个字体图标 - Stars-one - 博客园

    由于之前并不是太过于讲解字体图标,最近又是抽空研究了一番

    介绍

    字体图标在JavaFx中的Label控件和Text控件进行使用,使用字体图标的好处:

    • 可以不用每次都需要图标的时候去拷贝图片到项目
    • 可以通过样式直接更改字体颜色从而实现更改图标颜色

    提供字体图标的网站有很多,比如阿里的iconfont-阿里巴巴矢量图标库

    比如另外的Remix IconRemix Icon - Open source icon library,里面的基础图标很全,推荐大家可以集成一下,ttf文件大小不到400KB

    我们以阿里巴巴矢量图标库来说明下使用方法

    使用

    1.下载图标文件

    使用github账号登录一下阿里巴巴矢量图标库,之后选择我们需要的图标,添加到购物车

    注意: 字体图标选用纯色的比较好

    之后点击购物车,可以查看自己选择的图标,选择添加到项目(如果没有项目,可以在之后弹窗中新建项目)

    之后可以查看我们的项目,从顶头的导航菜单进来(资源管理->我的项目),选择下载到本地

    之后你会得到一个压缩包,解压如下所示

    可以看到有个简单的html文件,这个文件我们可以打开,是用来预览图标,如下所示

    除此之外,我们还可以看到json文件,里面的内容实际上就是关于各图标的名称,unicode等数据,之后我们可以用到此份json文件

    ttf文件则是我们需要的字体文件,需要复制到我们项目中进行使用

    2.代码中使用

    我们将ttf文件复制到项目中,该如何使用呢?下面我按照两种语言进行简单说明

    Java

    //读取字体文件,第二个参数是字体大小
    Font font = Font.loadFont(getClass().getResourceAsStream("/ttf/icon.ttf"), 20.0);
    //某个图标的unicode
    char unicode = '\ue001';
    Text text = new Text();
    //设置字体和文字
    text.setFont(font);
    text.setText(Character.toString(unicode));
    //这里根据情况输入填写,主要就是修改颜色和字体
    text.setStyle("-fx-font-size:20px;-fx-fill:red;");
    

    上述代码中,unicode数据是怎么来的呢?各位通过html文件应该就能明白了,图标下面有所标明,我们需要把#$x给替换成了\u即可

    注意上面,我们的unicode是char类型的,在设置的时候使用了此方法Character.toString(unicode),将其转为了String类型,我们暂且将此结果称为unicode字体数据

    实际上,我们直接打印出来使不会有任何显示的,因为我们当前系统没有此unicode对应的字体

    但是,实际上,我们一般都是直接获取到一个String对象而不是一个char类型,如String s = "\\ue001",

    PS:双斜杠是因为需要转义,实际上变量s的内容为\ue001

    上面的变量s不是unicode字体数据,该如何转换呢?

    这里,可以使用commons-text库中的StringEscapeUtils工具类进行转换

    首先,是引用maven依赖

    
    <dependency>
        <groupId>org.apache.commonsgroupId>
        <artifactId>commons-textartifactId>
        <version>1.9version> 
    dependency>
    
    • StringEscapeUtils.unescapeJava() 将unicode形式的字符串转为unicode字体数据
    • StringEscapeUtils.escapeJava() 将unicode字体数据转为unicode形式的字符串,中文其实也算做unicode字体数据, 如中文的"我"得到的返回结果为\u6211 或者可以复制一些特殊表情也可以进行转换哦

    使用如下代码所示:

    //读取字体文件,第二个参数是字体大小
    Font font = Font.loadFont(getClass().getResourceAsStream("/ttf/iconfont.ttf"), 20.0);
    //某个图标的unicode
    String unicode = "\\ue001";
    Text text = new Text();
    //设置字体和文字
    text.setFont(font);
    text.setText(StringEscapeUtils.unescapeJava(unicode));
    //这里根据情况输入填写,主要就是修改颜色和字体
    text.setStyle("-fx-font-size:20px;-fx-fill:red;");
    

    Kotlin

    在Kotlin中,和Java不同,我们可以直接把char类型当成字符串String类型,如下代码所示:

    text {
        //第二个参数是字体大小
        font = loadFont("/font/iconfont.ttf", 25.0)!!
        //如果只有一个\,在Kotlin中就是字体数据
        text ="\ueDEF"
        style {
            fill = c("red")
        }
    }
    

    但是如果我们是动态读入的一个unicode数据,则是没法使用的,原因和上述说的一样,因为不是unicode字体数据,所以text控件会什么都不显示

    text {
        font = loadFont("/font/iconfont.ttf", 25.0)!!
        //两个斜杠,需要调用方法转为unicode字体数据
        text = StringEscapeUtils.unescapeJava("\\ueDEF")
        style {
            fill = c("red")
        }
    }
    

    补充

    最后,上述也是提到了,我们解压出来的字体目录下有一份json文件,实际上,我们可以将此份json数据也放在项目文件夹里

    在应用运行开始的时候读取,构建一个Map,key为名称,而value则是unicode字体数据

    之后我们需要用到的时候,可以直接根据名称从中拿去unicode字体数据直接显示

    参考

  • 相关阅读:
    开源作品:引流宝!集活码、短网址等功能为一体的工具!致力于提高引流效率,减少资源流失!
    配置VScode开发环境-CUDA编程
    浅谈设计模式-解释器模式
    字符串ASCLL排序 Java
    空域图像增强-图像滤波处理
    【Java】循环语句for、while、do-while
    鸿蒙(API 12 Beta3版)【音频解码】
    C++学习笔记总结练习:多态与虚函数
    公共命名空间中的依赖关系
    备战金九银十,java中高级核心知识全面解析,让你吊打面试官
  • 原文地址:https://www.cnblogs.com/stars-one/p/16793359.html