android導航欄高度
Ⅰ Android和IOS UI規范有什麼區別
UI設計師在根據原型進行設計稿設計的時候,Android和IOS UI規范都是不同的,最好的條件下就會製作兩個版本的設計稿來進行開發,下面我們一起來了解一下Android和IOS UI規范的區別。
- 01
先從設計稿尺寸開始說,Android的設計稿尺寸我們選擇的是360*640,而IOS的設計稿尺寸為375*667。
- 02
從上到下開始了解,最上方的是狀態欄,Android狀態欄的高度為25px,IOS狀態欄的高度為20px。
- 03
接下來就是導航欄,Android導航欄的高度為45px,IOS導航欄的高度為49px,兩個版本中導航文字都是18px。
- 04
IOS導航欄有一點不同,那就是下方會多1px的分界,一般我們可用描邊,或者是用Y=1的陰影來表示。
- 05
最下邊就是標簽欄了,Android標簽欄的高度為50px,IOS標簽欄的高度為49px。
- 06
IOS的標簽也不同,也有向上的1px分界,用Y=-1的陰影或者是描邊來表示。
- 07
在標簽欄中肯定就是ICON圖標了,Android和IOS的圖標點擊范圍最小都是24px,IOS±4px調整,Android±8px調整。
- 08
關於設計的時候排版間距的問題,我的習慣是按照8px的倍數來排版,當然你也可以用10px,看個人習慣了。
特別提示
本文尺寸均為1x。
Ⅱ android導航欄高度是多少
這個不是絕對的,這個要看手機廠商,
Android'可以通過方法獲取到這個高度
java">(Contextcontext){
intresult=0;
intresourceId=0;
intrid=context.getResources().getIdentifier
("config_showNavigationBar","bool","android");
if(rid!=0){
resourceId=context.getResources().
getIdentifier("navigation_bar_height","dimen","android");
CMLog.show("高度:"+resourceId);
CMLog.show("高度:"+context.getResources().getDimensionPixelSize(resourceId)+"");
returncontext.getResources().getDimensionPixelSize(resourceId);
}else
return0;
}
Ⅲ 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、對話框的左邊一般情況下是取消按鈕,右邊是確定按鈕;
Ⅳ android app 界面設計按什麼尺寸
android app 界面設計是按720*1280的,切圖上可以點9切圖做到所有手機的適配。
狀態欄、導航欄和主菜單欄,以720*1280的尺寸來設計,那麼狀態欄的高度應為50px,導航欄的高度96px,主菜單欄的高度96px,因為是開源的系統,這里的數值也只能作為參考。
Android為了區別於IOS,從4.0開始提出了一套HOLO的UI風格設計風格,鼓勵將底部的主菜單欄放到導航欄下面,從而避免點擊下方材料誤點虛擬按鍵,很多APP的新版中也採用了這一風格。
(4)android導航欄高度擴展閱讀:
注意事項:
1、通常情況要定位一個Icon只需給出 上/下邊距,左/右邊距,標注圖標距離只需標到可點擊范圍外
通用型顏色、字體單獨標明一份,通用型模塊只需單獨標明一份,如導航欄。
2、手機可視區域通常為寬度固定,長度超出邊界可滑動,所以標注物體寬度時可按比例說明,如果要標注內容上下居中,左右居中,或等比可不標注。
3、當交付的是一張完整圖片時,不需做機型適配,只需給高清圖(1920*1080)即可,注意進行壓縮。
4、若圖標在不同頁面重復出現,且尺寸相差不大,直接給出最大一份切圖,並在圓形圖標明尺寸,程序會根據需求縮放。
5、當背景是純色時只需給出色值,Android使用16進制色值。
參考資料來源:網路-Android
參考資料來源:網路-界面設計
參考資料來源:網路-狀態欄
參考資料來源:網路-導航欄
參考資料來源:網路-開源系統
參考資料來源:網路-切圖
參考資料來源:網路-UI設計
Ⅳ android 狀態欄高度是多少
是的,800高度里包括了狀態欄設計范圍應該是780高度。
Ⅵ android狀態欄高度是多少
一般我覺得45dp就可以了
Ⅶ 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導航欄高度是多少
屏幕高度都是包括了狀態欄和導航欄的高度的
2.獲取控制項尺寸
如果我們在onCreate()方法里直接調用getWidth()、getMeasuredWidth()獲得的尺寸為0,這是由於在onCreate()中,我們的控制項還沒有畫好,等onCreate()執行完了,我們的控制項才被測量出來,我們可以注冊一個監聽器,用來監聽測量結果
ViewTreeObserver vto = mButton.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() { @Override
public void onGlobalLayout() { //移除上一次監聽,避免重復監聽
mButton.getViewTreeObserver().removeGlobalOnLayoutListener(this); //在這里調用getHeight()獲得控制項的高度
buttonHeight = mButton.getHeight();
}
});1234567891011
3.獲得狀態欄/通知欄的高度
public static int getStatusBarHeight(Context context){
Class<?> c = null;
Object obj = null;
Field field = null; int x = 0, statusBarHeight = 0; try {
c = Class.forName("com.android.internal.R$dimen");
obj = c.newInstance();
field = c.getField("status_bar_height");
x = Integer.parseInt(field.get(obj).toString());
statusBarHeight = context.getResources().getDimensionPixelSize(x);
} catch (Exception e1) {
e1.printStackTrace();
} return statusBarHeight;
}12345678910111213141516
4.獲得導航欄高度
public int getNavigationBarHeight(Activity activity) {
Resources resources = activity.getResources(); int resourceId = resources.getIdentifier("navigation_bar_height","dimen", "android"); //獲取NavigationBar的高度
int height = resources.getDimensionPixelSize(resourceId); return height;