HarmonyOS鸿蒙Next中ArkUI路由/导航系列三：NavDestination标题栏和工具栏，丰富页面信息

HarmonyOS鸿蒙Next中ArkUI路由/导航系列三：NavDestination标题栏和工具栏，丰富页面信息

上一章 【ArkUI路由/导航系列】二：Navigation基础路由操作，让页面跳转起来

开发者可以通过设置标题栏与工具栏来丰富页面中的布局。标题栏位于内容区的上部，工具栏位于内容区的下部。开发者通过如下接口可以为NavDestination页面设置标题栏与工具栏

// TitleToolBarNavDest.ets

@Component
struct TitleToolBarNavDest {
 name: string = 'NA'

 build() {
     // 内容区在此不做展开。实现样例参考2.1章节。
   NavDestination() {...}
   // 设置主标题为"单标题演示"
   .title('单标题演示')
   // 设置双重标题，主标题为"主标题演示"，副标题为"副标题演示"
   .title({
     main: '主标题演示',
     sub: '副标题演示'
   })
   // 提示: 重复设置统一属性，后设置的会覆盖前者。上文代码仅做演示
   // 设置工具栏，内容为A~E的字母
   .toolbarConfiguration([
     { value: "A" },
     { value: "B" },
     { value: "C" },
     { value: "D" },
     { value: "E" },
   ])
 }
}

标题栏与工具栏的接口.title、.toolbarConfiguration支持传入参数，以实现自定义的风格样式。详细请移步Navigation-导航与切换-ArkTS组件-ArkUI（方舟UI框架）-应用框架 - 华为HarmonyOS开发者

下一章 【ArkUI路由/导航系列】四：Navigation页面信息查询

【ArkUI路由/导航系列】一：ArkUI路由原理简介，认识Navigation组件

【ArkUI路由/导航系列】二：Navigation基础路由操作，让页面跳转起来

【ArkUI路由/导航系列】三：NavDestination标题栏和工具栏，丰富页面信息

【ArkUI路由/导航系列】四：Navigation页面信息查询

【ArkUI路由/导航系列】五：Navigation生命周期管理

【ArkUI路由/导航系列】六：Navigation组件的无感监听

【ArkUI路由/导航系列】七：Navigation自定义转场动画，让页面切换炫起来

【ArkUI路由/导航系列】八：Navigation跨包路由，迈入高级路由能力

【ArkUI路由/导航系列】九：Navigation分栏开发，开启多设备开发之旅

【ArkUI路由/导航系列】十：Navigation嵌套开发

【ArkUI路由/导航系列】十一：Navigation弹窗页面开发

【ArkUI路由/导航系列】十二：Navigation路由拦截