成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

Android沉浸式狀態欄實現

移動開發 Android
應用市場上App越來越多的出現沉浸式狀態欄的設計(如下圖所示)狀態欄和導航欄具有相同的顏色。Android在4.4開始對于該種效果的支持,而在4.4之下,狀態欄只是黑框,無法控制。同時在4.4和5.0及其之上的版本對該種效果的支持又有所差異,因此要實現該種效果,可以將4.4歸為一類,5.0及其之上歸為一類。

應用市場上App越來越多的出現沉浸式狀態欄的設計(如下圖所示)狀態欄和導航欄具有相同的顏色。Android在4.4開始對于該種效果的支持,而在4.4之下,狀態欄只是黑框,無法控制。同時在4.4和5.0及其之上的版本對該種效果的支持又有所差異,因此要實現該種效果,可以將4.4歸為一類,5.0及其之上歸為一類。接下來,我們將一步步來在4.4和5.0及其之上來實現如下所示效果。 

 

 

 

導航欄問題

在Android中,頂部導航欄目前常用的兩種實現方式,一個是通過Toolbar,一個是通過自定義View的方式來實現。兩種方式各有利弊。Toolbar為官方指定規范,開發者使用更方便,但可拓展性差,對于一些特殊的展示效果無法實現,而通過自定義方式的方式,可以支持更多展示效果,但卻需要我們寫更多的代碼。兩種方式在實現狀態欄沉浸上也有所差別。

去掉Title

  • Toolbar默認主題會具有一個title,當我們使用Toolbar的時候,而沒有去掉title,應用則會crash,報出如下所示錯誤。 

 

 

 

因此在使用Toolbar 的時候,我們需要style中添加如下屬性配置

  1. <item name="windowNoTitle">true</item> 

當然我們也可以通過代碼動態去掉title,但當我們的主題從Theme.AppCompat作為父類繼承的時候,通過代碼并不可以去掉title。

自定義導航欄 

 

 

 

當我們未設置windowNoTitle屬性的時候,在導航欄之上有title。顯然和我們要實現導航欄的沉浸式有所違背,因此實現對于導航欄的沉浸,

<item name="windowNoTitle">true</item>該配置是必不可少的。

設置狀態欄透明

去掉title之后,是否我們就可以實現上述的效果了呢? 

 

 

 

這個時候,我們發現狀態欄還是黑色,并沒有沉浸,需要我們將狀態欄設置為透明。

  1. <item name="android:windowTranslucentStatus">true</item> 

該屬性只有在在4.4和高于4.4版本上可以進行該屬性的配置,但是在更低版本上則無法使用。配置該屬性之后,執行效果如下圖所示。 

 

 

 

解決導航欄上移問題

這個時候,Toolbar被整體上移了,導致其部分功能也進入了狀態欄之下,包括導航欄的內容也到了狀態欄位置之中,顯然這是不符合我們最初的要求的。如何解決這個問題?我們在Toolbar中添加fitSystemWindows屬性,即可使得toolbar的上部空出一個高度,使得Toolbar內容部分脫離狀態欄。

  1. <android.support.v7.widget.Toolbar 
  2.        android:id="@+id/toolbar" 
  3.        android:fitsSystemWindows="true" 
  4.        android:layout_width="match_parent" 
  5.        android:layout_height="wrap_content"
  6.    </android.support.v7.widget.Toolbar>  

得到我們最終想要得到的效果 

 

 

 

自定義導航欄與之實現類似。

fitsSystemWindows屬性

前面對Toolbar的設置是在Toolbar中添加的fitSystemWindows屬性,那么當我們將其屬性添加到Toolbar所在的最外層的布局會怎么樣呢?

  1. <RelativeLayout 
  2.     xmlns:android="http://schemas.android.com/apk/res/android" 
  3.     xmlns:tools="http://schemas.android.com/tools" 
  4.     android:id="@+id/activity_toolbar" 
  5.     android:layout_width="match_parent" 
  6.     android:layout_height="match_parent" 
  7.     android:fitsSystemWindows="true" 
  8. tools:context="com.example.netease.toolbardemo.activity.ToolbarActivity"
  9.  
  10.     <android.support.v7.widget.Toolbar 
  11.         android:id="@+id/toolbar" 
  12.         android:layout_width="match_parent" 
  13.         android:layout_height="wrap_content"
  14.     </android.support.v7.widget.Toolbar> 
  15.  
  16. </RelativeLayout>  

執行之后,可以看到和之前未設置狀態欄透明時的效果相同。 

 

 

 

那么這個fitSystemWindows工作的原理是什么呢?通過上述實驗,不難發現,對于沉浸狀態欄的控制,該屬性起到了一個很關鍵的作用。

接下來通過一個實驗來驗證下,該屬性所起的作用,在Toolbar所在的布局中,在布局的底部添加一個Button.

  1. <android.support.v7.widget.Toolbar 
  2.         android:id="@+id/toolbar" 
  3.         android:fitsSystemWindows="true" 
  4.         android:layout_width="match_parent" 
  5.         android:layout_height="wrap_content"
  6.     </android.support.v7.widget.Toolbar> 
  7.  
  8.     <Button 
  9.         android:text="Test" 
  10.         android:layout_width="match_parent" 
  11.         android:layout_height="wrap_content" 
  12.         android:background="@color/colorAccent" 
  13.         android:layout_alignParentBottom="true"/>   

 

 

 

當我們將該屬性設置到按鈕上,又會發生什么呢?

  1. <Button 
  2.        android:text="Test" 
  3.        android:fitsSystemWindows="true" 
  4.        android:layout_width="match_parent" 
  5.        android:layout_height="wrap_content" 
  6.        android:background="@color/colorAccent" 
  7.        android:layout_alignParentBottom="true"/>  

 

 

 

 

通過比較可以很明顯的看出,設置了fitsSystemWindows屬性的View在其上部被設置了一個padding。根據之前做的實驗,我們可以知道當我們設置了窗口狀態欄透明之后,整個內容視圖會向上移動了一個狀態欄的高度,而當前為該View增加的padding的大小是不是和其高度相同呢?

  1. Button btn = (Button) findViewById(R.id.test_btn); 
  2.  Log.i("padding", btn.getPaddingTop()+""); 
  3.  Rect frame = new Rect(); 
  4.  getWindow().getDecorView().getWindowVisibleDisplayFrame(frame); 
  5.  Log.i("height", frame.top+"");  

獲取按鈕的padding高度和狀態欄的高度,我們可以得到如下日志。 

 

 

 

通過實驗我們可以得出結論,fitSystemWindows屬性會對所設置的View增加一個top padding,因此當我們在實現讓導航欄沉浸的時候,設置窗口狀態欄的透明會使得視圖整體上移,而借助fitSystemWindows屬性的功能,為視圖中最頂部的View設置一個和狀態欄高度相同的padding,使得導航欄不會被頂到狀態欄內。

當我們在一個視圖中,多個View設置該屬性時,發現只有***個設置該屬性的View會起作用,在視圖布局上,自上而下的***個View其作用。層級上則為最***的View上首先其作用。因此其功能歸納為:

  • 為設置該屬性的View增加一個和狀態欄高度相同的toppadding
  • 當視圖中有多個View被設置了該屬性,那么只布局上最頂部的View起作用

5.0及其以上

至此,我們可以***的實現一個狀態欄的沉浸,上述的實現是在Android 4.4版本上,在視圖的最上部,會有一個黑色漸變的陰影,而在5.0設備上的展示效果如下所示,在狀態欄上整個都會有一個陰影。當然不同廠家對此也有自己的一些優化,比如魅族在4.4上是不具有陰影的。 

 

 

 

對于5.0及其之上,官方提供了對狀態欄顏色控制的相應API,我們可以通過代碼來控制狀態欄的顏色,實現如下效果。 

 

 

 

實現代碼

  1. if(Build.VERSION.SDK_INT >= 21) { 
  2.             Window window = getWindow(); 
  3.             //取消設置透明狀態欄,使 ContentView 內容不再沉浸到狀態欄下 
  4.             window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS); 
  5.             //需要設置這個 flag 才能調用 setStatusBarColor 來設置狀態欄顏色 
  6.             window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS); 
  7.             //設置狀態欄顏色 
  8.             window.setStatusBarColor(getResources().getColor(R.color.yx_red)); 
  9.         }  

據此可以看出,當我們在5.0及其之上的實現中,可以不用進行狀態欄透明的設置和fitSystemWindows屬性的設置,直接通過代碼來控制,但為了適應4.4版本,建議在代碼中仍然按之前的方式實現,如果想在5.0及其高版本中實現去陰影,再手動在代碼中控制。 

責任編輯:龐桂玉 來源: segmentfault
相關推薦

2016-11-29 11:20:08

Android

2021-08-09 20:29:27

Android沉浸式狀態欄

2017-12-05 12:44:57

Android沉浸式狀態欄APP

2022-11-23 14:47:29

北向開發鴻蒙

2014-06-06 14:03:13

iOS狀態欄提示控件原理

2013-07-18 16:09:10

自定義iOS狀態欄iOS開發iOS學習

2022-02-22 09:16:41

AndroidWindows狀態欄

2015-02-12 14:49:36

CGToast狀態欄提示Status

2012-12-24 14:42:48

iOS自定義狀態欄

2013-11-20 15:08:32

iOS開發狀態欄

2021-06-15 15:04:38

Android 12安卓通話

2021-06-15 15:28:31

谷歌Android開發

2022-03-16 15:30:25

barAndroid開發者

2018-05-16 09:11:19

Android狀態欄移動系統

2016-11-18 08:41:23

2011-06-16 11:15:04

2023-05-30 14:50:20

界面開發鴻蒙

2021-10-20 07:39:12

谷歌安卓 Android 12

2020-11-23 14:29:22

Android 10窗口代碼

2023-07-12 23:27:24

Powerline編輯器
點贊
收藏

51CTO技術棧公眾號

主站蜘蛛池模板: 日韩第1页 | 国产专区在线 | 国产免费一区二区三区免费视频 | 激情av在线 | 欧美色性| 欧美精品1区2区3区 精品国产欧美一区二区 | 亚洲品质自拍视频 | 91精品国产综合久久香蕉922 | 久久久免费少妇高潮毛片 | 免费成人在线网站 | 久草免费在线视频 | 在线免费黄色小视频 | 成人免费视频网站在线观看 | 一级片片| 国产高清不卡 | 中文字幕国产 | 亚洲顶级毛片 | 欧美日韩亚洲国产 | 久久久久久美女 | 一区二区三区免费 | 久久99久久98精品免观看软件 | 欧美日韩国产一区二区三区不卡 | 三级黄色片在线观看 | 天天草夜夜骑 | 欧美日韩三区 | 日韩av最新网址 | 成人综合视频在线 | 2019天天干天天操 | 国产一级片免费视频 | 91视在线国内在线播放酒店 | 真人毛片 | 免费观看黄 | 精品视频99| 国产精品一区一区 | 欧美日韩国产一区二区三区 | 欧美在线观看免费观看视频 | 国产日韩欧美激情 | 一级二级三级在线观看 | 色香婷婷 | 密室大逃脱第六季大神版在线观看 | 日韩一级免费电影 |