在Shiny中对输入小部件进行分组

时间:2016-10-05 14:54:10

标签: r user-interface layout shiny

我正在构建一个Shiny应用程序,我希望能够对输入小部件进行分组,最好是每个组的标题。例如,我想要一个“裤子尺寸”的盒子,腰部有下拉式内裤,羽绒服有下拉式,然后是另一个“T恤尺寸”的盒子,下拉式为XS / S /男女皆宜/女士的M / L / XL和单选按钮。

有没有办法将各种小部件放在自己的盒子里,或者打破他们都进来的标准灰盒子?

谢谢!

2 个答案:

答案 0 :(得分:3)

如果您想使用fluidPage布局,而您的问题只与布局相关:我的想法是" group"面板中的那些小部件,然后自定义这些面板的样式(CSS)。例如,您可以使用网格布局或侧边栏布局。

采取的示例from this post

library(shiny)
ui <- shinyUI(fluidPage(
  tags$head(tags$style(
    HTML('
         #sidebar, #sidebar2 {
            border: 1px solid black;
        }
        body, label, input, button, select { 
          font-family: "Arial";
        }')
  )),
  titlePanel("Hello Shiny!"),
  fluidRow(
    column(4,
           sidebarLayout(
             sidebarPanel(width = 12, id="sidebar",
                          h5("Pants size"),
                          sliderInput("waist",
                                      "waist:",
                                      min = 1,
                                      max = 50,
                                      value = 30),
                          sliderInput("inseam",
                                      "inseam:",
                                      min = 1,
                                      max = 50,
                                      value = 30)
             ),
             mainPanel( width = 0)
           )
           ),
    column(8,sidebarLayout(
      sidebarPanel(width = 12, id="sidebar2",
                   h5("T-shirt size"),
                   selectInput("waist",
                               "Choose your size:",
                               choices = c("XS","S","M","L","XL")),
                   radioButtons("sex",
                                "sex:",
                                choices = c("unisex","women's"))
      ),
      mainPanel( width = 0)
    ) )
  )
  )
)
server <- shinyServer(function(input, output) {
})
shinyApp(ui=ui,server=server)

enter image description here

在此示例中,关键面板有两个名为sidebarsidebar2的ID。此ID在上面的CSS部分中使用。在这里阅读有关面板的更多信息:

另一种使用盒子的方法是shinydashboards,在这里阅读更多相关信息:https://rstudio.github.io/shinydashboard/structure.html#boxes

答案 1 :(得分:0)

选中wellPanel()将输入分组,然后自定义css