Is it possible to add a sidebarPanel and a mainPanel in each tabPanel using navbarPage?

Question

I have at least 2 individual apps that I want to join in one single app. Although I was using shinyDashboard, I think that it could be a good idea to try with navbarPage.

However, I don't know if it is possible to do what I want with this new approach.

To put you in a context, this is an example of my shinyDashboard. Each tab has a sidebarPanel and mainPanel. I replicated the info in all the tabs, but the idea is that each tab has different things.

However, I was thinking to have this using navbarPage. Do you know if it is possible?

Here I attach you the code that I used for the shinyDashboard:

library(shiny)
library(shinydashboard)
library(shinyWidgets)

ui <- dashboardPage(
  
  dashboardHeader(title = "Basic dashboard"),
  ## Sidebar content
  dashboardSidebar(
    sidebarMenu(
      menuItem("Tab1", tabName = "Tab1", icon = icon("th")),
      menuItem("Tab2", tabName = "Tab2", icon = icon("th")),
      menuItem("Tab3", tabName = "Tab3", icon = icon("th"))
    )
  ),
  
  dashboardBody(
    fluidRow(
      tabItems(
        
        tabItem(tabName = "Tab1",
                sidebarPanel(
                  numericInput("num",
                               "Select a number",
                               min = 1,
                               value = 10),
                  
                  checkboxInput("remove", "Remove...", value = FALSE),
                  sliderInput("slider", "slider", min = 1, max = 30, value=22)
                    
                ),
                mainPanel(
                  plotOutput("plot1")
                )
                
        ),
        tabItem(tabName = "Tab2",
                sidebarPanel(
                  numericInput("num2",
                               "Select a number",
                               min = 1,
                               value = 10),
                  
                  checkboxInput("remove2", "Remove...", value = FALSE),
                  sliderInput("slider2", "slider", min = 1, max = 30, value=22)
                  
                ),
                mainPanel(
                  plotOutput("plot2")
                )
                
        ),
        tabItem(tabName = "Tab3",
                sidebarPanel(
                  numericInput("num3",
                               "Select a number",
                               min = 1,
                               value = 10),
                  
                  checkboxInput("remove3", "Remove...", value = FALSE),
                  sliderInput("slider3", "slider", min = 1, max = 30, value=22)
                  
                ),
                mainPanel(
                  plotOutput("plot3")
                )
        
                
        )
      )
    )
  )
)

server <- function(input, output, session) {
  
  output$plot1 <- renderPlot({
    plot(x=c(1,2,3,4,5,6), y=c(14,3,6,4,56,2))
  })
  
  output$plot2 <- renderPlot({
    plot(x=c(1,2,3,4,5,6), y=c(14,3,6,4,56,2))
  })
  
  output$plot3 <- renderPlot({
    plot(x=c(1,2,3,4,5,6), y=c(14,3,6,4,56,2))
  })
  
}

shinyApp(ui, server)

And the code for the navbarPage approach:

library(shinythemes)
library(shiny)

ui <-  fluidPage(theme = shinytheme("flatly"), 
                 navbarPage(
                   
                   collapsible = T,
                   fluid = T,
                   "",
                   tabPanel("Tab 1", "one"),
                   tabPanel("Tab 2", "two"),
                   tabPanel("Tab 3", "three"),
                   )
)

server <- function(input, output, session) {
  
}

shinyApp(ui, server)

Thanks very much in advance

Answer 1

You can do that with sidebarLayout. Here I've done it for the first tabPanel:

library(shinythemes)
library(shiny)

ui <-  fluidPage(
  theme = shinytheme("flatly"), 
  navbarPage(
    title = "Your App Title", 
    collapsible = TRUE,
    fluid = TRUE,
    
    tabPanel(
      title = "Tab 1", 
      
      sidebarLayout(
        sidebarPanel = sidebarPanel(
          tags$h3(
            "Sidebar Content Here!"
          )
        ), 
        
        mainPanel = mainPanel(
          tags$h3(
            "Main Panel Content Here!"
          )
        )
      )
    ),
    tabPanel(
      title = "Tab 2", 
      "three"
    ),
  )
)

server <- function(input, output, session) {
  
}

shinyApp(ui, server)