开发者可以通过设置标题栏与工具栏来丰富页面中的布局。标题栏位于内容区的上部,工具栏位于内容区的下部。开发者通过如下接口可以为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开发者

Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐