R Shiny - 在最小化sidebarPanel时调整MainPanel窗口的大小

时间:2017-09-21 19:50:55

标签: r shiny

我使用sidebarPanel和mainPanel构建了一个具有fluidPage和布局的Shiny应用程序。现在我正在使用一个最小化sidebarPanel的按钮,但是当发生这种情况时,mainPanel会保留其宽度。我想要发生的是mainPanel调整到新的屏幕大小并使用整个窗口,而不是保持原始66%它通常使用。

这是我在server.r文件中使用的按钮事件:

observeEvent(input$showpanel, {

if(input$showpanel == TRUE) {

shinyjs::show(id = "Sidebar")
shinyjs::enable(id = "Sidebar")
}
else {

  shinyjs::hide(id = "Sidebar")
}
})

这是我在ui.r文件中使用的按钮,该文件当前位于mainPanel窗口的顶部。

mainPanel(
  bsButton("showpanel", "Show/hide sidebar", type = "toggle", value = TRUE),

当我隐藏sidebarPanel时,不知道是否有办法将css或H​​TML添加到mainPanel窗口。

1 个答案:

答案 0 :(得分:3)

您可以通过将mainPanel的类别从col-sm-8更改为col-sm-12来增加宽度。看看下面的代码:

library(shiny)
library(shinyjs)
library(shinyBS)

ui <- fluidPage(
  useShinyjs(),
  sidebarLayout(

    sidebarPanel(id = "Sidebar",
      h2("This is a sidebar panel")
    ),

    mainPanel(id ="Main",
      bsButton("showpanel", "Show/hide sidebar", type = "toggle", value = TRUE)
    )
  )

)

server <- function(input, output, session){
  observeEvent(input$showpanel, {

    if(input$showpanel == TRUE) {
      removeCssClass("Main", "col-sm-12")
      addCssClass("Main", "col-sm-8")
      shinyjs::show(id = "Sidebar")
      shinyjs::enable(id = "Sidebar")
    }
    else {
     removeCssClass("Main", "col-sm-8")
      addCssClass("Main", "col-sm-12")
      shinyjs::hide(id = "Sidebar")
    }
  })


}

shinyApp(ui = ui, server = server)