時下App越來越向重型App發(fā)展,隨之帶來的就是App容量劇增.而App中五花八門,各式各樣的圖標(biāo)圖片也是容量增大的幫兇之一.而使用iconfont代替圖片可以緩解這一問題.
了解iconFont
-
iconFont是什么?
- 是一種使用字體文件取代圖片文件,來展示圖標(biāo)/特殊字體等元素的方法.
-
為什么iconFont比圖片占用更少的內(nèi)存?
- 這要從計(jì)算機(jī)繪制圖片的兩種方式來分析
位圖(詳情點(diǎn)擊查看):亦稱點(diǎn)陣圖像或繪制圖像没炒，是由稱作像素（圖片元素）的單個點(diǎn)組成的类早。這些點(diǎn)可以進(jìn)行不同的排列和染色以構(gòu)成圖樣弃揽。當(dāng)放大位圖時彬檀，可以看見賴以構(gòu)成整個圖像的無數(shù)單個方塊措译。擴(kuò)大位圖尺寸的效果是增大單個像素镣衡，從而使線條和形狀顯得參差不齊暴拄。然而年叮，如果從稍遠(yuǎn)的位置觀看它，位圖圖像的顏色和形狀又顯得是連續(xù)的纬纪。
矢量圖(詳情點(diǎn)擊查看):也稱為面向?qū)ο蟮膱D像或繪圖圖像蚓再，在數(shù)學(xué)上定義為一系列由線連接的點(diǎn)滑肉。矢量文件中的圖形元素稱為對象包各。每個對象都是一個自成一體的實(shí)體，它具有顏色靶庙、形狀问畅、輪廓、大小和屏幕位置等屬性六荒。
矢量圖是根據(jù)幾何特性來繪制圖形护姆，矢量可以是一個點(diǎn)或一條線，矢量圖只能靠軟件生成掏击，文件占用內(nèi)在空間較小卵皂，因?yàn)檫@種類型的圖像文件包含獨(dú)立的分離圖像，可以自由無限制的重新組合砚亭。它的特點(diǎn)是放大后圖像不會失真灯变，和分辨率無關(guān)殴玛，適用于圖形設(shè)計(jì)、文字設(shè)計(jì)和一些標(biāo)志設(shè)計(jì)添祸、版式設(shè)計(jì)等滚粟。
通過阿里巴巴矢量圖標(biāo)庫制作自己的iconFont字體
- 打開阿里巴巴矢量圖標(biāo)庫,添加自己的項(xiàng)目
創(chuàng)建項(xiàng)目.png
- 搜索或自制矢量圖標(biāo)上傳
搜索圖標(biāo).png
- 將圖標(biāo)添加到購物車
添加到購物車.png
- 將購物車中的圖標(biāo)添加到自己的項(xiàng)目中
在購物車中添加圖標(biāo)到自己的項(xiàng)目.png
- 選擇打包方式為Font class 并下載
在項(xiàng)目中選擇Fontclass并下載.png
- 將 .ttf 后綴字體文件拖入工程中,并在demo_unicode中查詢到字體對應(yīng)的Unicode碼
將ttf文件拖入iOS工程.png
Unicode碼.png
- 在info.plist配置文件中添加字體信息,參照官方文檔使用
info文件中添加字體.png
