R Shiny 中侧边栏和主面板的固定位置

Question

我想在我的 RShiny 应用程序中有一个固定宽度的侧边栏，在调整窗口大小时它保持在原位。

我已经设法获得了一个固定宽度的侧边栏，但侧边栏和主面板之间仍然存在白色间距。似乎应该有一个直截了当的解决方案，但我的搜索到目前为止是徒劳的。

这是一个基于“Old Faithful Geyser Data”模板的最小示例。我添加了将侧面板保持在固定宽度的标签。

library(shiny)

ui <- fluidPage(

   titlePanel("Old Faithful Geyser Data"),
   sidebarLayout(
      sidebarPanel(
          tags$head(
              tags$style(type="text/css", "select { max-width: 240px; }"),
              tags$style(type="text/css", ".span4 { max-width: 290px; }"),
              tags$style(type="text/css", ".well { max-width: 280px; }")
          ),
         sliderInput("bins", "Number of bins:", min = 1, max = 50, value = 30)
      ),
      mainPanel(
         plotOutput("distPlot")
      )
   )
)

server <- function(input, output) {
   output$distPlot <- renderPlot({
      x    <- faithful[, 2] 
      bins <- seq(min(x), max(x), length.out = input$bins + 1)
      hist(x, breaks = bins, col = 'darkgray', border = 'white')
   })
}

shinyApp(ui = ui, server = server)

正常输出看起来不错。

当拖动窗口时，侧边栏会变得非常宽，从主面板中占据宝贵的屏幕空间。

固定侧边栏面板的宽度时，它在扩展窗口时保持形状，但主面板无法利用整个区域。期望的反应是侧边栏面板保持大小不变​​，而主面板可以利用所有可用空间。

有人对如何解决这个问题有任何想法吗？谢谢！

Answer 1

这样可以吗？

library(shiny)

ui <- fluidPage(
  tags$head(
    tags$style(type="text/css", "select { max-width: 240px; }"),
    tags$style(type="text/css", ".span4 { max-width: 290px; }"),
    tags$style(type="text/css", ".well { max-width: 280px; }")
  ),

  titlePanel("Old Faithful Geyser Data"),
  div(
    style = "display:flex; align-items:flex-start",
    wellPanel( # sidebar
      sliderInput("bins", "Number of bins:", min = 1, max = 50, value = 30),
      textInput("text", "Enter text:")
    ),
    div( # main panel
      style = "flex-grow:1; resize:horizontal; overflow: hidden",
      plotOutput("distPlot")
    )
  )
)

server <- function(input, output) {
  output$distPlot <- renderPlot({
    x    <- faithful[, 2] 
    bins <- seq(min(x), max(x), length.out = input$bins + 1)
    hist(x, breaks = bins, col = 'darkgray', border = 'white')
  })
}

shinyApp(ui = ui, server = server)