使用Shiny和Shinydashboard时如何使图标的大小一致？

Question

我正在我的闪亮应用程序中添加可点击图标，以显示一个弹出信息框。请参见以下屏幕截图和代码示例。我的策略是在actionLink函数中包装文本和HTML的代码。这很好。但是，图标的大小由关联的大小确定。我想知道是否可以使所有图标具有相同的大小，例如与selectInput关联的最小图标吗？

[文档（https://shiny.rstudio.com/reference/shiny/1.0.1/icon.html）提到要在"fa-3x"功能中设置icon以使尺寸为正常尺寸的3倍。但是在我的情况下，大小将由关联的文本确定，并且每个文本都有不同的大小。因此，我猜想这种策略将行不通。如果任何人都可以分享他们的想法或建议，那将是很棒的。

# Load the packages
library(shiny)
library(shinydashboard)
library(shinyalert)

# User Interface
ui <- dashboardPage(
  header = dashboardHeader(title = ""),
  sidebar = dashboardSidebar(
    sidebarMenu(
      menuItem(
        text = "Example",
        tabName = "tab1"
      )
    )
  ),
  body = dashboardBody(
    # A call to use the shinyalert package
    useShinyalert(),

    tabItems(
      tabItem(
        tabName = "tab1",
        h2(HTML("This is a title",
           as.character(actionLink(inputId = "info1", 
                                   label = "", 
                                   icon = icon("info"))))),
        fluidRow(
          box(
            title = HTML("This is the title of the box",
                         as.character(actionLink(inputId = "info2", 
                                                 label = "", 
                                                 icon = icon("info")))), 
            status = "primary", solidHeader = TRUE,
            selectInput(inputId = "Select", 
                        label = HTML("This is the title of the selectInput",
                                     as.character(actionLink(inputId = "info3", 
                                                             label = "", 
                                                             icon = icon("info")))), 
                        choices = 1:3)
          )
        )
      )
    )
  )
)

server <- function(input, output, session){
  observeEvent(input$info1, {
    shinyalert(text = "Info 1", type = "info")
  })
  observeEvent(input$info2, {
    shinyalert(text = "Info 2", type = "info")
  })
  observeEvent(input$info3, {
    shinyalert(text = "Info 3", type = "info")
  })
}

# Run the app
shinyApp(ui, server)

Answer 1

我不确定我是否能正确理解您的问题，但是如果您希望它们的大小都相同，可以像这样调整图标的字体大小：

# Load the packages
library(shiny)
library(shinydashboard)
library(shinyalert)

# User Interface
ui <- dashboardPage(
  header = dashboardHeader(title = ""),
  sidebar = dashboardSidebar(
    sidebarMenu(
      menuItem(
        text = "Example",
        tabName = "tab1"
      )
    )
  ),
  body = dashboardBody(
    # A call to use the shinyalert package
    useShinyalert(),

    tabItems(
      tabItem(
        tabName = "tab1",
        h2(HTML("This is a title", "<font size='3'>",
                as.character(actionLink(inputId = "info1", 
                                        label = "", 
                                        icon = icon("info"))), "</font>")),
        fluidRow(
          box(
            title = HTML("This is the title of the box", "<font size='3'>",
                         as.character(actionLink(inputId = "info2", 
                                                 label = "", 
                                                 icon = icon("info"))), "</font>"), 
            status = "primary", solidHeader = TRUE,
            selectInput(inputId = "Select", 
                        label = HTML("This is the title of the selectInput", "<font size='3'>", as.character(actionLink(inputId = "info3", 
                                                                                                                   label = "", 
                                                                                                                   icon = icon("info"))), "</font>"
                                     ), 
                        choices = 1:3)
          )
        )
      )
    )
  )
)

server <- function(input, output, session){
  observeEvent(input$info1, {
    shinyalert(text = "Info 1", type = "info")
  })
  observeEvent(input$info2, {
    shinyalert(text = "Info 2", type = "info")
  })
  observeEvent(input$info3, {
    shinyalert(text = "Info 3", type = "info")
  })
}

# Run the app
shinyApp(ui, server)