ui設計師適配的知識點

ui設計師適配的知識點：這就讓很多新入行的設計師認為做 UI 很簡單，而對于適配知之甚少，甚至有些覺得跟自己沒半點關系，今天小編主要給大家分享ui設計師適配的知識點，希望對你們有幫助!

一、錯誤的做法

因為設計師對配適不理解,所以在做實際項目時,需要把750的設計適配640、720、1242的屏幕時,都把選擇設計稿直接等比拉伸至對應的大小,然后再標注,但這種方法不僅增加幾倍的工作量,還可能導致最終的效果不滿意,花了功夫不出效應,說的就是這樣的事。

既然直接拉伸設計稿的方法不可行，我們是否應該為每個屏幕尺寸都重新做一套新的設計呢?當然不是，這樣的開發成本太大，而且沒有必要，其實只要在設計上多注意適配的問題，就可以做到的一稿適配所有。

二、一稿適配所有

大多數人能理解750適配到1242，但是他們不能理解750到720。他們認為這兩個屬于iOS和Android不同終端，標簽欄和導航欄的高度不同。

如果不單獨輸出設計稿，圖標和圖片會變形，間距會太窄等問題。

1. 圖標變形

在開發的時候是用2x、3x切圖，每一個屏幕尺寸都是根據倍率來選擇的，相同的倍率圖標大小、間距、字體大小都是一樣的。

2. 圖像變形

圖片都是按比例來的，只要按比例標注，而不是限制寬度和高度，就可以避免。

3.iOS和Android平臺的區別

有些人總是認為這兩個平臺之間是有區別的，比如它們的導航欄、標簽欄和時間欄的大小不一樣，怎么能適配呢?

實際上，頭部的導航欄、底部的標簽欄、時間欄是平臺的基礎控件，與界面中的元素不在同一個z軸上，它們屬于界面最上層，界面的大小不受它們的影響。

三、適配規則

1. 倍率相同

適配需要以同樣的倍率進行。如果想做一個比較，當然應該在同一水平上。

知道了手機的屏幕分辨率和倍率后，你就能算出其它倍率下的屏幕分辨率是多少。比如iPhone 6的尺寸，750*1334(2x下)，乘以1.5后就可以得到3x下的大小。

同理，可得其它手機的屏幕分辨率在不同的倍率下的大小，紅框表示正常分辨率。

2. 適配三原則

在適配時通常會遵循三個適配原則:等比縮放、彈性控件、文字流自適應。

(1)等比縮放

等比縮放是指元素的大小不是固定的，而是隨著屏幕的大小(通常是寬度)而變化。無論屏幕分辨率如何變化，圖像的比例都不會改變。

(2)彈性控件

彈性控件指元素的大小保持不變，并且間距適配屏幕的寬度。屏幕越寬，間距越大。

(3)文字流自適應

文本的行數與屏幕的寬度成正比，屏幕越寬，一行可以顯示的文字越多。

      注：尊重原創文章,轉載請注明出處和鏈接 http://m.hebeijilong.cn/news-id-71616.html 違者必究！部分文章來源于網絡由培訓無憂網編輯部人員整理發布,內容真實性請自行核實或聯系我們，了解更多相關資訊請關注UI設計頻道查看更多，了解相關專業課程信息您可在線咨詢也可免費申請試課。關注官方微信了解更多：150 3333 6050