Question

我有几个位于流体行中的框，当这些框包含相似数量的信息时，高度对齐没有问题，并且使用较小的浏览器窗口动态调整此高度的效果很好。

当框包含的信息量不相同时（例如，两个相邻的表具有不同的行数），就会出现问题；这会导致高度不能整齐地排列。

# NOT RUN {
## Only run this example in interactive R sessions
if (interactive()) {
  library(shiny)

  # A dashboard body with a row of infoBoxes and valueBoxes, and two rows of boxes
  body <- dashboardBody(

    # infoBoxes




    # Boxes
    fluidRow(
      box(status = "primary",
          sliderInput("orders", "Orders", min = 1, max = 2000, value = 650),
          selectInput("progress", "Progress",
                      choices = c("0%" = 0, "20%" = 20, "40%" = 40, "60%" = 60, "80%" = 80,
                                  "100%" = 100)
          )
      ),
      box(title = "Histogram box title",
          status = "warning", solidHeader = TRUE, collapsible = TRUE,
          plotOutput("plot", height = 250)
      )
    )


  )

  server <- function(input, output) {



    output$plot <- renderPlot({
      hist(rnorm(input$orders))
    })
  }

  shinyApp(
    ui = dashboardPage(
      dashboardHeader(),
      dashboardSidebar(),
      body
    ),
    server = server
  )
}
# }

我知道我可以手动设置盒子的高度，但是当我不知道每个盒子中需要显示的信息量时，就会出现问题。我既不想使框太短（并可能切除信息），也不想使框太高（并占用过多的屏幕空间）。但是我确实希望盒子的高度相同。

因此，是否可以提取动态生成的每个框的最大高度并使用该高度将两个框都强制达到该高度？

当这些框包含不同数量的信息，并且调整屏幕大小并[例如]一个框的文本跳到两行而另一框不跳（导致高度不匹配）时，这对我来说很重要）。

Answer 1

这可能有效




# NOT RUN {
## Only run this example in interactive R sessions
if (interactive()) {
  library(shiny)

  # A dashboard body with a row of infoBoxes and valueBoxes, and two rows of boxes
  body <- dashboardBody(

    # infoBoxes




    # Boxes
    fluidRow(
      box(status = "primary", style="position:relative;width:100%;height:0;padding-bottom:62.75%;", 
          sliderInput("orders", "Orders", min = 1, max = 2000, value = 650),
          selectInput("progress", "Progress",
                      choices = c("0%" = 0, "20%" = 20, "40%" = 40, "60%" = 60, "80%" = 80,
                                  "100%" = 100)
          )
      ),
      box(title = "Histogram box title", style="position:relative;width:100%;height:0;padding-bottom:56.25%;", 
          status = "warning", solidHeader = TRUE, collapsible = TRUE,
          plotOutput("plot", height = 250)
      )
    )


  )

  server <- function(input, output) {



    output$plot <- renderPlot({
      hist(rnorm(input$orders))
    })
  }

  shinyApp(
    ui = dashboardPage(
      dashboardHeader(),
      dashboardSidebar(),
      body
    ),
    server = server
  )
}

如果要更改高度，请使用填充底百分比。

我希望对您有帮助

R Shiny中的力箱具有相同的高度

1 个答案: