【问题标题】:How to get more space between buttons of radioGroupButtons and to include icons如何在 radioGroupButtons 的按钮之间获得更多空间并包含图标
【发布时间】:2020-01-16 22:56:20
【问题描述】:

我正在使用 shinyWidgets 包的“radioGroupButtons”,选项为 individual = TRUE。按钮紧密并排放置。

我有两个问题。 是否有可能在按钮之间获得更多空间? 是否也可以获取带有图标(Glyphicon,Font Awesome)的按钮标签?

如果它看起来像这样就太好了:

我的代码如下:

library(shiny)
library(shinyjs)
library(shinyWidgets)

ui <- fluidPage(
  useShinyjs(),

  radioGroupButtons(
    inputId = "id000",
    label = NULL,
    choices = c("Text",  "File", "Web"),
    individual = TRUE,
    selected = character(0))
)

server <- function(input, output, session)
{
  observeEvent(input$id000, alert(input$id000), ignoreInit = TRUE)
}

shinyApp(ui = ui, server = server)

【问题讨论】:

    标签: shiny icons glyphicons shinywidgets


    【解决方案1】:

    这应该可以工作:

    library(shiny)
    library(shinyjs)
    library(shinyWidgets)
    
    ui <- fluidPage(
      useShinyjs(),
      tags$head(tags$style('.btn-group{ margin-left: 15px;}')),  # add the spacing
      icon(NULL),  # need a call to icon to attach some dependencies; probably a better solution exists
      radioGroupButtons(
        inputId = "id000",
        label = NULL,
        choices = c(`<i class='fas fa-font'></i> Text` = "Text",
                    `<i class='far fa-file-alt'></i> File` = "File", 
                    `<i class='fas fa-globe-americas'></i> Web` = "Web"),
        individual = TRUE,
        selected = character(0))
    )
    
    server <- function(input, output, session)
    {
      observeEvent(input$id000, alert(input$id000), ignoreInit = TRUE)
    }
    
    shinyApp(ui = ui, server = server)
    

    要查找更多图标,请查看?icon 中的链接。

    【讨论】:

    • 谢谢,很好用!在“fluidPage”中,我添加了“align="center"。然后为了保持按钮居中,我更改了'margin-left:15px;'进入'margin-left:7px; margin-right: 7px;'.
    猜你喜欢
    • 1970-01-01
    • 2013-07-14
    • 1970-01-01
    • 1970-01-01
    • 2022-01-23
    • 1970-01-01
    • 1970-01-01
    • 2022-10-20
    • 1970-01-01
    相关资源
    最近更新 更多