首页 > 解决方案 > 如何并排放置两个fileInputs R Shiny

问题描述

我想成对并排放置一组文件输入。但是,它们被放置在另一个下方。

我尝试在 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)

标签: htmlcssrshinywidget

解决方案


使用shinydashboard基于列和行的布局

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)


推荐阅读