r - arrage `selectInput` 和 `pickerInput` 在同一行内联

Question

在下面的应用程序中，我想将 ashinyWidgets::pickerInput inline放在shiny::selectInput. 两个相同类型的输入（或pickerInput或selectInput）可以放在同一行，只需将它们包装在 a 中即可div(style = "inline-block")。虽然下面的应用程序将输入放在同一行/行上，但它们在垂直方向上并不相同。我查看了 DOM 检查器，但不明白为什么会发生这种情况以及如何解决它。任何帮助表示赞赏。

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

shinyApp(ui = dashboardPage(
  
  header = dashboardHeader(title = "Test"), 
  
  sidebar = dashboardSidebar(disable = TRUE),
  
  body = dashboardBody(
  
    div(style = "display: inline-block;",
      selectInput("test",
                  "Select Input",
                  choices = 1:3)
    ),
    
    div(style = "display: inline-block;",
      pickerInput(
        inputId = "somevalue",
        label = "A label",
        choices = c("a", "b")
      )
    )
  
  ) # close dashbaordBody
  ), # close dashboardPage

  server = function(input, output, session) {

})

Answer 1

您可以使用display:flex：

  body = dashboardBody(
    
    div(style = "display: flex;",
        
        selectInput("test",
                    "Select Input",
                    choices = 1:3),

        pickerInput(
          inputId = "somevalue",
          label = "A label",
          choices = c("a", "b")
        )
    )

Answer 2

我发现这也是一个恼人的问题。我发现的最简单的解决方案是将两个控件包装在 a 中fluidRow，并将每个控件包装在自己的column. 这通常有效（在这种情况下似乎有效）。如果没有，那么我会求助于调整 CSS 边框和/或填充设置，这是非常不令人满意的。

通过玩width每列的设置来调整控件的分离。

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

shinyApp(ui = dashboardPage(
  
  header = dashboardHeader(title = "Test"), 
  sidebar = dashboardSidebar(disable = TRUE),
  body = dashboardBody(
    fluidRow(
        column(
          width=6,
          selectInput("test",
                    "Select Input",
                    choices = 1:3)
        ),
        column(
          width=6,
          pickerInput(
          inputId = "somevalue",
          label = "A label",
          choices = c("a", "b"))
        )
    )
  )
),

server = function(input, output, session) {
  
})

Answer 3

这有帮助吗？

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

ui <- fluidPage(
  
  titlePanel("Hello Shiny!"),
  
  fluidRow(
    
    column(2,
           wellPanel(
             selectInput("test",
                         "Select Input",
                         choices = 1:3)
             
           )       
    ),
    
    column(2,
           pickerInput(
             inputId = "somevalue",
             label = "A label",
             choices = c("a", "b"))
    )
  )
)

阅读此内容以获取更多信息：https ://shiny.rstudio.com/articles/layout-guide.html