android尺寸規范
㈠ 設計頁面各手機屏幕的尺寸規范
iPhone界面尺寸
設備 解析度 PPI 狀態欄高度 導航欄高度 標簽欄高度
iPhone6P、6SP、7P 1242×2208 px 401PPI 60px 132px 146px
iPhone6 - 6S - 7 750×1334 px 326PPI 40px 88px 98px
iPhone5 - 5C - 5S 640×1136 px 326PPI 40px 88px 98px
iPhone4 - 4S 640×960 px 326PPI 40px 88px 98px
iPhone & iPod Touch第一代、第二代、第三代 320×480 px 163PPI 20px 44px 49px
iPhone圖標尺寸:
設備 App Store 程序應用 主屏幕 Spotlight搜索 標簽欄 工具欄和導航欄
iPhone6P - 6SP - 7(@3×) 1024×1024 px 180×180 px 114×114 px 87×87 px 75×75 px 66×66 px
iPhone6 - 6S - 7 (@2×) 1024×1024 px 120×120 px 114×114 px 58×58 px 75×75 px 44×44 px
iPhone5 - 5C - 5S (@2×) 1024×1024 px 120×120 px 114×114 px 58×58 px 75×75 px 44×44 px
iPhone4 - 4S (@2×) 1024×1024 px 120×120 px 114×114 px 58×58 px 75×75 px 44×44 px
iPhone & iPod Touch第一代、第二代、第三代 1024×1024 px 120×120 px 57×57 px 29×29 px 38×38 px 30×30 px
iPad的設計尺寸
設備 尺寸 解析度 狀態欄高度 導航欄高度 標簽欄高度
iPad 3 - 4 - 5 - 6 - Air - Air2 - mini2 2048×1536 px 264PPI 40px 88px 98px
iPad 1 - 2 1024×768 px 132PPI 20px 44px 49px
iPad Mini 1024×768 px 163PPI 20px 44px 49px
iPad圖標尺寸:
設備 App Store 程序應用 主屏幕 Spotlight搜索 標簽欄 工具欄和導航欄
iPad 3 - 4 - 5 - 6 - Air - Air2 - mini2 1024×1024 px 180×180 px 144×144 px 100×100 px 50×50 px 44×44 px
iPad 1 - 2 1024×1024 px 90×90 px 72×72 px 50×50 px 25×25 px 22×22 px
iPad Mini 1024×1024 px 90×90 px 72×72 px 50×50 px 25×25 px 22×22 px
Android SDK模擬機的尺寸
屏幕大小 低密度(120) 中等密度(160) 高密度(240) 超高密度(320)
小屏幕
??QVGA(240×320) ?????480×640
普通屏幕
WQVGA400(240×400) WQVGA432(240×432) ??HVGA(320×480) WVGA800(480×800) WVGA854(480×854) 600×1024 ??640×960
大屏幕
WVGA800 *(480×800) WVGA854 *(480×854) WVGA800 *(480×800) WVGA854 *(480×854) 600x1024
超大屏幕
???1024×600 1024×768 1280×768WXGA(1280×800) 1536×1152 1920×1152 1920×1200 2048×1536 2560×1600
Android的圖標尺寸
屏幕大小 啟動圖標 操作欄圖標 上下文圖標 系統通知圖標(白色) 最細筆畫
320×480 px
48×48 px 32×32 px 16×16 px 24×24 px 不小於2 px
480×800px 480×854px 540×960px
72×72 px 48×48 px 24×24 px 36×36 px 不小於3 px
720×1280 px
48×48 dp 32×32 dp 16×16 dp 24×24 dp 不小於2 dp
1080×1920 px
144×144 px 96×96 px 48×48 px 72×72 px 不小於6 px
Android安卓系統dp/sp/px換算表
名稱 解析度 比率 rate (針對320px) 比率 rate (針對640px) 比率 rate (針對750px)
idpi
240×320 0.75 0.375 0.32
mdpi
320×480 1 0.5 0.4267
hdpi
480×800 1.5 0.75 0.64
xhdpi
720×1280 2.25 1.125 1.042
xxhdpi
1080×1920 3.375 1.6875 1.5
主流Android手機解析度和尺寸
設備 解析度 尺寸 設備 解析度 尺寸
魅族MX2 4.4英寸 800×1280 px 魅族MX3 5.1英寸 1080×1280 px
魅族MX4 5.36英寸 1152×1920 px 魅族MX4 Pro未上市 5.5英寸 1536×2560 px
三星GALAXY Note 4 5.7英寸 1440×2560 px 三星GALAXY Note 3 5.7英寸 1080×1920 px
三星GALAXY S5 5.1英寸 1080×1920 px 三星GALAXY Note II 5.5英寸 720×1280 px
索尼Xperia Z3 5.2英寸 1080×1920 px 索尼XL39h 6.44英寸 1080×1920 px
HTC Desire 820 5.5英寸 720×1280 px HTC One M8 4.7英寸 1080×1920 px
OPPO Find 7 5.5英寸 1440×2560 px OPPO N1 5.9英寸 1080×1920 px
OPPO R3 5英寸 720×1280 px OPPO N1 Mini 5英寸 720×1280 px
小米M4 5英寸 1080×1920 px 小米紅米Note 5.5英寸 720×1280 px
小米M3 5英寸 1080×1920 px 小米紅米1S 4.7英寸 720×1280 px
小米M3S未上市 5英寸 1080×1920 px 小米M2S 4.3英寸 720×1280 px
華為榮耀6 5英寸 1080×1920 px 錘子T1 4.95英寸 1080×1920 px
LG G3 5.5英寸 1440×2560 px OnePlus One 5.5英寸 1080×1920 px
主流瀏覽器的界面參數與份額
瀏覽器 狀態欄 菜單欄 滾動條 市場份額(國內)
Chrome 瀏覽器 22 px(浮動出現) 60 px 15 px 42.1%
火狐瀏覽器 20 px 132 px 15 px 1%
IE瀏覽器 24 px 120 px 15 px 34%
360 瀏覽器 24 px 140 px 15 px 28%
遨遊瀏覽器 24 px 147 px 15 px 1%
搜狗瀏覽器 25 px 163 px 15 px 3.8%
系統解析度統計
解析度 佔有率 解析度 佔有率
1920×1080
13.8%
1366×768
10.2%
360×640
7.9%
1440×900
7.7%
720×1280
6.4%
1024×768
5.1%
320×568
3.7%
1600×900
3.5%
1080×1920
3.3%
375×667
3.2%
㈡ Android常用UI尺寸規范
在信息流的設計中,左右的間距會保持一致,通常設定為32px,從而保證有足夠的留白,如圖所示。信息流中的文本、圖片和頭像都會依據間距進行左右對齊,以此來保證頁面的規則性。
在1080px×1920px的設計圖中,文字要有主次。把字型大小大小分為3個級別,例如主文案的昵稱會設置為46px,描述文字會設置為36px,而最小字型大小的時間等信息文字的大小會設置為30px,如圖所示。
㈢ android MD設計規范問題,應用欄高度是多少
目前安卓上有兩種尺寸,分別為56dp和48dp,目前較常用的高度為48dp;來自谷歌官方的規范為56dp。想了解更詳細點,請參考谷歌官方說明,以下地址為本問題說明點:https://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keyli...
㈣ 設計師如何為Android應用標注尺寸
設計 Android 應用的最佳實踐:
1. 畫布大小定位 720 x 1280,72 dpi
2. 只使用偶數單位的尺寸,比如 96 px 的列表項高度,16 px 的邊距,64 px 的圖標邊長
3. 只使用 24 pt,28 pt,36 pt 和 44 pt 的字體
4. 設計完成以後,所有尺寸的 px 值除以 2 作為 dp 數值交給工程師
5. 所有字體的 pt 值除以 2 作為 sp 數值交給工程師
6. 所有切圖變成三份,分別是原始大小、縮小 1.5 倍,縮小 2 倍,分別作為 xhdpi,hdpi,mdpi 的資源交給工程師
如果你還有好奇心,可以繼續往下看這個結論是怎麼來的。
相信你已經看過這篇文檔中關於 Android 中各種尺寸單位的介紹,沒看過的最好看一下
http://developer.android.com/guide/topics/resources/more-resources.html#Dimension
在 Android 應用設計中涉及到的單位都是密度無關像素(Density-independent Pixels),這個說法太拗口了,通俗點講,Android 應用設計中只用物理尺寸,類似厘米,英寸這種單位,不用像素。之所以這樣,是由於像素在手機領域說不清楚問題,比方說規定列表項高度是 48 px,在 HTC C510e 上看起來就不錯,但在三星 Galaxy SIII 上看起來就會非常矮,導致很難看,這是因為這兩個機器的屏幕的 dpi 相差很大,前一個大約 160 dpi,後一個大約 320 dpi。這就是手機屏幕不同帶來的問題,如果不考慮平板,不同主要是密度不同,而不是尺寸不同,也不是解析度不同,給設計帶來困擾的根本是屏幕密度不同。不幸的是,很少人對這個有概念,通常介紹手機,會說屏幕尺寸,3.5
寸還是 4 寸,會說解析度,480 x 800 還是 720 x 1280,但通常不會介紹屏幕密度是多少。其實通過尺寸和解析度可以算出密度來,dpi 的 定義是 dot per inch,即每英寸的像素點,把解析度和尺寸除一除就能得到。一個不確切的分法是,720 x 1280 的手機很可能接近 320 dpi (Android 里的 xhdpi),480 x 800 的手機很可能接近 240 dpi (Android 里的 hdpi)。
Android 選擇的單位是 dp 和 sp,dp 的定義是「在 160 dpi 的屏幕上,1 dp 大約等於 1 px」。這個說法也很拗口,簡單點說,1 dp ≈ 1 / 160 inch,他就是物理界的一長度單位。用這個單位設計就統一了,比方說規定列表項高度是 48 dp,在所有手機上看起來都差不多是 48 / 160 inch 那麼高,雖然在不同手機上它對應了不一樣多的像素點,但這個轉換是 Android 手機完成的,每個 Android 手機都得知道在我這 1 dp 對應多少像素。sp 也是同樣解釋,18
sp 的字在所有手機上看起來應該都差不多大(自己改了字體大小設置的除外)。看到這里,可能有人會想,那豈不是不同手機顯示的內容不同。確實是這樣,同樣一個列表,在 A 手機上只能顯示五行,但在 B 個手機上就能顯示六行;還是這個列表,在 A 手機上文字左邊的留白就顯得沒有 B 手機多。
鋪陳完了,逐條解釋開始的最佳實踐。
設計師在設計的時候是用不了 dp 的,他不可能拖一個 48 x 48 dp 的框,不可能設置一個 8 dp 的邊距,Photoshop 里全是 px。於是我們就只有挑一個特定密度的屏幕,在這個特定密度的屏幕上,dp 和 px 的關系是確定,把設計做了,再把 px 轉換成 dp 給工程師。另外有一點是,長度可以乘除一下就解決,圖片是不能除的,圖片必須手動縮放。
我們挑哪一個密度好呢?答案是挑密度最大的,因為圖片縮小比放大好,放大會失真,選 320 dpi 作為目標屏幕,為其他屏幕提供圖片時,只需要縮小。而 320 dpi 屏幕的解析度最常見的是 720 x 1280,以這個尺寸作為畫布尺寸,是最帶感的,這樣的設計稿就和應用在最多數的 320 dpi 的機器上運行起來的樣子一樣。當然你可以選其他畫布大小,但再大也不見得方便,這個大小也夠施展了。72 dpi 是 Photoshop 的默認設置,不要改就好,這個數字和後面的換算有關系。
字體的問題,Android 4.0 以後的設計規范中建議只使用四種字型大小,分別是 12 sp,14 sp,18 sp 和 22 sp,這也是 Android framework 用到的全部字型大小。我們需要找到在這個畫布上,這些字型大小和 pt 的對應關系,以及,px 和 dp 的對應關系。有兩種演算法:
演算法一
根據 dp 的定義「在 160 dpi 的屏幕上,1 dp 大約等於 1 px」,那麼在 320 dpi 的屏幕上,1 dp 約等於 2 px,我們就是為 320 dpi 做的設計,所有 px 值除以 2 就是 dp 值。字體略復雜一點,1 pt = 1 / 72 inch,即在 72 dpi 的畫布上,1 pt = 1 px,我們的畫布就是 72 dpi,又有 1 sp 約等於 2 px(同 dp 的定義),所以 1 sp = 2 pt,所有 pt 值除以 2 就是 sp 值。演算法二
可以想像是把一個 320 dpi 的手機屏幕放大到了 Photoshop 里,放大倍數是 320 / 72,即手機上的 1 dp,在畫布上就是 320 / 72 dp,而 1 dp = 1 / 160 inch,所以在畫布上就是 2 / 72 inch,而畫布是 72 dpi,所以在畫布上就是 2 px,即手機上的 1 dp 對應畫布上的 2 px。字體的計算一樣,只是多一個在 72 dpi 上,1 pt = 1 px 的轉換。
至此,都算清楚了,在這個畫布上,px 到 dp,pt 到 sp 都是除以 2 的關系。
最後,給 320 dpi 做的圖片,到 240 dpi,160 dpi 上就要分別縮小 1.5 倍和縮小 2 倍。120 dpi 的機器已經很罕見,可以不考慮了
㈤ 安卓界面尺寸規范及解析度一般怎麼設定
首先,Andoird開發相對於ios開發必須要考慮兼容性的問題
Android應用如何適配不同解析度的手機,主要分三塊考慮:
1.界面配置,根據不同的解析度,創建手機界面文件
例子:
在res下創建 layout-800x480,layout-480x320,並在各自不同解析度的文件夾下創建界面文件
2.圖片配置,不同的解析度,界面的長寬比不一致,需要不同規格的圖片,在drawable-hdpi,drawable-ldpi,drawable-mdpi 中放不同解析度的圖片.
注:為了減小整個應用程序安裝包大小,選用最高解析度適配,特殊界面圖片特殊處理.
3.動態實現的界面,樣式的設定,不同解析度,界面的字體大小,字體等需要不同的樣式,且需要動態生成的情況下,需要把不同解析度的配置信息保存到應用中。
例子:
在RES里創建 values-480x320 values-800x400 value-1280x720,並在創建的文件夾中分別創建dimens.xml,<dimen name="Text_size">30px</dimen>,在程序中直接調R.dimen.Text_sizeint sizeOfText = (int) this.getResources().getDimension(R.dimen.Text_size);
注:實際應用發現,字體大小適配時,比如只適配了如下屏幕字體
values-480x320 values-800x480 value-1280x720當出現手機屏幕解析度為 854x480時會自動找最大字體適配 (value-1280x720).
㈥ 安卓系統UI設計尺寸怎麼定
眾所周知,安卓系統是開源的,國內又有超多的手機廠商,小米、魅族、華為、oppo、三星等,每一個品牌有屬於自己的UI設計規范,但是我們主要分析UI界面尺寸規范。
1、字體
安卓系統中文採用的是思源黑體,英文字體為robot字體。
只使用偶數單位 24 pt,28 pt,36 pt等字體大小
2、mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi、dp、px到底是什麼意思?
講圖標之前先來分析一下一排英文的意思:
mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi都是表示的屏幕密度大小,依次數值越大,其解析度越高。常用的是xxhdpi和xxxhdpi。
dp是安卓系統專用的長度單位,設備獨立像素的意思。不同設備有不同的顯示效果,這個和設備硬體有關。多為圖標使用,文字則用sp(放大像素),主要用於字體顯示best for textsize。
px是像素的意思, 不同設備顯示效果相同。
安卓各屏幕密度關系如下:
3、圖標
不同手機品牌的圖標的標志是不一樣的,對應不同大小屏幕的尺寸如下:
應用圖標的尺寸:
快捷圖標的尺寸:
系統圖標的尺寸:
4、應用欄的尺寸
從左到右依次是:① 應用欄高度:56dp;應用欄左右內邊距為16dp;應用欄圖標上下左內邊距為16dp;應用欄標題左內邊距為72dp;應用欄標題下邊距:20dp;
②應用欄高度為128dp;
③操作欄高度為56dp;標題欄高度:80dp;標題欄底部內邊距:8dp;描述區域高度:72dp;描述區底部內邊距:16dp。
5、列表高度
垂直邊框、水平外邊距、邊框左右外邊距各16dp;帶有圖標或者頭像的內容有72dp的左邊距。
垂直邊距
①狀態欄:24dp;②工具欄:56dp;③子標題:48dp;④列表項:72dp
垂直邊框、水平外邊距、邊框左右外邊距各16dp;帶有圖標或者頭像的內容有72dp的左邊距。
垂直邊距
①狀態欄:24dp;②工具欄:56dp;③標題和列表項:48dp;④子標題:48dp;⑤內容區域間距離為8dp
6、界面適配
安卓多屏幕支持的基礎是它能夠管理應用程序的布局和點陣圖可繪制對象的渲染以適當的方式對當前屏幕配置的能力。該系統處理的大部分工作由布局縮放以適合屏幕尺寸/密度和縮放點陣圖可繪制在屏幕密度正確呈現您的應用程序在每個屏幕的配置,來優化用戶界面設計,帶來更良好的用戶體驗。
如何做到安卓界面適配呢?大家一定要很清楚的了解解析度、屏幕大小、密度的關系;明白實際密度和系統密度的關系,dp、sp、px的區別;明白dp與px的轉換。這里不做過多闡述,後期寫一篇具體的~
安卓的界面規范就講到這里,要明白設計界面規范的意義是確保設計的統一性與合理性,規范維護的是項目的統一,為了項目利益最大化,高效化。所以作為UI設計師的我們,如果一點設計規范不遵守,全靠自己想當然,那就別發給前端人員啦,他也看不懂。
㈦ iOS與Android用戶界面(UI)設計規范
相信很多人都在開發設計APP時會遇到很多界面上的問題,要以多大尺寸來設計?解析度是多少?該怎麼切圖給開發......
下面的文字就給出一點點技巧總結,但也要給合團隊在開發時的習慣。每個工程師們所使用的控制項,書寫布局習慣來實際移交的圖是不一樣的,但八九不離十,都是遵循一個原則,便捷開發、自適應強的開發模式。
一、尺寸及解析度
設計圖單位:像素72dpi。在設計的時候並不是每個尺寸都要做一套,尺寸按自己的手機來設計,比較方便預覽效果,一般用640*960或者640*1136的尺寸來設計,現在iPhone 6和Plus出來後有很多人會使用6屏幕尺寸來設計。
如果是我來做的話,我會使用640×1136,對Plus做單獨的修改適配,因為Plus的屏幕實在是大了,遵循屏大顯示更多內容的原則這里本應該是需要修的了,有更好辦法的話希望大家可以分享一下。
Ps:作圖的時候盡可能確保都是用形狀工具(快捷鍵 U)畫的,這樣更方便後期的切圖或者尺寸變更。
二、界面基本組成元素
iPhone的app界面一般由四個元素組成,分別是:狀態欄(status bar)、導航欄(navigation)、主菜單欄(submenu)、內容區域(content)。
PS:在最新的iOS7的風格中,蘋果已經開始慢慢弱化狀態欄的存在,將狀態欄和導航欄合在了一起,但是再怎麼變,尺寸高度也還是沒有變的,只不過大家在設計iOS7風格的界面的時候多多注意下~
三、圖標尺寸
四、字體大小
iPhone 上的字體英文為: HelveticaNeue 至於中文,Mac下用的是黑體-簡,Windows下則為華文黑體,所有字體要用雙數字型大小。
下圖是網路移動用戶體驗部(MUX)做過的一個小調查,可以看出用戶在iOS app中可接受的文字大小。
五、切圖
切圖是APP設計中的一個重要過程,關繫到APP的界面實現,及各種適配性還有各種性能
蘋果在沒6 Plus前,我們只需要提供兩種圖,普通圖及視網膜屏幕圖。
以640×1136(640×960是一樣的)做的設計圖的話就會好辦一點。直接出設計圖上的原大小圖標,比如我們命名一個圖片叫 img-line.png,我們給開發的圖就要改變這個名字叫 [email protected] 就是在後綴名前加上@2x表示視網膜屏的圖,iPhone4的還需要把這個圖尺寸按比例縮小50%,得到正真的img-line.png。然後把這兩個圖移交給開發,iPhone6的圖在規范里是與5s使用的是一樣的,也是@2x圖。有些UI則需要做適當的適配,比如拉長,拉高,這個開發會去做。
對於iPhone 6 plus的話范里給出的是@3x相信大家也知道是怎麼回事,但如果要使用PS放大的話,大家做圖的時候就需要使用形狀工具來做,放大後還需要仔細微調,這里就不多做講解
PS: 在出可按的圖片切圖時需要注意圖片的可按區域大小,有時圖標很小,實際切出來的放在上面,用手指是按不到的,我們就需要對圖片單獨處理,拓寬圖片的有效區域,這里是拓寬非放大,就是改變畫布大小使圖片尺寸面積擴大,使圖片四周拓寬多餘的透明區域 ,從而改變可按大小。
六、顏色值問題
iOS顏色值取 RGB各顏色的值比如某個色值,給予IOS開發的色值為 R:12 G:34 B:56 給出的值就是 12,34,56(有時也要根據開發的習慣,有時也用十六進制)
七、內部設計
1、所有能點擊的圖片不得小於44px(Retina需要88px)
2、單獨存在的部件必須是雙數尺寸
3、兩倍圖以@2x作為命名後綴
4、充分考慮每個控制按鈕在4中狀態下的樣式,如圖:
一、尺寸及解析度
Android界面尺寸:480*800、720*1280、1080*1920
Android比iPhone的寸尺多了很多套,建議取用720*1280這個尺寸,這個尺寸720*1280中顯示完美,在1080*1920中看起來比較清晰,切圖後的圖片文件大小也適中,應用的內存消耗也不會過高。
二、界面基本組成元素
Android的app界面和iPhone的基本相同:狀態欄、導航欄、主菜單、內容區域。
Android中我們取用的720*1280的尺寸設計,那我們就說說在這個尺寸下這些元素的尺寸。
狀態欄高度為:50px
導航欄高度為:96px
主菜單欄高度為:96px
內容區域高度為:1038px (1280-50-96-96=1038)
Android最近出的手機都幾乎去掉了實體鍵,把功能鍵移到了屏幕中,當然高度也是和菜單欄一樣的:96px
Android為了在界面上區別於iOS,Android 4.0開始提出的一套HOLO的UI風格,一些app的最新版本都採用了這一風格,這一風格最明顯的變化就是將下方的主菜單移到了導航欄下面,這樣的方式解決了現在很多手機去除實體鍵後再屏幕中顯示而出現的雙底欄的尷尬情景。
三、圖標尺寸
Android設計規范中, 使用的單位是dp, dp在安卓機上不同的密度轉換後的px是不一樣的。
四、字體大小
Android 上的字體為:Droid sans fallback,是谷歌自己的字體,與微軟雅黑很像。
同樣,網路移動用戶體驗部(MUX)的調查中,可以看出用戶可接受的文字相應問題。
具體大小,還是那句話,找自己喜歡的app界面,手機截圖後放進PS自己對比調節字體大小,切記,一定是高清截圖。
五、切圖
Android設計規范中單位是dp,dp在安卓機上不同的密度轉換後的px 是不一樣的,所以按照設計圖的px轉換成dp也是不一樣的,這個可以使用轉換工具轉換,開發一般會有,也有些開發會使用px做單位,因為做了前期的轉換工作。
六、顏色值問題
Android顏色值取值為十六進制的值 比如一綠色的值, 給開發的值為 #5bc43e
㈧ Android 平台設計規范有哪些
1、尺寸以及解析度:
Android的界面尺寸比較流行的有:480*800、720*1280、1080*1920,我們在做設計圖的 時候建議是以 480*800的尺寸為標准;
2、界面基本組成元素:
界面基本組成元素包括:狀態欄+導航欄+主菜單欄+內容區域;以480*800的尺寸為標准下的 各個元素的高度(其實導航欄和菜單欄每一個應用都或許不一樣,android對於尺寸沒有太明確的 數據規范)如下:
3、字體:
Android 系統中,Droid Sans 是默認字體,與微軟雅黑很像;
4、操作欄:
1、」操作欄」對於 Android 應用來說是最重要的設計元素,它通常在應用運行的所有時間都呆 在屏幕頂部;
2、 操作欄的基本布局:
1向上+2 Spinner視圖控制+3 重要操作按鈕+4 更多操作:其中,向上按鈕,點擊後是去到 當前界面的上一個層級,非第一層級界面有此按鈕,第一層級界面則無向上按鈕;Spinner 是 用於展示內容的下拉菜單,其內容包括視圖的快速切換和顯示相關內容的完整信息;更多操作 (action overflow)是集合操作欄中不常用的和非重要操作的地方。
5、多面板布局:
多面板布局更多的是針對平板電腦,把手機端的目錄視圖和詳情視圖兩個層級的界面,甚至更 多的頁面,復合展示在同一個界面中,有效地利用平板電腦的屏幕空間,扁平化層級結構,簡 化導航。這點在iPad上已經運用得相當嫻熟了。
6、選擇:
Android4.0中的長按與Android2.3及更早期的版本有很大的不同。早期版本長按操作後,是 出現情境菜單的浮出層。在Android4.0中,長按後在操作欄的位置會覆蓋一個臨時的情境操 作欄,不再彈出情境菜單浮出層。在臨時情境操作欄的環境下,當前界面的內容項允許被單個 處理,也允許被批量處理。
7、返回和向上:
返回按鍵用在手機全局的虛擬導航欄中,基於用戶最近查看的界面歷史,採用時間倒序的方式, 連接界面間的關系。向上按鈕用在操作欄的左側,基於層級結構,點擊後是去到當前界面的上一 個層級,若當前界面已經是最高一級,則沒有向上按鈕。
8、主題樣式:
推出三套默認主題:Holo淺色主題、Holo深色主題、Holo淺色底+深色操作欄主題。主推app在 這三套默認主題的基礎上做設計,以加快app研發效率,但只是建議使用,並沒有完全強制。
9、觸摸與反饋:
用戶觸摸應用中的可操作區域,應當在視覺上有響應,微小的反饋會給用戶帶來很好地效果;
10、按鈕:
1、按鈕的3種表現形式如下圖:
2、對於僅包括圖標的按鈕,不需要使用背景色;
11、滑塊:
滑塊的幾種表現形式如下圖:
12、進度條:
如果某個操作需要花費很長的時間,就需要用進度條的指示和旋轉圈的形式來表示:
1、如果你可以知道當前任務完成的比例,那麼使用進度條,讓用戶了解大約還需要多久才能完成;
2、當使用旋轉圓圈時,不要配以文字標簽。旋轉的圓圈已經表明了正在進行後台操作。
13、開關:
用戶通過開關作出選擇,包括3種形式:復選框+單選按鈕+開關;
1、復選框:用戶可以在一個集合中作出多個選擇:
2、單選按鈕:單選按鈕允許用戶在一個集合中做一次選擇;
3、開關:開關控制單個選項的狀態;
14、對話框:
應用通過對話框讓用戶作出決定或者填寫一些信息,
1、對話框的左邊一般情況下是取消按鈕,右邊是確定按鈕;
㈨ 720x1280與1080x1920設計尺寸各是多少
設計尺寸包括pixel(px),point(pt),pixel per inch(ppi),dot per inch(dpi),Density-independent pixel(px).
720 x 1280的設計尺寸分別為xhdpi,320,2.0,48dp,96px;
1080x1920的設計尺寸分別為xxhdpi,480,3.0,48dp,144px480。
APP設計尺寸單位各自的定義:
1、px:pixel——【 像素】 電子屏幕上組成一幅圖畫或照片的最基本單元;
2、pt: point——【 點】印刷行業常用單位,等於1/72英寸;
3、ppi: pixel per inch——【每英寸像素數】 該值越高,則屏幕越細膩;
4、dpi: dot per inch——【每英寸多少點】,該值越高,則圖片越細膩;
5、dp: dip,Density-independent pixel——【安卓開發用的長度單位】。
二、圖標尺寸規范
1、導航欄和工具欄尺寸大小44x44px;
2、標簽欄尺寸大小75x75px
3、導航欄的文字大小最大值是34-36px,標簽欄的圖標下方的文字大小為20px。
4、內容區域的文字大小是:20px 24px,26px,28px,30px,32px,34px。
㈩ IOS和Android標注圖片的尺寸多少合適
安卓手機的APP圖標尺寸規范跟命名規范如下信息圖。
android圖標規范信息圖包含了安卓程序啟動圖標、安卓底部菜單圖標、安卓彈出對話框頂部圖標、安卓長列表內部列表項圖標和安卓底部或頂部tab標簽圖標。非常齊全。
1. 安卓程序啟動圖標:ldpi (120 dpi)
小屏mdpi (160 dpi)
中屏hdpi (240 dpi)
大屏xhdpi (320 dpi)
特大屏36 x 36 px48 x 48 px72 x 72 px96 x 96 px
2.安卓底部菜單圖標
安卓圖標2
1. 大屏:1. 完整圖片(紅色): 72 x 72 px2. 圖標(藍色): 48 x 48 px3. 圖標外邊框(粉色): 44 x 44 px1. 中屏:1. 完整圖片: 48 x 48 px2. 圖標: 32 x 32 px3. 圖標外邊框: 30 x 30 px1. 小屏:1. 完整圖片: 36 x 36 px2. 圖標: 24 x 24 px3. 圖標外邊框: 22 x 22 px
3. 安卓彈出對話框頂部圖標
Low density screen (ldpi)小屏Medium density screen (mdpi)中屏High density screen (hdpi)大屏24 x 24 px32 x 32 px48 x 48 px
4. 安卓長列表內部列表項圖標
Low density screen (ldpi)小屏Medium density screen (mdpi)中屏High density screen (hdpi)大屏24 x 24 px32 x 32 px48 x 48 px
5. 安卓底部或頂部tab標簽圖標
安卓圖標
1. 大屏 (hdpi)
screens:1. 完整圖片(紅色): 48 x 48 px
2. 圖標(藍色): 42 x 42 px1. 中屏 (mdpi) screens:1. 完整圖片: 32 x 32 px2. 圖標: 28 x 28 px1. 小屏(ldpi) screens:1. 完整圖片: 24 x 24 px2. 圖標: 22 x 22 px
6. 安卓底部狀態欄圖標
ldpi (120 dpi)小屏mdpi (160 dpi)中屏hdpi (240 dpi)大屏xhdpi (320 dpi)特大屏18 x 18 px24 x 24 px36 x 36 px48 x 48 px
安卓圖標尺寸跟狀態欄尺寸設計
蘋果公司官網設計介紹到:Retina顯示屏的超高像素密度已超過人眼能分辨的范圍。
Retina對圖像設計(圖標、啟動畫面和其它所有像素有關的東西)有什麼影響呢?如果我們的app要支持Retina,就要提供高解析度的(寬x2,高x2)的圖片。同時,為了支持沒有Retina的設備,仍舊要准備低解析度的版本。
換言之,我們要准備兩套設計圖。
針對不同解析度的圖片,蘋果規定了一個命名規范:假如一個普通解析度的圖片,文件名是「abc.png」,那麼與其對應的高解析度的文件名就應該是「[email protected]」,多了「@2x」。
下面是IOSAPP 圖標格式和尺寸規范。非常詳細。
圖標和啟動畫面的格式:推薦使用PNG格式,可以是標準的24位顏色(紅、綠和藍各用8位),外加alpha通道的8位。不要在app圖標上使用透明色。
圖標的尺寸:蘋果有一份完整的文檔,列出了app所需的全部圖標尺寸,和其各自的使用環境。
ios-APP圖標尺寸和切圖規范 求給分!!~~