底部導航(Bottom Navigation)

材料設計之前是沒有底部導航這種形式的平窘,最開始提倡使用側邊導航金拒,后來從iOS平臺借鑒過來募书。蘋果和谷歌的設計語言都是相互借鑒和影響的窥摄,比如在蘋果設計中沒有頁面標簽這個控件(tab),而是分割按鈕(Segmented Controls)镶奉,后來標簽控件因為用戶的反饋良好也大量出現在iOS平臺應用上(雖然還沒有出現在官方的設計指南中)。從這一點看崭放,材料設計是更加開放哨苛,善于學習的。iOS的姿態(tài)更高一點币砂,比如在蘋果開發(fā)者大會上建峭,側邊導航的漢堡按鈕就被蘋果的設計師狠狠吐槽了,說是可視性(Visibility)不夠决摧。


底部導航

底部導航這種形式來自于iOS亿蒸,但卻不是完全搬過來,而是被優(yōu)化和加強了掌桩。iOS平臺上的底部導航一般是固定不動的边锁,只存在選中和為選中之間的狀態(tài)切換,典型如微信的頁面導航方式:


iOS底部導航

材料設計中的底部導航有以下幾點的不同:

一波岛、按鈕被選中時茅坛,不僅是透明度和顏色的變化,整體會上移2個像素则拷;

二贡蓖、導航頁面大于三個時,未選中的按鈕可以選擇不顯示名稱煌茬;

三斥铺、按鈕被選中時可以重新調整位置,以突出選中狀態(tài)的變化宣旱;

四仅父、頁面向下滾動時,底部導航可以暫時性隱藏浑吟,向上滾動時再重新顯示出來笙纤;

五、點擊按鈕组力,如果對應的視圖是數據列表時省容,可以再次刷新頁面;

六燎字、左右滑動可以在標簽之間切換腥椒,而不僅是點擊按鈕。

這些特點未出現在iOS的設計指南中候衍,卻被很多iOS平臺上的應用上笼蛛,比如京東應用上的“發(fā)現”按鈕,點擊下是可以再次刷新頁面:


京東底部導航蛉鹿,點擊按鈕刷新界面

再比如淘寶應用中首頁按鈕滨砍,結合了“回到頂部”功能且突出了選中狀態(tài),與材料設計的底部菜單定位也是不謀而合:


淘寶底部導航按鈕
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末妖异,一起剝皮案震驚了整個濱河市惋戏,隨后出現的幾起案子,更是在濱河造成了極大的恐慌他膳,老刑警劉巖响逢,帶你破解...
    沈念sama閱讀 221,695評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現場離奇詭異棕孙,居然都是意外死亡舔亭,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 94,569評論 3 399
  • 文/潘曉璐 我一進店門蟀俊,熙熙樓的掌柜王于貴愁眉苦臉地迎上來分歇,“玉大人,你說我怎么就攤上這事欧漱≈奥眨” “怎么了?”我有些...
    開封第一講書人閱讀 168,130評論 0 360
  • 文/不壞的土叔 我叫張陵误甚,是天一觀的道長缚甩。 經常有香客問我,道長窑邦,這世上最難降的妖魔是什么擅威? 我笑而不...
    開封第一講書人閱讀 59,648評論 1 297
  • 正文 為了忘掉前任,我火速辦了婚禮冈钦,結果婚禮上郊丛,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好厉熟,可當我...
    茶點故事閱讀 68,655評論 6 397
  • 文/花漫 我一把揭開白布导盅。 她就那樣靜靜地躺著,像睡著了一般揍瑟。 火紅的嫁衣襯著肌膚如雪十饥。 梳的紋絲不亂的頭發(fā)上智听,一...
    開封第一講書人閱讀 52,268評論 1 309
  • 那天责球,我揣著相機與錄音畏陕,去河邊找鬼。 笑死底循,一個胖子當著我的面吹牛巢株,可吹牛的內容都是我干的。 我是一名探鬼主播熙涤,決...
    沈念sama閱讀 40,835評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼纯续,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了灭袁?” 一聲冷哼從身側響起猬错,我...
    開封第一講書人閱讀 39,740評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎茸歧,沒想到半個月后倦炒,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 46,286評論 1 318
  • 正文 獨居荒郊野嶺守林人離奇死亡软瞎,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 38,375評論 3 340
  • 正文 我和宋清朗相戀三年逢唤,在試婚紗的時候發(fā)現自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片涤浇。...
    茶點故事閱讀 40,505評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡鳖藕,死狀恐怖,靈堂內的尸體忽然破棺而出只锭,到底是詐尸還是另有隱情著恩,我是刑警寧澤,帶...
    沈念sama閱讀 36,185評論 5 350
  • 正文 年R本政府宣布蜻展,位于F島的核電站喉誊,受9級特大地震影響,放射性物質發(fā)生泄漏纵顾。R本人自食惡果不足惜伍茄,卻給世界環(huán)境...
    茶點故事閱讀 41,873評論 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望施逾。 院中可真熱鬧敷矫,春花似錦例获、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,357評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至整葡,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間讥脐,已是汗流浹背遭居。 一陣腳步聲響...
    開封第一講書人閱讀 33,466評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留旬渠,地道東北人俱萍。 一個月前我還...
    沈念sama閱讀 48,921評論 3 376
  • 正文 我出身青樓,卻偏偏與公主長得像告丢,于是被迫代替她去往敵國和親枪蘑。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,515評論 2 359

推薦閱讀更多精彩內容

  • 用到的組件 1岖免、通過CocoaPods安裝 2岳颇、第三方類庫安裝 3、第三方服務 友盟社會化分享組件 友盟用戶反饋 ...
    SunnyLeong閱讀 14,625評論 1 180
  • 組件 底部導航(Bottom navigation) 底部導航欄使得最高級視圖之間的切換和瀏覽變得非常容易颅湘。 使用...
    _薯泥雞腿_閱讀 6,846評論 0 4
  • 裝備買了一個多星期了话侧,今天決定持續(xù)打卡!不能浪費裝備錢闯参,要好好利用瞻鹏! 畫了個長方形,總覺得畫面臟臟的鹿寨,明暗關系沒處...
    徐二閱讀 129評論 0 0
  • 第一天打卡+第二天打卡 讀完上一本《捕捉兒童敏感期》之后新博,再去閱讀《愛和自由》,發(fā)現這里面更多的是干貨啊脚草,可是理解...
    在鳴閱讀 387評論 0 0
  • 南美的圣木 白鷹醫(yī)藥療愈塔羅 意識和我們的眉心輪相連的赫悄。 寶劍一代表非常明確的某種意識 飽滿的生活。
    體面事物所的紀先生閱讀 228評論 0 0