HarmonyOS Next 办公应用:业务页面核心功能实现(二)

109 阅读1分钟
3. 应用列表展示

该功能用于展示常用的办公应用,并支持点击操作。

@Builder ApplicationSection(list: ApplicationInfo[], isMore:boolean){
  Flex({wrap:FlexWrap.Wrap,justifyContent:FlexAlign.Start,alignItems:ItemAlign.Center}){
    ForEach(list,(item: ApplicationInfo)=>{
      Column(){
        Image(item.img)
          .fillColor(Color.White)
          .backgroundColor(item.bgColor)
          .borderRadius(5)
          .padding(5)
          .width(36)
          .height(36)
          .margin({
            bottom:6
          })
        Text(item.title)
          .maxLines(1)
          .fontSize(12)
          .textOverflow({overflow: TextOverflow.Ellipsis})
      }
      .width('20%')
      .margin({
        top:5,
        bottom:15
      })
      .onClick(()=>{
        //TODO  添加成员跳转
      })
    },(item: ApplicationInfo) => JSON.stringify(item))

    if(isMore){
      Column(){
        Image($r('app.media.more_'))
          .borderRadius(5)
          .padding(5)
          .width(36)
          .height(36)
          .borderWidth(1)
          .borderColor('#aaaaaa')
          .margin({
            bottom:6
          })
        Text('更多')
          .maxLines(1)
          .fontSize(12)
          .textOverflow({overflow: TextOverflow.Ellipsis})
      }
      .width('20%')
      .margin({
        top:5,
        bottom:15
      })
      .onClick(()=>{
      })
    }
  }
}

ApplicationSection 方法使用 ForEach 循环遍历应用列表,展示应用图标和标题,并支持点击操作。如果 isMoretrue,则显示“更多”选项。

总结

通过以上核心代码的实现,我们在 HarmonyOS Next 中构建了一个功能丰富的业务页面,集成了打卡、应用跳转、应用列表展示等功能。这些功能的实现为办公类应用提供了基础的操作框架,开发者可以根据需求进一步扩展和优化。HarmonyOS Next 提供了强大的开发能力和丰富的组件库,使得开发者能够更高效地构建出优质的办公应用。