将操作按钮与闪亮仪表板中的输入对齐

Question

您好。
我正在尝试将 materialSwitch 复选框与一些 pickerInput 框对齐。
这是它的样子与我想要的样子：

这里是问题的简化代码，请帮忙！

library(shiny)
library(shinydashboard)
library(shinyWidgets)

#----------------------------------------------------------------------------#

ui <- {dashboardPage(
  dashboardHeader(title=""),
  dashboardSidebar(),
  dashboardBody(
    fluidRow(box(column(materialSwitch("t0"),width=1),
                 column(pickerInput(inputId="t1",label="",choices=c("Yes","No")),
                        pickerInput(inputId="t2",label="",choices=c("Yes","No")),width=3),
                 column(pickerInput(inputId="t3",label="",choices=c("Yes","No")),
                        pickerInput(inputId="t4",label="",choices=c("Yes","No")),width=4),
                 column(pickerInput(inputId="t5",label="",choices=c("Yes","No")),
                        pickerInput(inputId="t6",label="",choices=c("Yes","No")),width=4),
                 actionButton("t7","",width="100%"),width=12))))
}

#----------------------------------------------------------------------------#

server <- function(input, output) {}

#----------------------------------------------------------------------------#

shinyApp(ui = ui, server = server)

此外，如果有办法收紧 space，或者减少开关和输入框之间的边距，那会膨胀。我当前的代码还使其中一个 pickerInputs 的宽度与其他宽度不同（包括开关），如果有一种方法可以使它们成比例，那么它们的宽度都相同，这会额外膨胀。

谢谢。

Answer 1

您可以应用一些 css 来移动 materialSwitch。

div(column(materialSwitch("t0"),width=1), style = 'top: 25px;position:relative;')

完整代码-

library(shiny)
library(shinydashboard)
library(shinyWidgets)

#----------------------------------------------------------------------------#

ui <- {dashboardPage(
  dashboardHeader(title=""),
  dashboardSidebar(),
  dashboardBody(
    fluidRow(box(div(column(materialSwitch("t0"),width=1), style = ' top: 25px;position: relative;'),
                 column(pickerInput(inputId="t1",label="",choices=c("Yes","No")),
                        pickerInput(inputId="t2",label="",choices=c("Yes","No")),width=3),
                 column(pickerInput(inputId="t3",label="",choices=c("Yes","No")),
                        pickerInput(inputId="t4",label="",choices=c("Yes","No")),width=4),
                 column(pickerInput(inputId="t5",label="",choices=c("Yes","No")),
                        pickerInput(inputId="t6",label="",choices=c("Yes","No")),width=4),
                 actionButton("t7","",width="100%"),width=12))))
}

#----------------------------------------------------------------------------#

server <- function(input, output) {}

#----------------------------------------------------------------------------#

shinyApp(ui = ui, server = server)

将操作按钮与闪亮仪表板中的输入对齐

align action button with inputs in shinydashboards

r

shiny

shinydashboard