版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)
文檔簡介
1、IOS Android APP UI設(shè)計規(guī)范iOS 篇 iOS 界面尺寸設(shè)備設(shè)備分辨率分辨率PPI狀態(tài)欄高度狀態(tài)欄高度導(dǎo)航欄高度導(dǎo)航欄高度標簽欄高度標簽欄高度Iphone6 plus1080 x1920 px401 ppi54 px132 px146 pxIphone6/6s750 x1334 px326 ppi40 px88 px98 pxIphone5/5c/5s640 x1136 px326 ppi40 px88 px98 pxIphone4/4s640 x960 px326 ppi40 px88 px98 pxppi(pixels per inch)即每英寸像素,也叫像素密度。圖標尺寸
2、設(shè)備設(shè)備APP store程序應(yīng)用程序應(yīng)用主屏幕主屏幕Spotlight搜索搜索標簽欄標簽欄工具欄工具欄/導(dǎo)導(dǎo)航欄航欄Iphone6 plus1024x1024px180 x180 px114x114px87x87 px75x75 px66x66 pxIphone6/6s1024x1024px120 x120px114x114px58x58 px75x75 px44x44 pxIphone5/5c/5s1024x1024px120 x120px114x114px58x58 px75x75 px44x44 pxIphone4/4s1024x1024px120 x120px114x114px58x
3、58 px75x75 px44x44 pxIphone6 圖例狀態(tài)欄規(guī)范 用戶依賴于狀態(tài)欄的重要信息,如信號,時間和電池。文本和圖標可以是白色或黑色,但背景可以被設(shè)計成任何顏色,并與導(dǎo)航欄合并。pt(point)是印刷業(yè)上長使用的單位,磅的意思,是一種固定的長度單位,可以用測量設(shè)備測量的單位。pt=px*3/4 1pt=1/72英寸導(dǎo)航欄規(guī)范 導(dǎo)航欄是用于屏幕的快速信息。左邊部分可用于配置文件,菜單按鈕,而右邊的部分是一般用于動作按鈕,如添加,編輯,完成。請注意,如果您使用這些系統(tǒng)圖標,您不需要為它們單獨設(shè)計。搜索欄工具欄Stepper控件 提示框 提示對話框是用于輸送關(guān)鍵信息和提示快速操作。
4、提示應(yīng)保持最少文字,退出一定是明顯。分段控制框滑塊開關(guān) 布局標準控件 布局原理(8px原理由來) 由于ios技術(shù)開發(fā)是以320 x640px為標準開發(fā)的,所以此設(shè)定尺寸為1,算出各個尺寸的比例,然后乘以4,各個尺寸都能滿足是整數(shù),可以保證開發(fā)時不會模糊。2px(視網(wǎng)膜屏的到來)切圖設(shè)計稿尺寸是640 x960px,所以設(shè)計時最小的單位尺寸是8px。 使用8px原理的目的 保證在雙平臺上大部分機型開發(fā)中不會出現(xiàn)模糊的變形的問題;而且只需設(shè)計一套設(shè)計稿,減少設(shè)計師的工作量,提高工作效率。ios 1334x750 pxIphone6/6s 圖標網(wǎng)絡(luò) Apple使用黃金分割在它們的一些圖標上。這讓圖標
5、保持良好的比例,同時確保了美感。雖然這是一個很好的規(guī)范,但它不是嚴格要求。甚至Apple在很多圖標上也省略了它。 標準色 字體大小、規(guī)格一般的規(guī)范是按鈕用44pt、小文字用12pt、正文文本用17pt和標題用20pt+。IOS 9 中文字體:蘋方/PingFang SCIOS 8 中文字體:常州華文的黑體-簡,在mac os x 系統(tǒng)中選擇 黑體-簡IOS 英文、數(shù)字:Helvetial 間距和對齊方式 一般的規(guī)范最低要求8pt空白或邊距。這將有足夠留白空間,使得布局更容易掃描和文本更具可讀性。而且在此基礎(chǔ)上,UI元素應(yīng)對齊,文本應(yīng)該有相同的基線位置。Android篇Android 界面尺寸
6、界面尺寸(1280 x720px)狀態(tài)欄高度:50 px導(dǎo)航欄高度:96 px標簽欄高度:96 pxAndroid最近出的手機都幾乎去掉了實體鍵,把功能鍵移到了屏幕中,當然高度也是和標簽欄一樣的:96 px內(nèi)容區(qū)域高度為:1038 px (1280-50-96-96=1038)常用尺寸一般把48dp作為可觸碰UI原件的標準,48dp=72px=9mm,這是一個用戶手指能夠準確舒適觸碰的最小尺寸。Android界面默認list的高度是:48dp=72px;Android界面每個元素之間最小的間距是:8dp=12px;Android界面默認btn的高度是:40dp=60pxpx=ppi/160*d
7、p常用屏幕尺寸240 x320 ldpi (低等屏幕)320 x480 mdpi (中等屏幕)480 x800 hdpi (高清屏幕)720 x1280 xhdpi (超高清屏幕)相應(yīng)的圖片資源尺寸的比例關(guān)系為1:1.5: 2也就是第一套圖為mdpi的資源圖片,hdpi可調(diào)整到150%,xhdpi可調(diào)整到200%。字體規(guī)范、大小5.X版本:思源黑體/Noto Sans Han5.0以下版本:Droid Sans Fallback,可用 文泉驛微米黑 代替英文、數(shù)字:Roboto標題(58px或60px) 二級標題(44px或48px) 正文字體(32px或36px);英文最小字號22px,中文
8、最小字號。SP與DP介紹 dp:device independent pixelsdevice independent pixels(設(shè)備獨立像素)。 spsp:scaled pixels(放大像素), 主要用于字體顯示best for textsize。由此,根據(jù) google 的建議,TextView 的字號最好使用 sp 做單位,而且查看TextView的源碼可知 Android 默認使用 sp 作為字號單位。 sp和dp一樣,是android開發(fā)里特有的單位,設(shè)計師在做UI設(shè)計的時候 通常最初是建立320*480這個尺寸的畫布開始的,這個尺寸的畫布 在android分辨率的分類中稱為mdpi,在這個尺寸下,ps里的1px就等于android中的1dp,同樣,這個時候1點的字就等于 android中1sp,舉個例子:你建立畫布的尺寸是320-480,里面的文字是30點,那么它就是30sp。 一般android設(shè)置長度和寬度多用dp,設(shè)置字體大小多用sp. 在屏幕密度為160,1dp=1px,當屏幕密度為240時,1dp=1.5px.48DP定律 48dp作為安卓可觸摸的UI元件的標準。 一般來說,48dp轉(zhuǎn)化為一個物理尺寸約9毫米。建議的目標大小為7-10毫米的范
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
- 6. 下載文件中如有侵權(quán)或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 服務(wù)-易耗供應(yīng)品購置申請表
- 人員安全及工傷應(yīng)急處理預(yù)案
- 小兒血液透析的護理
- 深靜脈血栓護理
- 辦公玻璃隔斷安裝合同
- 管道聚氨酯泡沫保溫施工方案
- 工業(yè)自動化工業(yè)自動化設(shè)備研發(fā)及生產(chǎn)計劃
- 中等職業(yè)技術(shù)學校學生實習工作方案
- 家具制造業(yè)智能制造與綠色生產(chǎn)策略
- 幼兒園安全工作檔案管理制度
- 新《勞動法》知識學習考試題庫200題(含答案)
- 2024-2030年中國帆船行業(yè)市場深度調(diào)研及發(fā)展趨勢與投資前景研究報告
- 2021年新版《思想道德與法治》第六章課件-學習法治思想提升法治素養(yǎng)
- 2024年新《公司法》主要修訂內(nèi)容解讀
- 投資協(xié)議對賭條款范本
- 鈉表的使用與檢驗
- 水電工程合同模板
- 廉江市縣域公共建筑屋頂分布式光伏合作協(xié)議V2 -
- CQC 11-463901-2011 額定電壓300∕500V生活設(shè)施加熱和防結(jié)冰用加熱電纜安全認證規(guī)則
- 微生物限度檢查操作規(guī)程中國藥典四部通則
- 智慧校園信息化合同
評論
0/150
提交評論