沉浸纺弊、透明及白底黑字狀態(tài)欄技巧

我們知道,Android5.0以上已經(jīng)可以通過設(shè)置colorPrimaryDark來改變狀態(tài)欄的顏色骡男。但是俭尖,大多數(shù)Android開發(fā)者都會(huì)遇到讓系統(tǒng)狀態(tài)欄透明或者半透明的需求,如下圖所示:

透明
半透明

讀這篇文章之前建議研讀郭神的Android狀態(tài)欄微技巧洞翩,帶你真正理解沉浸式模式。這里我們堅(jiān)決不考慮4.4以下的系統(tǒng)焰望,那么基本上可以分為幾種情況骚亿,4.4、 5.0以上6.0以下熊赖、 6.0+来屠。

本篇文章目錄:
1.透明與半透明狀態(tài)欄
2.結(jié)合Toolbar使用技巧
3.白底黑字狀態(tài)欄
4.其他注意事項(xiàng)

透明與半透明狀態(tài)欄

首先我們實(shí)現(xiàn)上邊兩圖的效果,注意下版本的判斷,直接上代碼:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    View decorView = getWindow().getDecorView();
    int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
        | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
    decorView.setSystemUiVisibility(option);
    getWindow().setStatusBarColor(Color.TRANSPARENT);
    //getWindow().setStatusBarColor(Color.parseColor("#40000000"));  //此種效果為類似QQ的半透明狀態(tài)欄
} else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS, WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
}

版本號(hào)為21以上時(shí)俱笛,效果便如上邊兩圖所示捆姜,4.4系統(tǒng)則如下圖所示:

4.4效果

結(jié)合標(biāo)題欄使用的技巧

上述方法基本上已經(jīng)實(shí)現(xiàn)了透明狀態(tài)欄的效果,但是我們添加一個(gè)Toolbar迎膜,設(shè)置各種屬性后泥技,各種元素都上移了,如下圖所示:

上移效果

部分開發(fā)者用android:fitsSystemWindows = "true"磕仅,然后給狀態(tài)欄添加一個(gè)View來解決珊豹,經(jīng)本人各種實(shí)驗(yàn)后,發(fā)現(xiàn)這種方法不太適合自己榕订。
這里采用一個(gè)比較直接的方式店茶,設(shè)置透明后相當(dāng)于toolbar已經(jīng)被拉長,所以為其設(shè)置一個(gè)padding值來解決問題劫恒,代碼如下贩幻,ScreenUtils為獲取屏幕屬性的一個(gè)工具類:

mToolbar = (Toolbar) findViewById(R.id.toolbar_common);
if (mToolbar != null) {
    mToolbar.getLayoutParams().height += ScreenUtils.getStatusHeight(getApplicationContext());
    mToolbar.setPadding(0, ScreenUtils.getStatusHeight(getApplicationContext()), 0, 0);
    setSupportActionBar(mToolbar);
    ActionBar supportActionBar = getSupportActionBar();
    if (supportActionBar != null) {
        supportActionBar.setDisplayShowTitleEnabled(false);  //此處是為了不顯示默認(rèn)的標(biāo)題
    }
}

設(shè)置之后,就達(dá)到我們想要的效果了两嘴。

白底黑字狀態(tài)欄

有時(shí)候我們的toolbar背景為淺色甚至是白色丛楚,如果不加修飾的話,狀態(tài)欄的文字由于默認(rèn)白色溶诞,導(dǎo)致很難分辨鸯檬。6.0以上系統(tǒng)直接提供了方法,但是考慮到其他版本螺垢,需要具體判斷:

//設(shè)置狀態(tài)欄文字為暗色
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
    //6.0以上可以通過直接設(shè)置SYSTEM_UI_FLAG_LIGHT_STATUS_BAR屬性即可喧务。
    getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
} else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    getWindow().setStatusBarColor(Color.GRAY);  //21以上不支持6.0直接設(shè)置的方法,可用灰色代替枉圃,具體可自己設(shè)置
    //getWindow().setStatusBarColor(Color.parseColor("#40000000"));
} else  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN){
    getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);//4.4版本本身就含有暗色陰影功茴,不作其他處理即可
}

效果圖如下:

6.0效果:
6.0白色

5.0以上6.0以下:
5.0以上6.0以下

4.4效果:
4.4效果

注意事項(xiàng)

上述方法基本上已經(jīng)可以滿足大部分需求了,效果都可以稱為(半)透明狀態(tài)欄孽亲。下邊看看真正的沉浸式狀態(tài)欄坎穿,狀態(tài)欄文字和導(dǎo)航欄都被隱藏:

沉浸

代碼如下:


@Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    if (hasFocus && Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
        View decorView = getWindow().getDecorView();
        decorView.setSystemUiVisibility(
        View.SYSTEM_UI_FLAG_LAYOUT_STABLE
        | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
        | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
        | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
        | View.SYSTEM_UI_FLAG_FULLSCREEN
        | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
    }
}

實(shí)際開發(fā)中,我們當(dāng)然不可能每個(gè)Activity中都寫一大堆重復(fù)的代碼返劲,所以建議講透明狀態(tài)欄的代碼封裝在BaseActivity中玲昧,然后Toolbar設(shè)置相同的id,或者使用<include>標(biāo)簽公用篮绿,自定義的一個(gè)布局或者其他View也是同理孵延。
Demo中做了一些簡單的封裝,可以參考下亲配,具體實(shí)現(xiàn)還是需要看具體的需求尘应。

本文所有代碼的地址,戳 我的Github 惶凝,在StatusBar包中。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末犬钢,一起剝皮案震驚了整個(gè)濱河市苍鲜,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌玷犹,老刑警劉巖混滔,帶你破解...
    沈念sama閱讀 211,290評論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異箱舞,居然都是意外死亡遍坟,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,107評論 2 385
  • 文/潘曉璐 我一進(jìn)店門晴股,熙熙樓的掌柜王于貴愁眉苦臉地迎上來愿伴,“玉大人,你說我怎么就攤上這事电湘「艚冢” “怎么了?”我有些...
    開封第一講書人閱讀 156,872評論 0 347
  • 文/不壞的土叔 我叫張陵寂呛,是天一觀的道長怎诫。 經(jīng)常有香客問我,道長贷痪,這世上最難降的妖魔是什么幻妓? 我笑而不...
    開封第一講書人閱讀 56,415評論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮劫拢,結(jié)果婚禮上肉津,老公的妹妹穿的比我還像新娘。我一直安慰自己舱沧,他們只是感情好妹沙,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,453評論 6 385
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著熟吏,像睡著了一般距糖。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上牵寺,一...
    開封第一講書人閱讀 49,784評論 1 290
  • 那天悍引,我揣著相機(jī)與錄音,去河邊找鬼帽氓。 笑死吗铐,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的杏节。 我是一名探鬼主播唬渗,決...
    沈念sama閱讀 38,927評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼奋渔!你這毒婦竟也來了镊逝?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,691評論 0 266
  • 序言:老撾萬榮一對情侶失蹤嫉鲸,失蹤者是張志新(化名)和其女友劉穎撑蒜,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體玄渗,經(jīng)...
    沈念sama閱讀 44,137評論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡座菠,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,472評論 2 326
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了藤树。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片浴滴。...
    茶點(diǎn)故事閱讀 38,622評論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖岁钓,靈堂內(nèi)的尸體忽然破棺而出升略,到底是詐尸還是另有隱情,我是刑警寧澤屡限,帶...
    沈念sama閱讀 34,289評論 4 329
  • 正文 年R本政府宣布品嚣,位于F島的核電站,受9級特大地震影響钧大,放射性物質(zhì)發(fā)生泄漏翰撑。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,887評論 3 312
  • 文/蒙蒙 一啊央、第九天 我趴在偏房一處隱蔽的房頂上張望眶诈。 院中可真熱鬧,春花似錦劣挫、人聲如沸册养。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,741評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽球拦。三九已至,卻和暖如春帐我,著一層夾襖步出監(jiān)牢的瞬間坎炼,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評論 1 265
  • 我被黑心中介騙來泰國打工拦键, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留谣光,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,316評論 2 360
  • 正文 我出身青樓芬为,卻偏偏與公主長得像萄金,于是被迫代替她去往敵國和親蟀悦。 傳聞我的和親對象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,490評論 2 348

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,756評論 25 707
  • 前言 首先請大家看幾張圖: 以上的效果氧敢,一般我們統(tǒng)稱為沉浸式狀態(tài)欄日戈。其實(shí),這種叫法不是很準(zhǔn)確孙乖,而且也沒有沉浸式狀態(tài)...
    宇是我閱讀 3,811評論 2 28
  • 首先浙炼,我要實(shí)現(xiàn)的最終效果是這樣的,即在Android4.4及以上版本系統(tǒng)上唯袄,統(tǒng)一顯示為如下效果: 所謂“沉浸式”狀...
    星際之痕閱讀 2,524評論 8 27
  • 應(yīng)用市場上App越來越多的出現(xiàn)沉浸式狀態(tài)欄的設(shè)計(jì)(如下圖所示)狀態(tài)欄和導(dǎo)航欄具有相同的顏色弯屈。Android在4.4...
    Jensen95閱讀 1,559評論 2 13
  • 0前言 之前聽朋友推薦過鏈家網(wǎng),于是這次找工作恋拷,我優(yōu)先投了他們的簡歷资厉。緊接著收到了鏈家門頭溝招聘負(fù)責(zé)人的電話,...
    點(diǎn)妞妞閱讀 2,884評論 0 15