頂部導航欄
頂部導航欄始終固定在屏幕頂部,不會隨頁面滾動和隱藏。
智能小程序自動繼承小程序主頁頂部導航欄的配置,但是每個頁面都可以配置其頂部導航欄。也就是說,在同一個智能小程序中,不僅可以同時有本地頂部導航欄和自定義導航欄,而且可以為每個頁面定制不同的樣式。
本地頂部導航欄
默認情況下,本地頂部導航欄由智能小程序框架統一提供,用于控制整個小程序,指示當前位置,并幫助導航小程序的內部頁面。
內部頁面導航功能區在左側,頁面標題名在中間,applet框架控制功能區在右側。
1。 容器
2、內部頁面導航功能區
3。 頁面標題(可選)
4。 框架控制功能區
1。 容器
容器具有頂部導航欄的功能,并為其定義了導航區域。
默認情況下,頂部導航欄容器具有白色背景,開發人員也可以配置相應的顏色。
普通手機(1)和蘋果手機X(2)的頁面布局從頂部導航欄窗口的底部開始。
iOS狀態欄會隨著頂部導航欄元素和容器背景自動變化。
2??蚣軆鹊膶Ш焦δ軈^
當用戶在小程序的主頁上時,該區域不顯示任何功能。
其他頁面,根據場景顯示:
1。返回:用于返回上一頁;
2。返回主頁:用于返回小程序的主頁。
3。頁面標題
頁面標題用于幫助和指示用戶的當前位置。它通常描述當前頁面/函數名,或者當前智能小程序的名稱。
默認情況下,頂部導航欄顯示頁面標題,開發人員也可以選擇隱藏它。
標題過長時會自動截斷,但截斷可能會導致用戶誤解。為了保證主流機型的顯示,設計建議頁面標題不要超過8個漢字。
正確的
如果標題中的信息太長,應在不影響理解的情況下簡化表達式。
錯誤
標題截斷過長造成的信息丟失容易引起誤解,應盡可能避免截斷。
4??蚣芸刂乒δ軈^
該區域對所有小程序都是統一的:
1。菜單:出站菜單面板,包括夜間模式、共享等。
2。關閉:關閉并退出當前小程序。