HarmonyOS Navigation NavRouter NavDestination

APP打开首页展示底部tabbar,并且点击跳转后tabbar消失。如果使用Navigation NavRouter NavDestination这些组件怎么实现?

HarmonyOS
2024-12-20 16:20:11
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
aquaa

参考如下demo:

@Entry
@Component
struct NavRouterExample {
  @State isActiveWLAN: boolean = false
  @State isActiveBluetooth: boolean = false
  build() {
    Navigation() {
      Row() {
        NavRouter() {
          Row() {
            Text(`WLAN`)
              .fontSize(22)
              .fontWeight(500)
              .textAlign(TextAlign.Center)
          }
          .height(60)

          NavDestination() {
            Flex({ direction: FlexDirection.Row }) {
              Text('未找到可用WLAN').fontSize(30).padding({ left: 15 })
            }
          }.title("WLAN")
        }
        .layoutWeight(1)
        .backgroundColor(Color.Red)
        .borderRadius({
          topLeft: 20,
          bottomLeft: 20
        })
        .mode(NavRouteMode.PUSH_WITH_RECREATE)
        .onStateChange((isActivated: boolean) => {
          this.isActiveWLAN = isActivated
        })

        NavRouter() {
          Row() {
            Text(`蓝牙`)
              .fontSize(22)
              .fontWeight(500)
              .textAlign(TextAlign.Center)
          }
          .height(60)

          NavDestination() {
            Flex({ direction: FlexDirection.Row }) {
              Text('未找到可用蓝牙').fontSize(30).padding({ left: 15 })
            }
          }.title("蓝牙")
        }
        .layoutWeight(1)
        .backgroundColor(Color.Green)
        .borderRadius({
          topRight: 20,
          bottomRight: 20
        })
        .mode(NavRouteMode.REPLACE)
        .onStateChange((isActivated: boolean) => {
          this.isActiveBluetooth = isActivated
        })
      }
      .padding({left:10,right:10})
      .alignItems(VerticalAlign.Bottom)
      .justifyContent(FlexAlign.Center)
      .height('100%')
      .width('100%')

    }

    .title('首页')
    .backgroundColor("#F2F3F5")
    .titleMode(NavigationTitleMode.Free)
    .mode(NavigationMode.Auto)
  }
}
分享
微博
QQ
微信
回复
2024-12-20 19:09:08
相关问题
HarmonyOS navdestination页面返回按钮问题
858浏览 • 1回复 待解决
HarmonyOS NavDestination生命周期问题
327浏览 • 1回复 待解决
HarmonyOS NavDestination组件加按钮
453浏览 • 1回复 待解决
HarmonyOS NavDestination的expandSafeArea问题
315浏览 • 1回复 待解决
HarmonyOS NavDestination的menu问题
173浏览 • 1回复 待解决
HarmonyOS NavDestination和page使用区别
357浏览 • 1回复 待解决
HarmonyOS NavDestination的title怎么居中
371浏览 • 1回复 待解决