r - SelectInput 选项隐藏在 Shiny App 中的 downloadButton 后面

Question

我有一个 Shiny 的应用程序的 UI 问题。在我的应用程序中，我的 selectInputs 的选项隐藏在 downloadButton 后面。

library(shiny)
ui <- navbarPage(
 tabPanel("View Archive",
                          sidebarLayout(
                            sidebarPanel(
                              tags$h4("Archive Filter", style = "font-weight: 450; margin-top: 0; text-decoration: underline; text-align: center",
                              radioButtons(
                                inputId = "archive.choice",
                                label = "Select Tasks to Display",
                                choices = c("Completed" = "archive.completed", "Scheduled" = "archive.scheduled")
                              ),
                              tags$h4("Create Archive Report", style = "font-weight: 450; margin-top: 0; text-decoration: underline; text-align: center"),
                              splitLayout(cellWidths = c("50%", "50%"), 
                                  selectInput(
                                  inputId = "report.month",
                                  label = "Select Month",
                                  choices =  as.list(month.name)
                                ), 
                                selectInput(
                                  inputId = "report.year",
                                  label = "Select Year",
                                  choices =  (2020:format(Sys.Date(), "%Y"))
                                )
                                ),
                                downloadButton('downloadData', 'Download Report')
                              )
                          ))
  )
server <- function(input, output, session) {}
shinyApp(ui, server)

我试过更改 selectInputs 的 z-index，但没有成功。有谁知道解决这个问题的方法？看起来应该很简单，但我一直无法找到解决方案。提前致谢。

Answer 1

我改变了 splitLayout 方法并使用了 fluidRow()用两列代替。

library(shiny)

ui <- navbarPage(
  title = 'StackOverFlow App',
  tabPanel(
    title = "First Panel",
    sidebarLayout(
      sidebarPanel = sidebarPanel(
        tags$h4("Archive Filter", style = "font-weight: 450; margin-top: 0; text-decoration: underline; text-align: center"),
        radioButtons(
          inputId = "archive.choice",
          label = "Select Tasks to Display",
          choices = c("Completed" = "archive.completed", "Scheduled" = "archive.scheduled")
        ),
        tags$h4("Create Archive Report", style = "font-weight: 450; margin-top: 0; text-decoration: underline; text-align: center"),
        fluidRow(
          column(
            width = 6,
            selectInput(
              inputId = "report.month", label = "Select Month",
              choices =  as.list(month.name)
              )
            ),
          column(
            width = 6, 
            selectInput(
              inputId = "report.year", label = "Select Year",
              choices =  (2020:format(Sys.Date(), "%Y")))
            )
          ),
        downloadButton('downloadData', 'Download Report', style='z-index:1;')
      ),
      mainPanel = mainPanel()
    )
  )
)


server <- function(input, output, session) {
  
}

shinyApp(ui, server)

使用 splitLayout 完成工作有必要更改 css z-index selectImput 的属性。