Can we display both drawer menu and bottomNavBar menu in one screen

[gaurikalp]

Can we display both drawer menu and bottomNavBar menu in one screen

[amin-nas]

Currently you can display only one type of nav. However, you can create a custom header that can link to a screen that acts as a secondary menu. Here's a sample syntax:

View:

  styles:
    backgroundColor: 0xFF0F0E1C
    scrollableView: true

  header:
    title: CustomHeader
    styles:
      backgroundColor: black
      titleBarHeight: 78
      showNavigationIcon: false
  
  menu:
    display: bottomNavBar
    items:
      - icon: home
        label: Home
        page: Home
      - icon: settings
        label: Settings
        page: Settings

  # main content
  Column:
    children:
      - Text:
          text: some content


CustomHeader:
  Column:
    styles: { gap: 8 }
    children:
      - Row:
          styles: { mainAxis: spaceBetween, crossAxis: center }
          children:
            - Text:
                text: My page title

            - Column:
                onTap:
                  action: navigateModalScreen
                  name: MenuPage
                children:
                  - Icon:
                      icon: menu

# MenuScreen
# screen that will act as a secondary menu
View:
  styles:
    backgroundColor: 0xCC000000
    ignoreSafeArea: true
  Column:
    styles: 
      mainAxis: center
      fontFamily: Jost
      gap: 24
    children:
      - NavItem:
          inputs:
            label: Dashboard
            screen: Dashboard
      - NavItem:
          inputs:
            label: Transactions
            screen: Transactions


NavItem:
  inputs: [ label, screen ]
  Row:
    onTap:
      action: navigateScreen
      name: ${screen}
    styles: 
      mainAxis: center
    children:
      - Text:
          text: ${label}
          styles: { color: 0xFF51AE55, fontSize: 30 }