
0、背景
最近做了一个基于ESP8266+1.3寸TFT液晶屏的WIFI小电视,其中图形界面都是使用TFT_eSPI库开发的,十分便捷,因为开发过程中需要使用显示中文,因此必须自定义适合的中文字库,这篇专栏主要是用来记录和分享如何使用TFT_eSPI库提供的示例来自定义中文字库。
1、安装Arduino及TFT_eSPI库
Arduino IDE安装资源及教程很多,这里不在重复说明。
安装完Arduino IDE后,依次点击 工具 -> 管理库 ->输入TFT_eSPI,即可安装TFT_eSPI库,安装完成之后,到Arduino的安装库的文件夹下,就可以找到TFT_eSPI。库函数的安装目录一般在这个路径中:C:\Users\Administrator\Documents\Arduino\libraries\TFT_eSPI

找到安装的库函数,在子文件夹中即可找到官方提供的自定义库函数的程序,路径如下:...TFT_eSPI\Tools\Create_Smooth_Font\Create_font

在这个目录下有3个文件
data : 存放我们的字体文件,用ttf结尾的,这个文件可在电脑自带系统找到,路径如下:C:\Windows\Fonts。找到喜欢的字体后将其复制到data文件夹下。

FontFiles : 存放我们制作出来的字库文件,制作出来后是vlw结尾的
Create_font.pde : 官方提供的示例程序,通过该程序来制作字库文件。
3、使用Processing创建字库
使用processing打开Create_font.pde文件(https://processing.org/ 下载processing软件,并且安装,下载速度较慢,可以在网络上找绿色安装包,我用的Processing3.5.4,和Arduino IDE几乎完全一样,就是换了颜色,哈哈)。只需修改几个地方就可以,如下所示:
...........
String fontName = "STXINGKA"; // Manually crop the filename length later after creation if needed//定义存放在data文件夹中的字体文件的文件名
// Note: SPIFFS does NOT accept underscore in a filename!
String fontType = ".ttf";//定义存放在data文件夹中的字体文件的后缀
//String fontType = ".otf";
// Define the font size in points for the TFT_eSPI font file
int fontSize = 50;//自定义字库的大小,中文应不低于16,太小了就模糊看不清了。
// Font size to use in the Processing sketch display window that pops up (can be different to above)
int displayFontSize = 50; //这个是程序运行后弹出对话框,输出字库里的所有字符。
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Next we specify which unicode blocks from the the Basic Multilingual Plane (BMP) are included in the final font file. //
// Note: The ttf/otf font file MAY NOT contain all possible Unicode characters, refer to the fonts online documentation. //
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
static final int[] unicodeBlocks = {//输如Unicode编码编码的起始码值和结束码值
// The list below has been created from the table here: https://en.wikipedia.org/wiki/Unicode_block
// Remove // at start of lines below to include that unicode block, different code ranges can also be specified by
// editting the start and end-of-range values. Multiple lines from the list below can be included, limited only by
// the final font file size!
//0x0021, 0x007E, //Basic Latin, 128, 128, Latin (52 characters), Common (76 characters)
};
// Here we specify particular individual Unicodes to be included (appended at end of selected range)
static final int[] specificUnicodes = {//输入需要生成字库的汉字的码值
0x64b8,0x8d77,0x8896,0x5b50,0x52a0,0x6cb9,0x5e72,0xff01//撸起袖子加油干!
}; 每个汉字对应的unicode码值可以通过在线转换工具获取,然后将转换后的/u替换为0x即可。
完成修改后,点击运行,弹出对话框显示自定义库中的所有字符,同时在FontFiles文件夹中生成一个STXINGKA50.vlw文件,存放我们制作出来的字库文件。

4、使用在线转换工具将将vlw文件转换成Arduin使用的字库文件
通过https://tomeko.net/online_tools/file_to_hex.php?lang=zh,将vlw文件转换成Arduin使用的字库文件xxxFont.h

将生成的16进制数据按照下列各式存放在font_50.h文件中
#include <pgmspace.h>
const uint8_t font_50[] PROGMEM = {
0x00, 0x00, 0x00, 0x08, 0x00, 0x00, 0x00, 0x0B, 0x00, 0x00, 0x00, 0x32, 0x00, 0x00, 0x00, 0x00,
0x00, 0x00, 0x00, 0x1D, 0x00, 0x00, 0x00, 0x0A, 0x00, 0x00, 0x52, 0xA0, 0x00, 0x00, 0x00, 0x1F,
0x00, 0x00, 0x00, 0x28, 0x00, 0x00, 0x00, 0x32, 0x00, 0x00, 0x00, 0x1F, 0x00, 0x00, 0x00, 0x02,
...
0x00, 0x00, 0x00, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x6C, 0xB9, 0x00, 0x00, 0x00, 0x26,
0x00, 0x00, 0x00, 0x25, 0x00, 0x00, 0x00, 0x32, 0x00, 0x00, 0x00, 0x20, 0x00, 0x00, 0x00, 0x07,
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x88, 0x96, 0x00, 0x00, 0x00, 0x26, 0x00, 0x00, 0x00, 0x29,
}; 5、应用实例
#include <TFT_eSPI.h>
#include "font_50.h"//字库
TFT_eSPI tft = TFT_eSPI(); // 引脚请自行配置tft_espi库中的 User_Setup.h文件
void setup()
{
//tft液晶屏初始化设置
tft.init();
tft.setRotation(0);
tft.fillScreen(0x0000);
tft.setTextColor(TFT_RED, TFT_BLUE);//红色汉字,蓝色背景
tft.loadFont(font_50); //指定tft屏幕对象载入font_50字库
tft.drawString("撸起袖子",0,100); //在坐标0,0位置输出汉字,就可以在tft显示出来了
tft.drawString("加油干!",0,150);
tft.unloadFont(); //释放字库文件,节省资源
}
void loop(){
while(1){
delay(2000);
}
} 显示效果如下:
