Navigation是路由導航的根視圖容器,一般作為頁面(@Entry)的根容器,包括單欄(Stack)、分欄(Split)和自適應(Auto)三種顯示模式。Navigation組件適用于模塊內和跨模塊的路由切換,通過組件級路由能力實現更加自然流暢的轉場體驗,并提供多種標題欄樣式來呈現更好的標題和內容聯動效果。一次開發,多端部署場景下,Navigation組件能夠自動適配窗口顯示大小,在窗口較大的場景下自動切換分欄展示效果。
Navigation組件主要包含導航頁(NavBar)和子頁(NavDestination)。導航頁由標題欄(Titlebar,包含菜單欄menu)、內容區(Navigation子組件)和工具欄(Toolbar)組成,其中導航頁可以通過hideNavBar屬性進行隱藏,導航頁不存在頁面棧中,導航頁和子頁,以及子頁之間可以通過路由操作進行切換。
頁面顯示模式
Navigation組件通過mode屬性設置頁面的顯示模式。顯示模式有三種,默認Auto自適應模式、Stack單頁面模式和Split分欄模式。Navigation組件默認為自適應模式,此時mode屬性為NavigationMode.Auto。自適應模式下,當頁面寬度大于等于一定閾值( API version 9及以前:520vp,API version 10及以后:600vp )時,Navigation組件采用分欄模式,反之采用單欄模式。
標題欄模式
標題欄在界面頂部,用于呈現界面名稱和操作入口,Navigation組件通過titleMode屬性設置標題欄模式。標題欄有Mini模式,普通型標題欄,用于一級頁面不需要突出標題的場景;Full模式,強調型標題欄,用于一級頁面需要突出標題的場景。Free模式,當內容為滿一屏的可滾動組件時,標題隨著內容向上滾動而縮小(子標題的大小不變、淡出)。向下滾動內容到頂時則恢復原樣等三種模式。