Android延伸布局到狀態欄,Android 狀態欄透明

前言:最近項目大量用到狀態欄透明,網上也出現很多庫可以直接拿來用,個人認為沒有必要那么重引用到一個庫(有木有同學和我有一樣的想法),所以研究了一番,在此做個記錄加強記憶也便后期查閱,如果無意中有幸能幫助到你那就再好不過了。

一、兩個基本概念

Android 從 4.4 (SDK 19) 開始支持系統欄(狀態欄+導航欄)半透明效果:

You can now make the system bars partially translucent with new themes,Theme.Holo.NoActionBar.TranslucentDecorandTheme.Holo.Light.NoActionBar.TranslucentDecor. By enabling translucent system bars, your layout will fill the area behind the system bars, so you must also enablefitsSystemWindowsfor the portion of your layout that should not be covered by the system bars.

If you're creating a custom theme, set one of these themes as the parent theme or include thewindowTranslucentNavigationandwindowTranslucentStatusstyle properties in your theme.

翻譯一下就是:

TranslucentDecor主題設置了兩個屬性windowTranslucentStatus和windowTranslucentNavigation都為 true,前者指定狀態欄半透明、后者指定導航欄半透明。

本文只探討“狀態欄”。

默認樣式是這樣:

1850dc5cfc8caa4c3d023f8fa0508a91.png

可見 Toolbar 和系統狀態欄之間有明顯的分界,我們要實現的效果是 Toolbar 和狀態欄背景統一,看起來像是一個整體(自行腦補圖片)。

按照官方文檔,我們自定義主題:

對應的 Activity 引用該主題:

android:name=".DetailActivity"

android:label="@string/title_activity_detail"

android:theme="@style/AppTheme.NoActionBar.TransparentStatusBar">

我看來看看效果:

91d1655371e0069c43d2ce791372cc5b.png

重要:圖上圖所示,在 TranslucentStatusBar 主題下,Android 4.4 狀態欄背景為默認黑色到透明的漸變,5.0+ 狀態欄背景默認為半透明的黑色。

雖然實現了半透明,但是布局被狀態欄覆蓋,接下來在布局文件中設置fitSystemWindows(注意加到根節點ConstraintLayout上):

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:fitsSystemWindows="true"

tools:context="com.netease.mail.statusbar.DetailActivity">

android:id="@+id/app_bar"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:theme="@style/AppTheme.AppBarOverlay"

app:layout_constraintTop_toTopOf="parent">

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

app:layout_collapseMode="pin"

app:popupTheme="@style/AppTheme.PopupOverlay"/>

android:layout_width="match_parent"

android:layout_height="0dp"

app:layout_constraintTop_toBottomOf="@id/app_bar"

app:layout_constraintBottom_toBottomOf="parent">

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_margin="@dimen/text_margin"

android:text="@string/large_text"/>

來看看效果:

de10e0bf450f043254028616cca32209.png

雖然布局沒有被狀態欄覆蓋,但是狀態欄背景顯然這不是我們想要的效果...

為什么狀態欄會這么奇怪?

文章開頭的定義中我們說了,布局文件會延伸到狀態欄所占區域下,fitsSystemWindows的作用是給對應的 View 增加 padding(這里以 ConstraintLayout 為例),目的是為了讓其內容不被狀態欄遮擋。

在我們的布局文件中 ConstraintLayout 沒有設置背景(默認白色),所以狀態欄默認的半透明背景色和 ConstraintLayout 的白色背景疊加,就變成了上圖中的效果。

【總結】兩個基本概念:

1、windowTranslucentStatus設置為true之后,狀態欄默認是半透明的(4.4 是黑色到透明色漸變,5.0+ 是純黑色半透明),和我們要求的透明相去甚遠。更重要的是,布局會延伸到狀態欄底下。

2、android:fitsSystemWindows 簡單理解就是 View 為了適配系統狀態欄和導航欄(不被遮擋)自動增加 padding,當然真正的實現原理比這復雜很多而且不同的 View 可以自定義實現方式。

二、透明效果如何實現

所以,為了實現文章開頭提出來的“狀態欄透明”效果,我們需要處理:

2.1 設置主題

設置 windowTranslucentStatus 為 true,讓狀態欄半透明。

2.2 布局自適應狀態欄

在根節點設置 android:fitsSystemWindows 使其不被狀態欄遮擋。

2.3 狀態欄透明

Android 4.4 暫時沒有辦法去掉狀態欄的漸變。

Android 5.0+ 開始支持修改狀態欄顏色,設置透明色即可把半透明去掉。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {

//兼容5.0及以上支持全透明

activity.window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)

activity.window.decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN or View.SYSTEM_UI_FLAG_LAYOUT_STABLE

activity.window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)

activity.window.statusBarColor = Color.TRANSPARENT

}通過 theme 設置無效。

看看效果:

6755c42a6061c54486a192e01968fe1c.png

2.4 給布局上色

我們看到即使狀態欄透明了,但是其底色是一片白,因為跟節點 ConstraintLayout 沒有設置背景,大多情況下我們不會給整個跟節點設置顏色,可以考慮把 android:fitsSystemWindows 設置到子 View 上,本例中是 AppBarLayout(5.0+ 無效,只能顯式給 AppBarLayout 加 padding,可以利用其背景色),實際項目中可靈活調整。

最終效果:

11ab8d9a8436380eda0cd2d13754464f.png

至此,完成狀態欄透明效果,網上有很多庫,實際上都是基于此原理,在此基礎上再自定義 View 做為狀態欄背景。

參考

本文來自網易實踐者社區,經作者黃仕彪授權發布。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/531595.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/531595.shtml
英文地址,請注明出處:http://en.pswp.cn/news/531595.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

glassfish服務器默認的網頁所在的位置

http://localhost:8080/ 默認打開的網頁所在的位置 E:/glassfish-4.1/glassfish/domains/domain1/docroot/index.html 轉載于:https://www.cnblogs.com/hujunzheng/p/4052920.html

華為HarmonyOS 鴻蒙,華為鴻蒙HarmonyOS2.0手機開發者Beta版正式發布

據悉,本次手機開發者Beta測試支持以下中國境內主制式手機及平板電腦。手機:全網通(5G雙卡)P40 、 全網通版P40 Pro、Mate30、Mate30(5G) 、Mate30 Pro、Mate30 Pro(5G),型號清單為ANA-AN00、ELS-AN00、TAS-AL00、TAS-AN00、LIO-AL00、LIO-AN0…

http協議客戶端向服務器端請求時一般需要發送的內容

out.println("GET /shopping/index.html HTTP/1.1");//請求行 包括請求方式,文件路徑, http協議版本(必寫)請求頭.... out.println("Aceept: */*");//客戶端能夠處理的文件類型(不是必須&#xff…

android oneshot自動播放bug,移動端常見bug匯總001

前言本文是摘錄整理了移動端常見的一些bug以及解決方案,第一篇,后面還會有持續的文章更新整理。點擊樣式閃動Q: 當你點擊一個鏈接或者通過Javascript定義的可點擊元素的時候,它就會出現一個半透明的灰色背景。A:根本原因是-webkit-tap-highli…

int.class 與 Integer.class

TYPE 表示的引用類型所對應的基本類型的Class對象! 轉載于:https://www.cnblogs.com/hujunzheng/p/4055471.html

android uber啟動動畫,模仿Uber的啟動畫面(上)

啟動畫面(Splash Screen)——不但給開發者們提供了一個盡情發揮、創建有趣動畫的機會,也填補了App啟動時從終端慢吞吞地下載數據的時間。啟動畫面(動態的)對于App至關重要:它可以讓用戶不失興趣地耐心等待應用完成加載。盡管現在的啟動畫面多種多樣&…

java中產生對象的兩種方式

/** 普通new對象的過程!*/Person pp new Person();System.out.println(pp);/** 利用代用參數的構造器產生對象實例!* 首先獲得相應帶參數的構造器,然后利用構造器產生對象實例!*/pclass Class.forName("get_class_method.P…

智慧屏用鴻蒙的生態,緊隨鴻蒙OS手機版 ,智慧屏為什么對鴻蒙生態這么重要?...

原標題:緊隨鴻蒙OS手機版 ,智慧屏為什么對鴻蒙生態這么重要?12 月 21 日,華為正式發布了兩款智慧屏新品,智慧屏 S 系列和車載智慧屏,前者是智慧屏的新系列,后者則是新開辟的車機產品線。沒有意外…

java中反射機制通過字節碼文件對象獲取字段和函數的方法

pclass Class.forName("get_class_method.Person");//Field ageField pclass.getField("age");//因為age成員變量是私有的,所以會產生NoSuchFieldException異常Field ageField pclass.getDeclaredField("age");//獲得該對象反映此…

MySQL不能插入中文字符及中文字符亂碼問題

MySQL的默認編碼是Latin1,不支持中文,要支持中午需要把數據庫的默認編碼修改為gbk或者utf8。在安裝后MySQL之后,它的配置文件不是很給力,不知道你們的是不是,反正我的是! 開始插入中文字符的時候出現如下錯…

android計算距離頂部的距離,(lua版)計算距離的邏輯是從Android的提供的接口(Location.distanceBetween)中拔來的,應該是最精確的方法了...

---coding by yuangu(lifulinghanaol.com)--用于計算2個pgs之間的距離function computeDistance(lat1, lon1,lat2, lon2)-- Based on http://www.ngs.noaa.gov/PUBS_LIB/inverse.pdf-- using the "Inverse Formula" (section 4)local MAXITERS 20;-- Convert lat/lo…

codeforces C. Bits(數學題+或運算)

題意:給定一個區間,求區間中的一個數,這個數表示成二進制的時候,數字1的個數最多! 如果有多個這樣的數字,輸出最小的那個! 思路:對左區間的這個數lx的二進制 從右往左將0變成1&#…

密碼與確認密碼自動驗證html,HTML確認密碼

今天準備分享一個小知識點,就是確認登錄界面輸入戶名: 輸入密碼: 確認密碼: function validate() {var pw1 document.getElementById("pw1").value;var pw2 document.getElementById("pw2").value;if(pw1 …

實現單詞大小寫不敏感的正則表達式的匹配!

//實現單詞大小寫不敏感的正則表達式的匹配! //方法1: tmp "java java JavaJAVA"; px Pattern.compile("java", Pattern.CASE_INSENSITIVE); mx px.matcher(tmp); System.out.println(mx.replaceAll("JAVA")); //方法二…

r語言 發送郵件html,r語言讀取數據的方法

R 對于基于 SQL 語言的關系型數據庫有良好的支持,這些數據庫既有商業數據庫 Oracle、Microsoft SQL Server、IBM DB2 等,也包含在 GNUGeneral Public License (GPL) 下發布的 MySQL 等開源數據庫。RMySQL 包中提供了到 MySQL 數據庫的接口;RO…

正則表達式之IP地址檢驗

String ipRegex "^(\\d|[1-9]\\d|1\\d*|2[0-4]\\d|25[0-5])(\\.\\1){3}$"; /* * \\d|[1-9]\\d|1\\d*|2[0-4]\\d|25[0-5] * 該段的數字只有一位的時候,兩位數字的時候,三位數字的時候(1開頭的和2開頭的) * \\1 表示向前…

eclipse開發web應用程序步驟(圖解)

*運行環境(也就是服務器的選擇) 環境搭建好之后開始編寫web程序!然后右鍵->Run as -> Run on Server! 轉載于:https://www.cnblogs.com/hujunzheng/p/4083560.html

android 測光模式,Android Camera1中的對焦與測光

Android Camera1開發系列連載:Android Camera1詳解Android Camera1顯示預覽的四種方式對焦模式在使用特定的對焦模式的時候,必須確保相機支持該模式,相機支持的對焦模式可以通過Parameters#getFocusMode接口來獲取:常用的對焦模式…

eclipes創建一個web項目web.xml不能自動更新的原因(web.xml和@WebServlet的作用)

在eclipse中創建一個Web項目的時候,雖然有web.xml生成,但是再添加Servlet類文件的時候總是看不見web.xml的更新,所以異常的郁悶!上網查了查,原來我們在創建Web項目的時候,會彈出一個對話框,“Dy…

android貝塞爾曲線多點,Canvas 貝塞爾曲線的多點波動

JavaScript語言:JaveScriptBabelCoffeeScript確定function Ball(x, y, radius) {this.x x;this.y y;this.radius radius;this.vx 20;this.vy 10;}Ball.prototype.draw function(ctx) {ctx.save();ctx.translate(this.x, this.y);ctx.fillStyle rgba(255, 255…