啟動速度與執(zhí)行效率優(yōu)化項目實戰(zhàn)(二):啟動黑白屏解決

img

為什么會有黑白屏

在桌面點擊應用圖標后胀滚,在app進程沒有創(chuàng)建的情況下,需要時間創(chuàng)建app進程,初始化資源杨何,以及啟動首頁Activity的(這里討論的首頁是指AndroidManifest里面標志的啟動頁)盗似,這就意味點擊圖標不能馬上看到啟動頁哩陕。為了不讓用戶有卡頓的感覺,谷歌有了Preview Window赫舒,在啟動頁沒有繪制完成時悍及,會先初始化一個Window,我們通辰影看到的黑屏或白屏心赶,就是這個預覽窗口。

怎么知道是黑屏還是白屏缺猛?

黑白屏是預加載的窗口缨叫,這個窗口的一些屬性可以在theme里更改椭符。新建一個項目,會在AndroidManifest的application所屬標簽里面的內(nèi)容看到android:theme="@style/AppTheme",這個是默認的theme耻姥。查看這個AppTheme,找到name="android:windowBackground"這個屬性销钝,查看屬性下的內(nèi)容,就能知道是黑屏還是白屏琐簇,這個屬性就是設置預覽窗口的背景蒸健。無論是黑屏還是白屏,給用戶的體驗都不好鸽嫂,所以就有了把背景設為透明或者用一張圖片來作為啟動背景的解決辦法纵装。這些只是很基本的解決辦法,而且存在一定的弊端据某,既然我們要讓用戶體驗更好橡娄,就應該處理得更加優(yōu)雅一些。

如何優(yōu)雅的解決黑白屏

解決黑白屏癣籽,需要和啟動頁結(jié)合起來⊥彀Γ現(xiàn)在的APP基本上都有閃屏頁,有些是為了加載廣告筷狼,有些是為了通過閃屏頁初始化App的一些資源瓶籽,本篇文章就討論有閃屏的啟動頁,以網(wǎng)易云音樂對預加載窗口和閃屏頁的處理來舉例埂材。來看看網(wǎng)易云的預加載頁和啟動頁塑顺。

img
img

第一張是預加載頁,第二張是閃屏頁俏险,閃屏頁只比預加載頁多了底部的圖標和網(wǎng)易云音樂這四個字(其實是一整體严拒,一張圖片),而且給人的感覺是一直是預加載頁竖独,不過底部的圖標和文字會慢慢出現(xiàn)裤唠,這樣的處理比單獨的顯示圖片或者設置為透明更讓人能夠接受。下面我們就來看看代碼莹痢。

styles文件自定義Theme

<style name="AppTheme.lanuchTheme" >
      <item name="android:windowBackground">@drawable/launch_layout</item>
      <item name="android:windowFullscreen">true</item>
      <item name="android:windowNoTitle">true</item>
      <item name="android:windowContentOverlay">@null</item>

launch_layout种蘸,代碼中的top_img,是“音樂的力量”四個字的圖片竞膳。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/holo_red_dark"/>
  <item android:top="150dp">
      <bitmap android:gravity="top" android:src="@mipmap/top_img" />
  </item>
</layer-list>

SplashActivity的布局文件為

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/bottom_imag"http://bottom_imag為底部的圖標和文字
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="50dp"
        />
</RelativeLayout>

最后在AndroidManifest里將lanuchTheme設置給閃屏頁(下文用SplashActivity表示)航瞭,就大功告成了。

寫以上布局需要注意:由于沒有給SplashActivity的布局設置背景色坦辟,也就是透明色沧奴,而兩個頁面的區(qū)別只有底部加了一張圖片,所以在SplashActivity的布局中就不需要再把預加載頁的內(nèi)容再寫一次长窄。

總結(jié)

黑白屏的解決是為了讓用戶覺得點擊圖標就得到了響應滔吠,App啟動很順暢纲菌,這個過程能在視覺上給人美感,那就更好了疮绷。不同的應用場景可以有不同的解決辦法翰舌,不一定是有閃屏頁,也不一定要和網(wǎng)易云音樂一樣冬骚,也可以在閃屏頁寫一個動畫或其它效果椅贱。想弄懂黑白屏,可以先做做以下功課

  • 本篇網(wǎng)易云音樂解決方案的原理
  • 明白為什么自定義theme,并且單獨設置給Activity
  • 了解layer_list可以做什么

弄明白這幾個問題只冻,解決黑白屏就不是什么難事了庇麦。

最后對于程序員來說,要學習的知識內(nèi)容喜德、技術有太多太多山橄,要想不被環(huán)境淘汰就只有不斷提升自己,從來都是我們?nèi)ミm應環(huán)境舍悯,而不是環(huán)境來適應我們航棱!

這里附上上述的技術體系圖相關的幾十套騰訊、頭條萌衬、阿里饮醇、美團等公司19年的面試題,把技術點整理成了視頻和PDF(實際上比預期多花了不少精力)秕豫,包含知識脈絡 + 諸多細節(jié)朴艰,由于篇幅有限,這里以圖片的形式給大家展示一部分混移。

相信它會給大家?guī)砗芏嗍斋@:

img
img

上述【高清技術腦圖】以及【配套的架構(gòu)技術PDF】可以 關注我 【主頁簡介】 或者【簡信】免費獲取

當程序員容易祠墅,當一個優(yōu)秀的程序員是需要不斷學習的,從初級程序員到高級程序員沫屡,從初級架構(gòu)師到資深架構(gòu)師,或者走向管理撮珠,從技術經(jīng)理到技術總監(jiān)沮脖,每個階段都需要掌握不同的能力。早早確定自己的職業(yè)方向芯急,才能在工作和能力提升中甩開同齡人

?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末勺届,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子娶耍,更是在濱河造成了極大的恐慌免姿,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,496評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件榕酒,死亡現(xiàn)場離奇詭異胚膊,居然都是意外死亡故俐,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,407評論 3 392
  • 文/潘曉璐 我一進店門紊婉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來药版,“玉大人,你說我怎么就攤上這事喻犁〔燮” “怎么了?”我有些...
    開封第一講書人閱讀 162,632評論 0 353
  • 文/不壞的土叔 我叫張陵肢础,是天一觀的道長还栓。 經(jīng)常有香客問我,道長传轰,這世上最難降的妖魔是什么剩盒? 我笑而不...
    開封第一講書人閱讀 58,180評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮路召,結(jié)果婚禮上勃刨,老公的妹妹穿的比我還像新娘。我一直安慰自己股淡,他們只是感情好身隐,可當我...
    茶點故事閱讀 67,198評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著唯灵,像睡著了一般贾铝。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上埠帕,一...
    開封第一講書人閱讀 51,165評論 1 299
  • 那天垢揩,我揣著相機與錄音,去河邊找鬼敛瓷。 笑死叁巨,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的呐籽。 我是一名探鬼主播锋勺,決...
    沈念sama閱讀 40,052評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼狡蝶!你這毒婦竟也來了庶橱?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,910評論 0 274
  • 序言:老撾萬榮一對情侶失蹤贪惹,失蹤者是張志新(化名)和其女友劉穎苏章,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,324評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡枫绅,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,542評論 2 332
  • 正文 我和宋清朗相戀三年泉孩,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片撑瞧。...
    茶點故事閱讀 39,711評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡棵譬,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出预伺,到底是詐尸還是另有隱情订咸,我是刑警寧澤,帶...
    沈念sama閱讀 35,424評論 5 343
  • 正文 年R本政府宣布酬诀,位于F島的核電站脏嚷,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏瞒御。R本人自食惡果不足惜父叙,卻給世界環(huán)境...
    茶點故事閱讀 41,017評論 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望肴裙。 院中可真熱鬧趾唱,春花似錦、人聲如沸蜻懦。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,668評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽宛乃。三九已至悠咱,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間征炼,已是汗流浹背析既。 一陣腳步聲響...
    開封第一講書人閱讀 32,823評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留谆奥,地道東北人眼坏。 一個月前我還...
    沈念sama閱讀 47,722評論 2 368
  • 正文 我出身青樓,卻偏偏與公主長得像酸些,于是被迫代替她去往敵國和親宰译。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,611評論 2 353

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

  • 一擂仍,黑白屏解決方案 一號方案 不推薦使用 二號方案真正好的優(yōu)化是順著谷歌的設計來 思路 1囤屹,取代空白窗體部分 2...
    GoodWen閱讀 431評論 0 0
  • 技術點: 1熬甚、傳說中的黑白屏問題優(yōu)化 2逢渔、黑白屏在商業(yè)App中的價值 3、App啟動流程 4乡括、如何使用Tracev...
    Dear月閱讀 300評論 0 0
  • 在開發(fā)過程中我們發(fā)現(xiàn)在啟動有些app的時候肃廓,出現(xiàn)短時間黑屏或者白屏閃爍之后進入開屏頁面智厌,但是有些app在啟動的過程...
    GerDScarlet閱讀 2,904評論 1 15
  • 久違的晴天,家長會盲赊。 家長大會開好到教室時铣鹏,離放學已經(jīng)沒多少時間了。班主任說已經(jīng)安排了三個家長分享經(jīng)驗哀蘑。 放學鈴聲...
    飄雪兒5閱讀 7,520評論 16 22
  • 今天感恩節(jié)哎诚卸,感謝一直在我身邊的親朋好友。感恩相遇绘迁!感恩不離不棄合溺。 中午開了第一次的黨會,身份的轉(zhuǎn)變要...
    迷月閃星情閱讀 10,562評論 0 11