百度智能小程序自定義頂部導(dǎo)航欄應(yīng)該如何配置

3146次閱讀

頂部導(dǎo)航欄

頂部導(dǎo)航欄始終固定在屏幕頂部,不隨頁面滾動隱藏。
智能小程序會自動繼承小程序首頁頂部導(dǎo)航欄的配置,但每個頁面均可配置其頂部導(dǎo)航欄。即同一智能小程序中,不但可同時存在原生頂部導(dǎo)航欄和自定義導(dǎo)航欄,也可為每個頁面定制不同的樣式。


自定義頂部導(dǎo)航欄

百度App v11.1及以上版本的智能小程序,支持自定義頂部導(dǎo)航欄,使其只保留框架控制功能區(qū)。

使用自定義導(dǎo)航欄前,請了解透明框架的頁面布局基礎(chǔ),此時原生頂部導(dǎo)航欄中的容器、框架內(nèi)部導(dǎo)航功能區(qū)、頁面標(biāo)題均不展示,開發(fā)者可自定義當(dāng)前頁面的頂部導(dǎo)航欄。

我們建議,在使用自定義導(dǎo)航欄時,通過系統(tǒng)信息接口getSystemInfoSync獲得系統(tǒng)狀態(tài)欄的高度(statusBarHeight),并為系統(tǒng)狀態(tài)欄配置與自定義導(dǎo)航欄背景一致的顏色。


正確

普通手機(jī)(1)及全面屏手機(jī)(2)系統(tǒng)狀態(tài)欄均正確適配,且顏色與自定義頂部導(dǎo)航欄一致。

7.png


錯誤

適配系統(tǒng)狀態(tài)欄高度,但未正確配置顏色。

8-1.png


錯誤

未適配系統(tǒng)狀態(tài)欄高度,導(dǎo)致自定義頂部導(dǎo)航欄布局錯位。

8-2.png

自定義導(dǎo)航欄的元素建議與控制功能區(qū)對齊,且與原生頂部導(dǎo)航欄高度一致(iOS為44pt,Android為38pt)。

正確

自定義頂部導(dǎo)航欄元素與控制功能區(qū)垂直居中對齊

9-1.png


錯誤

自定義頂部導(dǎo)航欄元素未對齊

9-2.png


閱讀本文的人還可以閱讀:

百度智能小程序入口有哪些?哪里可以進(jìn)入百度智能小程序?

百度智能小程序開源聯(lián)盟是什么

百度智能小程序的流量為什么那么高,小程序如何引流?

怎樣做好百度智能小程序體驗(yàn)設(shè)計(jì)(1)

本文由夫唯團(tuán)隊(duì)編輯,如發(fā)現(xiàn)錯誤,歡迎通過客服微信反饋。

夫唯于2024年12月停止百度SEO研究和培訓(xùn)。道別信: 夫唯:再見了百度SEO!

2025年1月正式啟動Google SEO培訓(xùn)課程,一千零一夜帶領(lǐng)大家一起出海。

感興趣的同學(xué),請?zhí)砑诱猩头∧⑿牛簊eowhy2021。 微信掃碼添加客服人員

我們的目標(biāo):讓大家獨(dú)立站出海不再“望洋興嘆”。

国产综合亚洲欧洲区精品无码,欧美一级免费一区二区,精品一级片高清无码,亚洲成片在线无码看 www.sucaiwu.net
Processed in 0.845755 Second , 323 querys.