SideBarContainer组件switching效果可以隐藏吗？(HarmonyOS 鸿蒙Next)

SideBarContainer组件switching效果可以隐藏吗？(HarmonyOS 鸿蒙Next)

SideBarContainer组件switching属性，侧边栏切换过程中的图标，这个不设置也会展示出来吗？

请问怎么能隐藏这个切换过程中有图标的效果？

看官网这个属性是可以不设置的，但是不设置，在切换的过程中也是有一个默认的图标展示出来。

3 回复

您参考一下如下demo,可以自定义动画，看能否满足您的需求

@Entry
@Component
struct SideBarContainerDemo {
  @State arr: number[] = [1, 2, 3]
  @State current: number = 1
  @State showSideBar: boolean = false
  @State showFlag: Visibility = Visibility.Hidden;
  // 延迟关闭侧边栏，让自定义的出场动画显示
  cancel() {
    this.showFlag = Visibility.Hidden
    setTimeout(() => {
      this.showSideBar = !this.showSideBar
    }, 1000)
  }
  build() {
    SideBarContainer(SideBarContainerType.Overlay) {
      Column() {
        ForEach(this.arr, (item: number) => {
          Column({ space: 5 }) {
            Text("Index0" + item)
              .fontSize(25)
              .fontColor(this.current === item ? '#0A59F7' : '#999')
              .fontFamily('source-sans-pro,cursive,sans-serif')
          }
          .onClick(() => {
            this.current = item
          })
        }, (item: string) => item)
      }
      .visibility(this.showFlag)
      .transition(TransitionEffect.OPACITY.animation({ duration: 1000 })
        .combine(TransitionEffect.translate({ x: 100 })))
      .width('100%')
      .justifyContent(FlexAlign.SpaceEvenly)
      .backgroundColor(Color.Pink)
      Column() {
        Button('打开侧边栏').onClick(() => {
          this.showFlag = Visibility.Visible
          this.showSideBar = true
        })
        Button('关闭侧边栏').onClick(() => {
          this.cancel()
        })
      }
    }
    .divider(null)
    .sideBarPosition(SideBarPosition.End)
    .showSideBar(this.showSideBar)
    .showControlButton(false)
    .sideBarWidth(150)
    .minSideBarWidth(50)
    .maxSideBarWidth(300)
    .minContentWidth(0)
    .onChange((value: boolean) => {
      console.info('status:' + value)
    })
  }
}

更多关于SideBarContainer组件switching效果可以隐藏吗？(HarmonyOS 鸿蒙Next)的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


自定义确实可以实现这个效果，那是不是说icons这个属性在转换过程中必须有个动画啊。

在HarmonyOS（鸿蒙Next）中，SideBarContainer组件的switching效果可以通过设置相关属性来隐藏。具体来说，你可以通过调整SideBarContainer的autoHide属性来控制侧边栏的显示与隐藏行为。autoHide属性默认情况下为true，表示侧边栏在失去焦点时会自动隐藏。如果你希望完全隐藏switching效果，可以将autoHide设置为false，并在需要时通过代码手动控制侧边栏的显示与隐藏。

此外，你也可以通过设置SideBarContainer的visibility属性来控制其可见性，将其设置为Visibility.None可以完全隐藏侧边栏，从而避免switching效果的触发。

需要注意的是，这些操作需要在开发过程中通过代码实现，具体的实现方式可以根据你的应用场景进行调整。

回到顶部