Shinydashboard::box 中的 splitLayout答案

【问题标题】：splitLayout in shinydashboard::boxShinydashboard::box 中的 splitLayout
【发布时间】：2019-01-01 02:40:09
【问题描述】：

目标

我想在shinydashboard::box 的页脚中的selectInput 旁边放置一个actionButton。根据this SO questionsplitLayout应该做我想做的。

问题

selectInput 放入页脚时不会填满整个空间。似乎一旦在页脚中，selectInput 总是采用固定宽度。有趣的是，当将相同的元素放入盒子的主体时，控件会按预期呈现。

问题

如何管理 selectInput 和 actionButton

彼此相邻并且
跨越整条线？

代码

library(shiny)
library(shinydashboard)

boxUI <- function(width) {
  box(
    splitLayout(
      selectInput("x", NULL, paste(strrep("x", 10), 1:10)),
      actionButton("ok", icon("trash")),
      cellWidths = c("85%", "15%"),
      cellArgs = list(style = "vertical-align: top")),
    footer = splitLayout(
      selectInput("y", NULL, paste(strrep("x", 10), 1:10)),
      actionButton("ok", icon("trash")),
      cellWidths = c("85%", "15%"),
      cellArgs = list(style = "vertical-align: top")
    ), width = width, solidHeader = TRUE, status = "info", title = "Box")
}

ui <- dashboardPage(
  dashboardHeader(), 
  dashboardSidebar(),
  dashboardBody(
    tags$head(
      tags$style(
        HTML(".shiny-split-layout > div {
                  overflow: visible;
              }"))),
    fluidRow(
      boxUI(4),
      boxUI(3))
  ))

server <- function(input, output) {
}

shinyApp(ui, server)

【问题讨论】：

标签： r shiny shinydashboard

【解决方案1】：

如果您将 selectInput 放在 div 中并将宽度设置为 100%，那么您应该可以找到所需的内容。

footer = splitLayout(
    tags$div(
        selectInput("y", NULL, paste(strrep("x", 10), 1:10), width="100%")
    ),
    actionButton("ok", icon("trash")),
    cellWidths = c("85%", "15%"),
    cellArgs = list(style = "vertical-align: top")
),

【讨论】：

完美+1！谢谢，仅供参考，不需要div。