Question

我正在为我的程序实现shinyWidgets下拉菜单，因为答：它们看起来很棒 B：它们很容易制作。

我无法解决的问题是，一旦dropdownmenu打开，如何使工具提示消息消失。

小部件按钮的源代码如下：

  # tooltip
  if (identical(tooltip, TRUE))
    tooltip <- tooltipOptions(title = label)

  if (!is.null(tooltip) && !identical(tooltip, FALSE)) {
    tooltip <- lapply(tooltip, function(x) {
      if (identical(x, TRUE))
        "true"
      else if (identical(x, FALSE))
        "false"
      else x
    })
    tooltipJs <- htmltools::tags$script(
      sprintf(
        "$('#%s').tooltip({ placement: '%s', title: '%s', html: %s, trigger: 'hover' });",
        inputId, tooltip$placement, tooltip$title, tooltip$html
      )
    )
  } else {
    tooltipJs <- ""
  }

我尝试了将延迟设置为0的解决方案，但它不起作用。

tooltip: { hideDelay: 0}

当小部件的modaldialog打开时，任何人都知道如何使弹出窗口消失？

library("shiny")
    library("shinyWidgets")

    shinyApp(
      ui = fluidPage(
        tags$head(tags$style('#dropdown-menu-MyDDM {left: 100px;}
        tooltip: {
          hideDelay: 0
        }')),

        dropdownButton(label = "CLICK",
                       h5("HELLO"),
                       icon = icon("gear"), 
                       # right = T, 
                       inputId = "MyDDM",
                       circle = T, status = "info", size = "sm", 
                       tooltip = tooltipOptions(title = "Click to change plot"), width = "600px")

      ),

      server = function(input, output, session) {

      }
    )

Answer 1

shinyWidget的开发版本具有此功能。

可以像这样安装：

# From Github
# install.packages("devtools")
devtools::install_github("dreamRs/shinyWidgets")

代码的变化是：

-        "$('#%s').tooltip({ placement: '%s', title: '%s', html: %s });",
+       "$('#%s').tooltip({ placement: '%s', title: '%s', html: %s, trigger: 'hover' });",

最终推送指定css类的工具提示。

Answer 2

使用开发版本时，悬停弹出警报消息确实消失了。

可以通过以下方式设置工具提示消息的样式：

 tags$head(tags$style(HTML('.tooltip .tooltip-inner { max-width: 350px; border: solid; border-radius: 4px; border-width: 1px; border-color:#287fcc;
                              color: #339FFF; text-align: center; background-color: #ffffff; font-weight:bold; font-size: 12px; text-align:left; padding:12px; padding-left: 16px}
                              .tooltip {opacity: 1 !important;}
                              .tooltip.right .tooltip-arrow { border-right-color:#287fcc; }
                              .tooltip.left .tooltip-arrow { border-left-color:#287fcc; }
                              .tooltip.top .tooltip-arrow { border-top-color:#287fcc; }
                              .tooltip.bottom .tooltip-arrow { border-bottom-color:#287fcc; }' )))

以这种方式设置Dropdown菜单：

 tags$head(tags$style('#dropdown-menu-Parameter-dropdown {left: 20px; top: 60px}'))

这里我改变了垂直和水平参数，但你也可以为颜色，边框等添加其他css元素......

以这种方式设置下拉按钮的样式：

 tags$head(tags$style('#Parameter-dropdown {border-radius: 6px; border-width:2px; background-color: white; border-color: #339FFF; color: #339FFF}'))

改变大小，形状，颜色等......

bstooltip of shinyWidget dropdownbutton在打开时不会消失

2 个答案: