R 我可以编写一个简洁的基于行的界面吗？

尝试编程一个闪亮的应用程序布局，包括输入的行和列。内置函数最适合于简单的列格式。到目前为止，我们成功地嵌套了一个

fluidRow

s负载，以在下面的示例代码中获得输出

嵌套

fluidRow

：

以下是我的代码的一个子集：

ui <- fluidPage(
  h1("XXX"), #Main page title
  fluidRow(
    column(3,
           wellPanel(
             sliderInput(inputId = "time.step",
                         label = "Time",
                         value = 100, min = 0, max = 1000),
             numericInput(inputId = "no_",
                          label = "choose number",
                          value = 8, min = 1, max = 10),
             checkboxGroupInput(inputId = "chr_vec",
                                label = "characters",
                                choices = c("a", "b", "c", "d", "e", "f",
                                            "g", "h", "i", "j", "k"),
                                selected = c("a", "b")
             ), #close checkboxGroupInput
             actionButton("runbutton", "Run")
           ) #close wellPanel
    ), #close column
    #### Parameters ####
    column(8,
           fluidRow(

             conditionalPanel(
               condition = "input.chr_vec.indexOf('a') !== -1",

                    column(12,
           splitLayout("Parameters",
                     numericInput(inputId = "1.numeric.flip.time",
                                  label = "1",
                                  value = 50, min = 0, max = 1000),

                     numericInput(inputId = "2.numeric.start.val",
                                  label = "2",
                                  value = 99, min = 0, max = 1000),

                     numericInput(inputId = "3.numeric.end.val",
                                  label = "3",
                                  value = 100, min = 0, max = 1000),

                     numericInput(inputId = "sd.numeric.stdev",
                                  label = "SD",
                                  value = 0, min = 0, max = 1000)
           ) #close splitLayout
                    ) #close column
             ) #close conditionslPanel
           ), #close fluidRow


           fluidRow(
             conditionalPanel(
               condition = "input.chr_vec.indexOf('b') !== -1",
             column(12,
                    splitLayout("Parameters2",
                                numericInput(inputId = "5.numeric.flip.time",
                                             label = "5",
                                             value = 50, min = 0, max = 1000),

                                numericInput(inputId = "6.numeric.start.val",
                                             label = "6",
                                             value = 99, min = 0, max = 1000)

                    ) #close splitLayout
             ) #cose column
             ) #close conditionalPanel
           ) # close fluidRow

    ) #close column
  )
)
shinyApp(ui, server = function(input, output) { })

---

uiCSS是一个不错的选择，你只需要几行CSS就可以做很多事情。有关在R中集成CSS的更多信息，请参阅

在写这个答案的过程中，我发现我可以简化你的一些R代码。就层次结构而言，我现在只使用一个条件面板包装fluidRow。我还必须编写一个简单的for循环，以生成足够的行来检查2）的溢出问题。此处更新了R代码：

library(shiny)

choices <- c("a", "b", "c", "d", "e", "f",
             "g", "h", "i", "j", "k")


rows <- list(8)
for (choice in choices) {
  print(choice)
  row <- conditionalPanel(
    condition = paste0("input.chr_vec.indexOf('", choice, "') !== -1"),
    fluidRow(
      span(paste0("Parameters (", choice, ")")),
      numericInput(
        inputId = "1.numeric.flip.time",
        label = "1",
        value = 50,
        min = 0,
        max = 1000
      ),

      numericInput(
        inputId = "2.numeric.start.val",
        label = "2",
        value = 99,
        min = 0,
        max = 1000
      ),

      numericInput(
        inputId = "3.numeric.end.val",
        label = "3",
        value = 100,
        min = 0,
        max = 1000
      ),

      numericInput(
        inputId = "sd.numeric.stdev",
        label = "SD",
        value = 0,
        min = 0,
        max = 1000
      )
    )
  )
  rows <- append(rows, list(row))
}

ui <- fluidPage(theme = "custom.css",
                h1("XXX"), #Main page title
                fluidRow(
                  column(
                    3,
                    wellPanel(
                      sliderInput(
                        inputId = "time.step",
                        label = "Time",
                        value = 100,
                        min = 0,
                        max = 1000
                      ),
                      numericInput(
                        inputId = "no_",
                        label = "choose number",
                        value = 8,
                        min = 1,
                        max = 10
                      ),
                      checkboxGroupInput(
                        inputId = "chr_vec",
                        label = "characters",
                        choices = choices,
                        selected = c("a", "b")
                      ),
                      #close checkboxGroupInput
                      actionButton("runbutton", "Run")
                    ) #close wellPanel
                  ),
                  #close column
                  #### Parameters ####
                  do.call(column, rows)
                ))
shinyApp(
  ui,
  server = function(input, output) {

  }
)

.col-sm-8.row.form group、.form control
是一个CSS选择器，用于选择宽度为8的列中的数值输入。通过右键单击应用程序的运行版本并进行检查，可以找到这些类名/HTML结构。花括号{}的内容定义所选元素的样式。将“显示”设置为“内联块”将导致块水平流动。将宽度设置为100px将大大缩小数值输入的大小（默认值为300px）。将
.form组、.form控件
选择器替换为
span
将选择行标题。我将其设置为150px，因为这为字符串“Parameters（a）”提供了足够的空间

我已将此部署到，以便您可以观看实况演示

希望有帮助

.col-sm-8 .row .form-group,.form-control {
  display: inline-block;
  width: 100px;
}

.col-sm-8 .row span {
  width: 150px;
  display: inline-block;
}