移動端UI設計尺寸規範

標籤：height   最小   inf   UI   技術分享   規範   手機   平面設計   大小   

一、概念：

1.螢幕大小：指螢幕對角線長度，單位是英寸

2.像素：組成映像的最小點，一個相對大小單位，同螢幕裡越小越清晰

3.螢幕像素密度（ppi）=像素總數/螢幕大小（英寸）

4.視網膜螢幕原理：當手機距離你約25-30厘米，如果手機ppi達到300以上，你的眼睛將無法分辨出像素點

5.dpi：平面設計/印刷技術單位，值越大，表明印表機精度越高

   dpi=ppi

二、Android螢幕尺寸正常化

1.程式開發統一使用虛擬尺寸單位：dp/dip（除文字外其他）、sp（文字）

2.px~dp轉換：

Ldpi：px-->dp   除以0.75

          dp-->px   乘以0.75

Mdpi：px-->dp   除以1

          dp-->px   乘以1

Hdpi：px-->dp   除以1.5

          dp-->px   乘以1.5

XHdpi：px-->dp   除以2

          dp-->px   乘以2

XXHdpi：px-->dp   除以3

          dp-->px   乘以3

XXXHdpi：px-->dp   除以4

          dp-->px   乘以4

3.基準間距原則：

（1）組件最小間距為8dp或10dp，排版/文字最小間隔建議4dp

（2）組件尺寸建議能被4整除

（3）組件尺寸建議為偶數（單數容易出現鋸齒）

4.48觸摸定律：48dp是物理尺寸大約為9mm左右，是一個使用者手指能夠準確舒服觸摸的最小尺寸

5.常見組件尺寸：

狀態列：24dp

操作欄：44/48dp

側邊導航：286/304dp

懸浮操作按鈕：56dp

操作欄+TAB：36+33dp/44+40dp

底欄：44/48dp

6.Android常用字型大小/行距/顏色：

 

移動端UI設計尺寸規範