I am having trouble getting boxes to align in fluidRow column format when using bslib and theme bootstrap 4 and 5 with navbarPage. It works with version 3. I can't figure out how to make the version 5 (or 4) to return the right layout. Only one column is used for the later versions. I need the boxes to be arranged in rows.
library(shiny)
library(bslib)
library(shinydashboard)
ui <- navbarPage(
theme = bs_theme(version = 4), # Wrong Layout
#theme = bs_theme(version = 3), # Right Layout
title="Dynamic Boxes",
#
navbarMenu("Tab1" ,
tabPanel("Item1",
fluidPage(
fluidRow( column(12,
uiOutput("boxes")
)
)
)
)
)
)
server <- function(input, output) {
output$boxes <- renderUI({
lapply(1:10, function(a) {
x = 1:100
box(title = paste0("box ", a), renderPlot(plot(x = x, y = x^a)))
})
# )
})
}
shinyApp(ui = ui, server = server)
fluidRow() needs to be outside of the lapply function and column() inside.
library(shiny)
library(bslib)
library(shinydashboard)
ui <- navbarPage(
theme = bs_theme(version = 4), # Wrong Layout
#theme = bs_theme(version = 3), # Right Layout
title="Dynamic Boxes",
navbarMenu("Tab1" ,
tabPanel("Item1",
uiOutput("boxes")
)
)
)
server <- function(input, output) {
output$boxes <- renderUI({
fluidRow(
lapply(1:10, function(a) {
x = 1:100
column(6,
box(title = paste0("box ", a),
renderPlot(plot(x = x, y = x^a)))
)
})
)
})
}
shinyApp(ui = ui, server = server)