-
條件
- weex頁面要通知app端是否顯示原生導(dǎo)航欄（android，ios）和沉浸式導(dǎo)航（android）
- 要根據(jù)系統(tǒng)狀態(tài)欄高度動態(tài)設(shè)置最頂端布局的height和margin
- app需要提供系統(tǒng)狀態(tài)欄高度。android還需要設(shè)置FLAG_TRANSLUCENT_STATUS并且考慮api19以下的情況
-
直接上主要代碼
- 通過進入weex頁面的參數(shù)來通知app端相關(guān)狀態(tài)
this.$jump('vip/center', { translucentStatus: true, navigationBarHidden: true, ... });- 根據(jù)app返回的狀態(tài)欄高度調(diào)整響應(yīng)的界面
weex.requireModule('common').getStatusBarHeight(function(statusBarHeight) { me.statusBarHeight = statusBarHeight * 2; });<image class="top_bg" :style="{ height: (420 + statusBarHeight) + 'px' }" src="..." /> ...- 通過WXModule提供getStatusBarHeight()
- android端需要針對api19以下做處理
@JSMethod(uiThread = true) public void getStatusBarHeight(final JSCallback jsCallback) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) { jsCallback.invokeAndKeepAlive(UiUtil.px2dip(mWXSDKInstance.getContext(),UiUtil.getStatusBarHeight(mWXSDKInstance.getContext()))); }else { jsCallback.invokeAndKeepAlive(0); } } -
效果
image -
擴展
也可以訪問我的個人博客：http://blog.yzapp.cn
github：https://github.com/nesror
weex沉浸式導(dǎo)航欄解決方案
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。
- 文/潘曉璐 我一進店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來，“玉大人，你說我怎么就攤上這事。” “怎么了？”我有些...
- 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著，像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上，一...
- 文/蒼蘭香墨 我猛地睜開眼，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了？” 一聲冷哼從身側(cè)響起，我...
- 正文 年R本政府宣布，位于F島的核電站，受9級特大地震影響，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜，卻給世界環(huán)境...
- 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背。 一陣腳步聲響...
