如何并排放置两个fileInputs R Shiny

Question

我想将一组 fileInput 成对并排放置。不过，它们一个一个地放在另一个下面。

我尝试在 UI:

里面做

box(
    div(style="display:inline-block", fileInput("file1", "File 1")),
    div(style="display:inline-block", fileInput("file2", "File 2")) 
)

但失败了。

我还尝试将 fileInput 小部件的宽度更改为更小，但这也不起作用。我看过其他示例，但使用了不同的小部件，解决它的方法是 div(style="display:inline-block") 格式。

这就是为什么我想问这个小部件是否可以做我想做的事情。

可重现的例子：

这是一个可重现的例子：

library(shiny)
library(shinydashboard)

## Header
Header = dashboardHeader(title = "Help! :(", titleWidth = 250)

## Sidebar
SideBar = dashboardSidebar(sidebarMenu(menuItem(text = "Help me please",tabName = "Menu", startExpanded = TRUE)))

## Tab & Body
Tab = tabItem(tabName = "Menu",
                         fluidRow(
                               box(
                                 title = "Import Data",
                                 solidHeader = TRUE, 
                                 collapsible = TRUE,
                                 width = 12,
                             
                                     fileInput(inputId = "file1",
                                               label = "File 1",
                                               multiple = TRUE,
                                               accept = c(".xlsx", ".txt"),
                                               width = '30%'),
                             
                                     fileInput(inputId = "file2",
                                               label = "File 2",
                                               multiple = TRUE,
                                               accept = c(".xlsx", ".txt"),
                                               width = '30%')
                               )
                         ))

Body = dashboardBody(tabItems(Tab))

## UI
ui = dashboardPage(header = Header,
                   sidebar = SideBar,
                   body = Body,
                   skin = "red")

## Server
server = function(input, output, session){

}

## ShinyApp
shinyApp(ui,server)

Answer 1

使用 shinydashboard 列和行 layout:

library(shiny)
library(shinydashboard)

## Header
Header = dashboardHeader(title = "Help! :(", titleWidth = 250)

## Sidebar
SideBar = dashboardSidebar(sidebarMenu(menuItem(text = "Help me please",tabName = "Menu", startExpanded = TRUE)))

## Tab & Body
Tab = tabItem(tabName = "Menu",
              fluidRow(
                  box(
                      title = "Import Data",
                      solidHeader = TRUE, 
                      collapsible = TRUE,
                      width = 12,
                      fluidRow(
                          column(width = 3, 
                                 fileInput(inputId = "file1",
                                           label = "File 1",
                                           multiple = TRUE,
                                           accept = c(".xlsx", ".txt"))
                          ),
                          column(width = 3, 
                                 fileInput(inputId = "file2",
                                           label = "File 2",
                                           multiple = TRUE,
                                           accept = c(".xlsx", ".txt"))
                          )
                      ),
                      fluidRow(
                          column(width = 3, 
                                 fileInput(inputId = "file3",
                                           label = "File 3",
                                           multiple = TRUE,
                                           accept = c(".xlsx", ".txt"))
                          ),
                          column(width = 3, 
                                 fileInput(inputId = "file4",
                                           label = "File 4",
                                           multiple = TRUE,
                                           accept = c(".xlsx", ".txt"))
                          )
                      )
                  ))
)

Body = dashboardBody(tabItems(Tab))

## UI
ui = dashboardPage(header = Header,
                   sidebar = SideBar,
                   body = Body,
                   skin = "red")

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

## ShinyApp
shinyApp(ui,server)

Answer 2

你几乎做到了！用 HTML/CSS 解决它，你可以添加 float: left 这样你就可以并排放置盒子，因为 HTML 默认情况下 div 是堆叠的。你我也想在 div 之间添加边距。 min-width 确保整个事情的响应速度更快。当视口变得太窄时，布局会将第二个 fileInput 包裹在第一个下方。

library(shiny)
library(shinydashboard)

## Header
Header = dashboardHeader(title = "Help! :(", titleWidth = 250)

## Sidebar
SideBar = dashboardSidebar(sidebarMenu(menuItem(text = "Help me please",tabName = "Menu", startExpanded = TRUE)))

## Tab & Body
Tab = tabItem(tabName = "Menu",
              fluidRow(
                box(
                  title = "Import Data",
                  solidHeader = TRUE, 
                  collapsible = TRUE,
                  width = 12,
                  div(
                    fileInput(inputId = "file1",
                              label = "File 1",
                              multiple = TRUE,
                              accept = c(".xlsx", ".txt")),
                    style="min-width:200px;max-width:45%; float:left; margin-right:2.5%"),
                  div(
                    fileInput(inputId = "file2",
                              label = "File 2",
                              multiple = TRUE,
                              accept = c(".xlsx", ".txt")),
                    style="min-width:200px;max-width:45%; float:left")
              )))

Body = dashboardBody(tabItems(Tab))

## UI
ui = dashboardPage(header = Header,
                   sidebar = SideBar,
                   body = Body,
                   skin = "red")

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

## ShinyApp
shinyApp(ui,server)

如何并排放置两个fileInputs R Shiny

How to place two fileInputs side by side R Shiny

html

css

r

widget

shiny