單片機也可以輕松玩轉UTF-8碼和TTF字體了

【UTF-8碼簡介】

要讓智能設備支持各國不同的文字，首先得有支持全球文字的編碼集，時下最出名的要數UTF-8碼了。它一種可變長度字符編碼，使用1~4字節為每個字符編碼，由此它可以用來表示Unicode標準中的任何字符，而且仍與ASCII碼相兼容。

有了國際范的UTF-8碼，如果我們再有一個支持 UTF-8碼的字庫 ，那顯示各國的文字就很簡單了。接下來就講一下怎么制作一個支持UTF-8碼的字庫(當然這個并不是包含所有的字符，而是只覆蓋所需的就可以了)

【制作UTF-8碼字庫】

要制作字庫，肯定是要找一個現成的取模工具了（這種工具網上有很多），今天我們就使用Arm-2D提供的一個python小工具來制作UTF-8碼的字庫，下載最新的Arm-2D，你就會看到在Acceleration下有一個ttf2c.py文件，如下圖

有了這個工具，我們就看看怎么使用它來制作字庫文件。

【準備工作】

首先，你的電腦中要安裝了Python3，并且安裝了下面兩個軟件包（freetype-py和numpy）

pip install freetype-py

然后從網上或者電腦C:WindowsFonts文件夾下找到一個后綴名為TTF的字體文件，如下

【制作字庫】

接下來就用ttf2c.py制作字庫，它的使用在官方文檔中也有，如下

當然，你也可以用【-h】指令來查看它的使用方法，如下圖

• 我們使用的指令為：python3 ttf2c.py -h
• 【-i】為后綴TTF文件
• 【-t】為txt文件，里面為我們要生成字庫的所有字符
• 【-n】為我們生成的字庫起名字，可以不寫（默認為ARM_2D_FONT_UTF8）
• 【-o】就是輸出的字庫文件
• 【-p】為字體大?。ū热?0個像素、50個像素）
• 【-s】可以設置生成的字庫為A1、A2、A4、A8，（默認會生成所有的類型）。其中 A1所占的flash空間是最小的 ，A2、A4、A8還支持字體透明度哦。

好，那我們現在就用這個工具生成一個字庫試試，首先新建一個txt文件，輸入我們要生成字庫的所有字符，如下

在cc.txt文件中輸入的字符為“ 嵌入式小書蟲 ”，待會就會生成對應的字庫文件。

生成字庫的指令如下

此時就會生成字庫文件 qrsxsc.c ，如下圖

有了字庫文件，顯示字符就很簡單了。

【顯示UTF-8碼的文字】

使用Arm-2D來顯示自定義字庫中的文字也很簡單，首先聲明一下我們生成的字庫，以A8為例，如下

extern struct {

然后就可以使用這個字庫啦，很簡單，代碼如下

arm_lcd_text_set_font(&ARM_2D_FONT_UTF8_A8);

• 第1行就是設置我們的字庫
• 第2行為設置字符顯示的區域，NULL為整個屏幕
• 第3行為設置字體顏色
• 第4行為設置在第幾行第幾列進行顯示字符
• 第5行為設置字體的透明度
• 最后調用arm_lcd_printf函數就可以了

注意： 此時，把程序下載進去，可能屏幕不會顯示“ 嵌入式小書蟲 ”這幾個字哦！

這是因為我們的字庫是UTF-8編碼的，而你在keil MDK中可能設置的是GB2312編碼集哦，所以當屏幕沒有顯示出我們想要的字符時，要記得修改一下編碼集，如下

點擊小扳手進行設置，如下

好了，這樣屏幕中就可以顯示我們的字符了。

值得一說的是我們使用了Arm-2D提供的arm_lcd_print_banner 函數，它可以方便我們 在指定的區域內居中顯示字符串 ，如下圖

程序如下

arm_2d_region_t myRegions={

• 第1個參數就是要顯示的字符串
• 第2個參數為字符串顯示的區域
• 第3個參數就是要使用的字體

怎么樣，使用還是很簡單吧，O(∩_∩)O哈哈~

其實banner還有2個不同的版本（不同的參數）哦！

如果我們已經設置好了字體，第3個參數是可以省略的，如下

arm_lcd_print_banner("雷陣雨",myRegions);

如此，上面的代碼也可以改寫成這樣，如下

arm_lcd_text_set_font((arm_2d_font_t*)&ARM_2D_FONT_UTF8_A8);

同樣的，第二個參數也可以省略，如下

arm_lcd_print_banner("雷陣雨");

那這個只有一個參數，沒有設置區域，它會在哪里居中呢？

此時如果只傳一個參數，它就會 默認在屏幕中間顯示字符串 。

是不是覺得banner這個函數就是專門為支持各國不同的文字量身定做的，使我們可以輕松實現多國語言的切換

當然，使用很簡單，那是因為Arm-2D都為我們制作好了，其實TTF字體里面還有很多Bearing（ 字體大小、水平預留值等 ），如下圖

這些Arm-2D都為我們做好了，感興趣的可以看源碼哈(*￣︶￣)，這里我們就不講了。

不過還有一個關于字符顯示的API函數需要簡單介紹一下，就是提取一行字符串尺寸的函數，如下

arm_2d_size_t StringSize = arm_lcd_get_string_line_box("雷陣雨",&ARM_2D_FONT_UTF8_A8);

• arm_lcd_get_string_line_box這個函數可以幫我們計算出給定字體給定字符串的一行的尺寸，這樣就可以精確控制字符串位置（方便進行對齊哦），在banner函數中就使用了此函數，它的妙用還期待大家進行開發( * ￣︶￣)

【溫故知新】

對了，大家有沒有發現，視頻中的閃電由明變暗然后又變明（好像在呼吸），這個是怎么實現的呢？

其實這個還是用了上一篇文章講過的知識，使用了arm_2d_helper_time_cos_slider，程序如下

uint8_t opacity = 0;

• 在frame_start函數中調用，使iResult的取值按照cos函數變化，其取值范圍為0~255，然后賦值給opacity，使閃電圖片的透明度按照cos曲線變化
• 最后在繪制函數中按照計算出來的透明度進行繪制就可以了，如下

arm_2dp_rgb565_tile_copy_with_colour_keying_and_opacity(NULL,

• 倒數第2個參數就是透明度哦