#鸿蒙通关秘籍#如何为TabBar中间页实现圆弧外轮廓效果

Column() {
    Image(this.selectedIndex === this.tabBarIndex ? TABINFO[this.tabBarIndex].selectedIcon :
          TABINFO[this.tabBarIndex].defaultIcon)
      .size({
        width: $r('app.integer.custom_tab_community_image_size'),
        height: $r('app.integer.custom_tab_community_image_size')
      })
      .interpolation(ImageInterpolation.High)
  }
  .width($r('app.integer.custom_tab_community_image_container_size'))
  .height($r('app.integer.custom_tab_community_image_container_size'))
  .borderRadius($r('app.integer.custom_tab_community_image_container_border_radius_size'))
  .margin({ top: ARC_MARGIN_TOP })
  .backgroundColor(Color.White)
  .justifyContent(FlexAlign.Center)
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.