如何在R Shiny中对齐一组checkboxGroupInput

Question

我使用下面的代码创建了一组checkboxGroupInput，但显示不正确。 它看起来像这样：

任何想法如何强制在Shiny中正确对齐？

ui.R

uiOutput(outputId = "numSelector")

server.R

        output$numSelector <- renderUI({
        out <- checkboxGroupInput(
            inputId = "numSelector",
            label   = "Select the numbers to filter on:",
            choices = selectRange(input$dataName),
            inline = TRUE
        )
        return(out)
    })

Answer 1

通过调整div标签可以解决这个问题。一个小例子闪亮的应用程序插图：

$location.path("<routeUrl>")

$state.go("<stateName>")看起来像这样：

我将此解决方案与帮助表单拼凑在一起：CSS-Tricks和This Google Groups发布。

Answer 2

我知道这篇文章很古老，但...... 受Peter的回答启发，我挖出并修复它只是调整现有的checkboxGroupInput。该组的标签仍然在我的输入上方，而其余的布局是相同的。

在你的ui中添加它。对我来说，这是侧边栏中tagList（）的成员（只是为了保持代码在一起），但它应该在任何地方工作（只要它在tagList（）中，或者我猜它是否是唯一的元素）。

tags$head(
    tags$style(
      HTML(
        ".checkbox-inline { 
                    margin-left: 0px;
                    margin-right: 10px;
          }
         .checkbox-inline+.checkbox-inline {
                    margin-left: 0px;
                    margin-right: 10px;
          }
        "
      )
    ) 
  )

Answer 3

另一种简单的解决方案是只使用shinyWidgets package（样式选择更多）和prettyCheckbox，所有复选框在左侧对齐，尽管单个复选框未对齐-您可能必须使用CSS以及上面的解决方案（如果您确实需要）。另一方面，使用css，您必须指定列数，并且它们不会根据窗口大小动态地换行。