ui設(shè)計師適配的知識點
2022-11-28點擊量:37
ui設(shè)計師適配的知識點ui設(shè)計師適配的知識點:這就讓很多新入行的設(shè)計師認(rèn)為做UI很簡單,而對于適配知之甚少,甚至有些覺得跟自己沒半點關(guān)系,今天小編主要給大家分享ui設(shè)計師適配的知識點,希望對你們有幫助!一、錯誤的做法因為設(shè)計師對配適不理解,所以在做實際項目時,需要把750的設(shè)計適配640、720、1242的屏幕時,都把選擇設(shè)計稿直接等比拉伸至對應(yīng)的大小,然后再標(biāo)注,但這種方法不僅增加幾倍的工作量,還可能導(dǎo)致最終的效果不滿意,花了功夫不出效應(yīng),說的就是這樣的事。既然直接拉伸設(shè)計稿的方法不可行,我們是否應(yīng)該為每個屏幕尺寸都重新做一套新的設(shè)計呢?當(dāng)然不是,這樣的開發(fā)成本太大,而且沒有必要,其實只要在設(shè)計上多注意適配的問題,就可以做到的一稿適配所有。二、一稿適配所有大多數(shù)人能理解750適配到1242,但是他們不能理解750到720。他們認(rèn)為這兩個屬于iOS和Android不同終端,標(biāo)簽欄和導(dǎo)航欄的高度不同。如果不單獨輸出設(shè)計稿,圖標(biāo)和圖片會變形,間距會太窄等問題。1.圖標(biāo)變形在開發(fā)的時候是用2x、3x切圖,每一個屏幕尺寸都是根據(jù)倍率來選擇的,相同的倍率圖標(biāo)大小、間距、字體大小都是一樣的。2.圖像變形圖片都是按比例來的,只要按比例標(biāo)注,而不是限制寬度和高度,就可以避免。3.iOS和Android平臺的區(qū)別有些人總是認(rèn)為這兩個平臺之間是有區(qū)別的,比如它們的導(dǎo)航欄、標(biāo)簽欄和時間欄的大小不一樣,怎么能適配呢?實際上,頭部的導(dǎo)航欄、底部的標(biāo)簽欄、時間欄是平臺的基礎(chǔ)控件,與界面中的元素不在同一個z軸上,它們屬于界面最上層,界面的大小不受它們的影響。三、適配規(guī)則1.倍率相同適配需要以同樣的倍率進行。如果想做一個比較,當(dāng)然應(yīng)該在同一水平上。知道了手機的屏幕分辨率和倍率后,你就能算出其它倍率下的屏幕分辨率是多少。比如iPhone6的尺寸,750*1334(2x下),乘以1.5后就可以得到3x下的大小。同理,可得其它手機的屏幕分辨率在不同的倍率下的大小,紅框表示正常分辨率。2.適配三原則在適配時通常會遵循三個適配原則:等比縮放、彈性控件、文字流自適應(yīng)。(1)等比縮放等比縮放是指元素的大小不是固定的,而是隨著屏幕的大小(通常是寬度)而變化。無論屏幕分辨率如何變化,圖像的比例都不會改變。(2)彈性控件彈性控件指元素的大小保持不變,并且間距適配屏幕的寬度。屏幕越寬,間距越大。(3)文字流自適應(yīng)文本的行數(shù)與屏幕的寬度成正比,屏幕越寬,一行可以顯示的文字越多。...