一嵌灰、背景

筆者以前在網(wǎng)上看到有民間高手制作字體的相關(guān)事跡弄匕，覺(jué)得把自己的手寫字用鍵盤敲出來(lái)是一件很有意思的事情，所以一直有時(shí)間想制作一套自己的手寫體沽瞭，前幾天在網(wǎng)上搜索了一下制作字體的方法迁匠，發(fā)現(xiàn)技術(shù)上并不是太難，結(jié)合了自己PHP方面的開發(fā)經(jīng)驗(yàn)驹溃，很快的做出了一套自己的手寫字體城丧。

制作字體的流程大致是這樣，首先我們需要確定那些字體需要自己寫豌鹤，確定了字體之后將這一批字利用工具做成一個(gè)模板亡哄，不過(guò)漢字的總量非常的多，搜索了一下大概在10萬(wàn)字左右布疙，這個(gè)工程量太大蚊惯，因此我們需要找出一批屬于自己常用的字體（大概1700字左右），或者自己所常見(jiàn)到的字體灵临，這個(gè)過(guò)程就需要用PHP來(lái)分析截型，分析出來(lái)之后再將其提取出來(lái)，做成模板儒溉。

在這篇文章當(dāng)中筆者將完整的記錄制作字體過(guò)程宦焦，其中會(huì)將用到的PHP代碼公布出來(lái)，方便其他讀者使用顿涣，也給自己留個(gè)備份波闹。

二、操作概要

1. 提取常用漢字
2. 制作字體模板
3. 生成字體文件

三园骆、提取常用漢字

做一套字體的工作量是比較大的舔痪，因?yàn)闈h字?jǐn)?shù)量比較多寓调，不過(guò)我們可以將我們常用的漢字提取出來(lái)锌唾，優(yōu)先將這寫漢字的做出來(lái)，后面不常用的字體空閑時(shí)再去累加夺英，這里我們用到了PHP來(lái)輔助我們提取常用的漢字晌涕。

3.1 收集數(shù)據(jù)

在網(wǎng)絡(luò)中有各種2000個(gè)常用漢字之類的doc文檔，但是每個(gè)人所用到的卻不一樣痛悯；因此我們需要收集一批自己經(jīng)常接觸的字體數(shù)據(jù)余黎，比如可以從自己的筆記、博客载萌、聊天數(shù)據(jù)惧财、通訊錄中提妊采取；比如筆者便將以往的筆記垮衷、文章厅翔、通訊錄收集了起來(lái)，如下圖則是筆者過(guò)往的文章列表

image

我們將文章內(nèi)容復(fù)制到txt文件當(dāng)中搀突，然后保存到某一個(gè)文件夾當(dāng)中刀闷，如下圖所示

image

3.2 去除雜項(xiàng)

收集了文章之后，里面有很多雜項(xiàng)仰迁，比如空格和換行甸昏，這些內(nèi)容我們并不需要，如下圖所示

image

此時(shí)可以通過(guò)正則表達(dá)式將不需要的內(nèi)容刪除徐许，筆者使用的匹配非中文的正則表達(dá)式如下:

[^\u4e00-\u9fa5]

筆者平時(shí)開發(fā)習(xí)慣使用phpstorm這款I(lǐng)DE施蜜，因此這里教大家使用此IDE來(lái)刪除非中文字符；按住鍵盤 ctrl+r,替換文本內(nèi)容雌隅，然后將正則表達(dá)式放入查找項(xiàng)當(dāng)中花墩，并且勾選regex,此時(shí)所有非漢字內(nèi)容會(huì)被選中，如下圖所示：

[圖片上傳失敗...(image-eabe5b-1534757484533)]

當(dāng)筆者點(diǎn)擊Replace all按鈕時(shí)澄步，變刪除了所有非中文字符冰蘑，此時(shí)我們的內(nèi)容應(yīng)該只有一行內(nèi)容，如下圖所示

image

3.3 字體去重

在整理好文字之后村缸，我們現(xiàn)在需要對(duì)里面的內(nèi)容進(jìn)行去重祠肥，保證每一個(gè)漢字只保留一個(gè)，因?yàn)槲覀冏煮w模板每個(gè)字只需要寫一次就可以梯皿；因此可以使用PHP對(duì)漢字進(jìn)行去重仇箱，代碼如下所示

<?php

//漢字去重函數(shù)
function mb_str_split(string $string)
{
    return implode('', array_unique(preg_split('/(?<!^)(?!$)/u', $string)));
}

//將收集的漢字?jǐn)?shù)據(jù)讀取出來(lái)
$word = file_get_contents('ziti/shoulu.txt');
$word .= file_get_contents('ziti/phpsafe.txt');
$word .= file_get_contents('ziti/reming.txt');
$word .= file_get_contents('ziti/2000.txt');
$word .= file_get_contents('ziti/https.txt');
$word .= file_get_contents('ziti/wangwen/wuxian.txt');
$word .= file_get_contents('ziti/wangwen/qixi.txt');
$word .= file_get_contents('ziti/wangwen/qiantan.txt');
$word .= file_get_contents('ziti/wangwen/jiaoyi.txt');

//執(zhí)行去重
echo mb_str_split($word);

當(dāng)這段代碼被執(zhí)行之后，會(huì)返回去重后的結(jié)果东羹，筆者執(zhí)行結(jié)果如下圖：

image

從圖中可以看出剂桥，筆者已經(jīng)得到了一批去重后的文字

3.4 統(tǒng)計(jì)并排序

去重之后已經(jīng)得到了一批獨(dú)一無(wú)二的漢字，但是字?jǐn)?shù)實(shí)在太多属提，達(dá)到了1730個(gè)漢字权逗，可能一下寫不完，不過(guò)作為開發(fā)者當(dāng)然是要講究高效率的冤议；所以可以通過(guò)PHP來(lái)進(jìn)行優(yōu)先級(jí)的計(jì)算斟薇，把最常用到字體排在前面，因此筆者需要寫一段PHP代碼恕酸。

3.4.1 漢字拆分?jǐn)?shù)組

首先筆者將去重后的字符串拆分成數(shù)組堪滨，因?yàn)闈h字比較特殊，所以需要自定義一段代碼蕊温，參考代碼如下:

//把漢字拆分為數(shù)組
function ch2arr(string $str)
{
    $length = mb_strlen($str, 'utf-8');
    $array = [];
    for ($i = 0; $i < $length; $i++) {
        $array[] = mb_substr($str, $i, 1, 'utf-8');
    }
    return $array;
}

3.4.1 排序后篩選

下載筆者需要通過(guò)foreach來(lái)遍歷統(tǒng)計(jì)每個(gè)字出現(xiàn)的次數(shù)袱箱，并且安裝倒序排序遏乔，如果limit大于0，還可以篩選重復(fù)次數(shù)大于0的漢字发笔，代碼如下

function strSelect(string $string, string $word, $limit = 0)
{
    //把字符串分割為數(shù)組
    $cnList = ch2arr($string);
    foreach ($cnList as $val) {
        $result[$val] = substr_count($word, $val);
    }

    //重復(fù)高的出現(xiàn)在最前
    arsort($result);

    //篩選字符串
    $ret = '';
    foreach ($result as $key => $val) {
        if ($val > $limit) {
//            $ret .= "$key:$val".PHP_EOL;  //查看每個(gè)字重復(fù)的次數(shù)
            $ret .= $key;
        }

    }

    return $ret;
}

在前面兩個(gè)方法寫完之后按灶，筆者只需要調(diào)用一行代碼即可得出最常用的一些字符，也可以篩選結(jié)果筐咧，調(diào)用代碼如下：

echo strSelect($str, $allStr, 1);

代碼執(zhí)行之后鸯旁，筆者將會(huì)安裝漢字出現(xiàn)的次數(shù)進(jìn)行排序，把最常見(jiàn)的字符排在前面量蕊，并且篩選出現(xiàn)次數(shù)大于1的才返回铺罢，返回結(jié)果如下圖所示：

image

從圖中可以看到字體順序已經(jīng)發(fā)生了很大變化，數(shù)量明顯少了很多残炮。

參考代碼地址:

http://tuchuang.songboy.net/ziti/code.txt

四韭赘、制作字體模板

把自己最常接觸的漢字找出來(lái)之后，需要制作一套字體模板势就，這套字體模板的用處是讓手寫漢字后泉瞻，順利的找到對(duì)應(yīng)的漢字，這里需要依靠第三方網(wǎng)站提供的一些功能苞冯。

4.1 字體文件編碼

現(xiàn)在筆者將PHP計(jì)算的字符寫入到一個(gè)txt文件當(dāng)中袖牙，參考命令如下

php quchong.php  > result.txt

保存之后，還需要將它的編碼設(shè)置為UTF-8舅锄；操作步驟為:首先用windows的記事本打開鞭达，然后將文件另存為UTF-8編碼的文件，筆者用mac系統(tǒng)怎么也不行皇忿，使用windows很順利的就完成了畴蹭，建議使用windows，如下圖所示

[圖片上傳失敗...(image-651e15-1534757484533)]

4.2 生成字體模板

現(xiàn)在筆者需要將之前保存的漢字鳍烁，用固定格式的模板展現(xiàn)出來(lái)叨襟，后期需要用此模板生成字體文件，這里需要用到一個(gè)網(wǎng)站來(lái)輔助,網(wǎng)站地址如下

http://www.flexifont.com/

網(wǎng)站需要注冊(cè)幔荒，注冊(cè)過(guò)程筆者這里將不做描述糊闽；在登陸之后點(diǎn)擊我的字體，可以看到當(dāng)前的字體模板铺峭，選擇自定義墓怀，參考下圖

image

點(diǎn)擊自定義之后汽纠，筆者能看到一個(gè)上傳txt文件的表單卫键，如下圖所示

image

上傳完成之后，筆者回到列表當(dāng)中虱朵，就可以看到剛才創(chuàng)建的字體模板莉炉，如下圖所示

image

4.3 手寫字體

筆者將剛才創(chuàng)建的模板下載到電腦當(dāng)中钓账，并解壓該文件，解壓后的結(jié)果如下圖所示

image

這里一定要打開這些圖片確認(rèn)無(wú)誤絮宁，確認(rèn)這些字和上傳的字能對(duì)應(yīng)的上梆暮，如果里面的字明顯不是剛才上傳的，很有可能是你上傳文件的編碼不正確绍昂，筆者生成的字體模板如下圖所示

image

確認(rèn)無(wú)誤后需要將這幾張圖片打印下來(lái)啦粹，最好自己有打印機(jī)，筆者之前買過(guò)一款惠普的1121打印機(jī)窘游，總價(jià)格不到200塊錢唠椭，建議各位讀者也買一個(gè)，有打印機(jī)有時(shí)候真的很方便忍饰；

打印出來(lái)之后贪嫂，就需要筆者將對(duì)應(yīng)文字意義手寫。

五艾蓝、生成字體文件

手寫字體是一個(gè)比較辛苦的過(guò)程力崇，手寫完成之后還有一些步驟，如果讀者比較熟悉用手機(jī)編輯圖片赢织，那么這一步很快就能完成亮靴，如果不熟悉，就詳細(xì)的看一下筆者的處理方法吧于置。

5.1 拍照

首先需要將剛才手寫的文字進(jìn)行拍照台猴，拍照的時(shí)候注意盡量平著拍，需要把4個(gè)黑邊拍進(jìn)去俱两；筆者使用的是iPhone手機(jī)，因此非常建議使用iPhone的讀者將相機(jī)的網(wǎng)格線功能打開宪彩，因?yàn)檫@樣就可以看出手機(jī)是否是平著拍的，在設(shè)置->相機(jī)->網(wǎng)格線尿孔，參考如下圖

[圖片上傳失敗...(image-2ce45a-1534757484533)]

設(shè)置好之后，筆者再次打開相機(jī)活合，就能看到網(wǎng)格線，如下圖所示

[圖片上傳失敗...(image-478b40-1534757484533)]

中間的十字架如果是黃顏色的白指，說(shuō)明筆者當(dāng)前是平著拍攝的，這樣拍照的時(shí)候圖片就不會(huì)那么斜了。

5.2 處理圖片

雖然在拍照的時(shí)候已經(jīng)很用心的去拍攝，但拍的過(guò)程當(dāng)中難免有一些不滿意法竞，這個(gè)時(shí)候可以用手機(jī)簡(jiǎn)單處理一下参歹，筆者這里依然以iPhone手機(jī)為例

打開相冊(cè)查看圖片的右上方有一個(gè)編輯功能隆判，如下圖所示

點(diǎn)擊編輯之后犬庇，在左下角有一個(gè)方塊按鈕，點(diǎn)擊之后可以對(duì)圖片進(jìn)行放大縮小的跳轉(zhuǎn)侨嘀，以及旋轉(zhuǎn)械筛，對(duì)齊等功能，讀者可以自己去操作一番飒炎，將圖片盡量調(diào)整到理想的狀態(tài)埋哟。

筆者處理后的效果如下圖所示

image

5.3 上傳并生成字體

現(xiàn)在打開字體上傳頁(yè)面，把筆者已經(jīng)處理過(guò)的圖片上傳到手寫體網(wǎng)站當(dāng)中了郎汪，URL地址如下

http://www.flexifont.com/flexifont-chn/add_font/

如下圖所示赤赊，手寫體站點(diǎn)的一些規(guī)則

image

需要記住別選擇錯(cuò)模板(筆者一開始沒(méi)選擇對(duì)，還以為系統(tǒng)出問(wèn)題了)煞赢，然后把字體上傳抛计，上傳完成之后，可以點(diǎn)擊查看隊(duì)列照筑，看看當(dāng)前的字體處理狀態(tài)吹截，URL地址如下

http://www.flexifont.com/flexifont-chn/queuers/

筆者上傳字體后，不到1分鐘便已經(jīng)處理完成凝危，處理完成之后波俄，可以在我的字體下方看到字體列表，如下圖所示

image

六蛾默、使用字體

當(dāng)字體生成完成之后懦铺，筆者安裝字體文件即可

6.1 安裝字體

安裝字體在mac下和widnows下都非常簡(jiǎn)單，首先看看mac下安裝方法支鸡，下載字體之后冬念，可以直接雙擊字體文件，會(huì)看到如下圖

image

筆者直接點(diǎn)擊安裝字體就可以了

再說(shuō)說(shuō)windows下安裝,其實(shí)也只需要雙擊字體文件即可牧挣，然后點(diǎn)擊安裝急前，如下圖所示

[圖片上傳失敗...(image-b0be7-1534757484533)]

不過(guò)筆者在電腦在安裝字體的時(shí)候出現(xiàn)了錯(cuò)誤，提示字體無(wú)效瀑构，于是我換了一種方式裆针；右擊鼠標(biāo)->為所有用戶安裝 又好了，原因未知，如果讀者出現(xiàn)這種情況也可以試試据块。

6.2 在WPS中使用

筆者很多時(shí)候都會(huì)使用到word文件码邻，讀者喜歡用wps折剃，那么如何在WPS中使用“輕松體”呢，其實(shí)非常簡(jiǎn)單怕犁，在隨便輸入一些文字之后奏甫，在上方選擇“輕松體”即可阵子，效果如下圖所示

[圖片上傳失敗...(image-288089-1534757484533)]

如果發(fā)現(xiàn)某個(gè)字體不是你手寫的風(fēng)格，那應(yīng)該是這個(gè)字體不再你的字體模板當(dāng)中色乾，你可以生成一個(gè)新的模板暖璧，然后合并之前的字體即可澎办。

6.3 補(bǔ)充

在手寫體當(dāng)中默認(rèn)的模板也不錯(cuò)金砍，讀者也可以去嘗試一下恕稠，另外不僅僅漢字可以做手寫體谱俭，符號(hào)也可以。

作者：湯青松

微信：songboy8888

日期：2018年8月20號(hào)