SVGA:
SVGAConverter 可以將 Flash 以及 After Effects 動(dòng)畫導(dǎo)出成 .SVGA 文件(實(shí)際上是 ZIP 包),供 SVGAPlayer 在各平臺(tái)播放,SVGAPlayer 支持在 iOS / Android / Web / ReactNative / LayaBox 等平臺(tái)、游戲引擎播放。
SVGA 做的事情,實(shí)際上,非常簡(jiǎn)單,Converter 會(huì)負(fù)責(zé)從 Flash 或 AE 源文件中提取所有動(dòng)畫元素(位圖、矢量),并將其在時(shí)間軸中的每幀表現(xiàn)(位移、縮放、旋轉(zhuǎn)、透明度)導(dǎo)出。 Player 會(huì)負(fù)責(zé)將這些信息還原至畫布上。
因此,你會(huì)發(fā)現(xiàn),SVGA 既有序列幀的特點(diǎn),又有元素動(dòng)畫的特點(diǎn)。Player 邏輯極度簡(jiǎn)單,她只負(fù)責(zé)粗暴地將每一個(gè)元素,絲毫不差地渲染到屏幕上,而無(wú)須任何插值計(jì)算。
SVG:
SVG是一種圖像文件格式,它的英文全稱為Scalable Vector Graphics,意思為可縮放的矢量圖形。它是基于XML(Extensible Markup Language),由World Wide Web Consortium(W3C)聯(lián)盟進(jìn)行開發(fā)的。嚴(yán)格來(lái)說(shuō)應(yīng)該是一種開放標(biāo)準(zhǔn)的矢量圖形語(yǔ)言,可讓你設(shè)計(jì)激動(dòng)人心的、高分辨率的Web圖形頁(yè)面。用戶可以直接用代碼來(lái)描繪圖像,可以用任何文字處理工具打開SVG圖像,通過(guò)改變部分代碼來(lái)使圖像具有交互功能,并可以隨時(shí)插入到HTML中通過(guò)瀏覽器來(lái)觀看
Webp:
WebP(發(fā)音:weppy)是一種同時(shí)提供了有損壓縮與無(wú)損壓縮(可逆壓縮)的圖片文件格式,派生自影像編碼格式VP8,被認(rèn)為是WebM多媒體格式的姊妹項(xiàng)目,是由Google在購(gòu)買On2 Technologies后發(fā)展出來(lái),以BSD授權(quán)條款發(fā)布。
WebP最初在2010年發(fā)布,目標(biāo)是減少文件大小,但達(dá)到和JPEG格式相同的圖片質(zhì)量,希望能夠減少圖片檔在網(wǎng)絡(luò)上的發(fā)送時(shí)間。2011年11月8日,Google開始讓W(xué)ebP支持無(wú)損壓縮和透明色(alpha通道)的功能,而在2012年8月16日的參考實(shí)做libwebp 0.2.0中正式支持。根據(jù)Google較早的測(cè)試,WebP的無(wú)損壓縮比網(wǎng)絡(luò)上找到的PNG檔少了45%的文件大小,即使這些PNG檔在使用pngcrush和PNGOUT處理過(guò),WebP還是可以減少28%的文件大小。
WebP支持的像素最大數(shù)量是16383x16383。有損壓縮的WebP僅支持8-bit的YUV 4:2:0格式。而無(wú)損壓縮(可逆壓縮)的WebP支持VP8L編碼與8-bit之ARGB色彩空間。又無(wú)論是有損或無(wú)損壓縮皆支持Alpha透明通道、ICC色彩配置、XMP詮釋數(shù)據(jù)。
WebP有靜態(tài)與動(dòng)態(tài)兩種模式。動(dòng)態(tài)WebP(Animated WebP)支持有損與無(wú)損壓縮、ICC色彩配置、XMP詮釋數(shù)據(jù)、Alpha透明通道。
點(diǎn)九切圖:
安卓特有的切圖格式,一般用于經(jīng)常需要拉伸變化的素材中,如:會(huì)話氣泡
在制作點(diǎn)九切圖過(guò)程中,需要在素材四周預(yù)留一個(gè)像素空白,畫黑線,左邊和上邊控制拉伸區(qū)域,右邊和下邊控制內(nèi)容顯示區(qū)域,保存時(shí)候命名為***.9.png
Rpx:
rpx 是微信小程序解決自適應(yīng)屏幕尺寸的尺寸單位。微信小程序規(guī)定屏幕的寬度為750rpx。
rem/em:
em是相對(duì)長(zhǎng)度單位。相對(duì)于當(dāng)前對(duì)象內(nèi)文本的字體尺寸。如當(dāng)前對(duì)行內(nèi)文本的字體尺寸未被人為設(shè)置,則相對(duì)于瀏覽器的默認(rèn)字體尺寸。
em的特點(diǎn):
1. em的值并不是固定的;
2. em會(huì)繼承父級(jí)元素的字體大小。
REM
rem是CSS3新增的一個(gè)相對(duì)單位(root em,根em),這個(gè)單位引起了廣泛關(guān)注。這個(gè)單位與em有什么區(qū)別呢?區(qū)別在于使用rem為元素設(shè)定字體大小時(shí),仍然是相對(duì)大小,但相對(duì)的只是HTML根元素。這個(gè)單位可謂集相對(duì)大小和絕對(duì)大小的優(yōu)點(diǎn)于一身,通過(guò)它既可以做到只修改根元素就成比例地調(diào)整所有字體大小,又可以避免字體大小逐層復(fù)合的連鎖反應(yīng)。目前,除了IE8及更早版本外,所有瀏覽器均已支持rem。
pt/dp/sp:
dp安卓開發(fā)的長(zhǎng)度單位,sp安卓開發(fā)的字體 大小單位。
pt是iOS開發(fā)使用的開發(fā)單位。
精靈圖/雪碧圖:
是一種CSS圖像合并技術(shù),該方法是將小圖標(biāo)和背景圖像合并到一張圖片上,然后利用css的背景定位來(lái)顯示需要顯示的圖片部分。
雪碧圖被運(yùn)用在眾多使用了很多小圖標(biāo)的網(wǎng)站上。相對(duì)于把每張小圖標(biāo)以.png格式文件的形式引用到頁(yè)面上,使用雪碧圖只需要引用一張圖片,對(duì)內(nèi)存和帶寬更好,并且可以減小圖片的總大小。
更多關(guān)于UI培訓(xùn)的問(wèn)題,歡迎咨詢千鋒教育在線名師,如果想要了解我們的師資、課程、項(xiàng)目實(shí)操的話可以點(diǎn)擊咨詢課程顧問(wèn),獲取試聽(tīng)資格來(lái)試聽(tīng)我們的課程,在線零距離接觸千鋒教育大咖名師,讓你輕松從入門到精通。