Skip to contents

Build a navbar layout element to insert in f7SingleLayout, f7TabLayout or f7SplitLayout.

updateF7Navbar toggles an f7Navbar component from the server.

Usage

f7Navbar(
  ...,
  subNavbar = NULL,
  title = NULL,
  subtitle = NULL,
  hairline = TRUE,
  shadow = TRUE,
  bigger = FALSE,
  transparent = FALSE,
  leftPanel = FALSE,
  rightPanel = FALSE
)

updateF7Navbar(
  animate = TRUE,
  hideStatusbar = FALSE,
  session = shiny::getDefaultReactiveDomain()
)

Arguments

...

Slot for f7SearchbarTrigger. Not compatible with f7Panel.

subNavbar

f7SubNavbar slot, if any.

title

Navbar title.

subtitle

Navbar subtitle. Not compatible with bigger.

hairline

Whether to display a thin border on the top of the navbar. TRUE by default.

shadow

Whether to display a shadow. TRUE by default.

bigger

Whether to display bigger title. FALSE by default. Not compatible with subtitle.

transparent

Whether the navbar should be transparent. FALSE by default. Only works if bigger is TRUE.

leftPanel

Whether to enable the left panel. FALSE by default.

rightPanel

Whether to enable the right panel. FALSE by default.

animate

Whether it should be hidden with animation or not. By default is TRUE.

hideStatusbar

When FALSE (default) it hides navbar partially keeping space required to cover statusbar area. Otherwise, navbar will be fully hidden.

session

Shiny session object.

Note

Currently, bigger parameters does mess with the CSS.

Author

David Granjon, dgranjon@ymail.com

Examples

# Toggle f7Navbar
if (interactive()) {
 library(shiny)
 library(shinyMobile)

 shinyApp(
    ui = f7Page(
       title = "Show navbar",
       f7SingleLayout(
          navbar = f7Navbar("Hide/Show navbar"),
          f7Button(inputId = "toggle", "Toggle navbar", color = "red")
       )
    ),
    server = function(input, output, session) {

       observeEvent(input$toggle, {
          updateF7Navbar()
       })
    }
 )
}