R Shiny:如何使用带有图标功能的fontawesome专业版?



我通过icon功能在我的Shiny应用程序中使用fontawesome图标。

我已经下载了 fontawesome 的专业版,并使用了此处的说明: 闪亮的仪表板 一些字体真棒图标不起作用 用我的付费版本替换 Shiny 默认使用的免费版本(shinywwwsharedfont-awesome内部)。这在本地效果很好,所有专业图标都显示在我的应用程序中。

但是,当我部署到shinyapps.io时,似乎 Shiny 又回到了使用默认版本。我确实尝试将我的专业目录包含在应用程序的/www/文件夹中,但没有成功。似乎没有办法告诉icon()函数查看 fontawesome 的本地版本,例如icon(...,lib=local)icon(...,lib=path_to_fa)......

任何帮助将非常受欢迎。

最简单、最可靠的方法是:

  1. 将字体真棒文件放在应用程序的子目录中,www/fontawesome/

  2. 将以下内容添加到 UI 代码的某处:

    htmlDependency(
    name = "font-awesome", version = "99.0",
    src = "./www/fontawesome",
    stylesheet = "css/all.min.css"
    )
    

下面是一个示例应用,说明:

shinyApp(
ui = fluidPage(
"This is a Font-Awesome Pro-only icon: ", icon("acorn"),
htmlDependency(
name = "font-awesome", version = "99.0",
src = "./www/fontawesome", stylesheet = "css/all.min.css"
)
),
function(input, output, session) { }
)

另一种方法的一个潜在问题是,如果ui组件包含对icon()的调用,然后有一些动态呈现的UI(通过renderUI()uiOutput()),其中包含对my_icon()的调用,该调用使用仅在Font-Awesome Pro中的图标,则Pro图标将不会显示。我在这里展示的方法不会有这个问题。

这就是为什么另一种方法会出现这个问题的原因:当应用程序的静态ui呈现为 HTML 时,它会在ui中查找htmlDependency对象,并且给定名称的最新版本的htmlDependency(在本例中为"font-awesome")"获胜"。因此,如果在代码中只调用icon()(并且没有调用my_icon(),或者在我的示例中显式htmlDependency()),那么获胜的 Font-Awesome 的 htmlDependency 是 Shiny 附带的 5.13.0 截至撰写本文时。浏览器将请求该版本的Font-Awesome。

稍后,如果renderUI()插入带有Pro图标的my_icon(),则HTML将与Font-Awesome Pro的htmlDependency对象一起发送到浏览器。但是,在这一点上,浏览器已经加载了Font-Awesome,并且它不知道加载这个较新版本 - Shiny目前无法用较新的版本替换已经加载的Font-Awesome版本。

将自定义htmlDependency添加到静态ui对象,使其可以在初始页面呈现时解析,并且浏览器知道从一开始就加载较新版本。我使用的版本99.0,确保此自定义版本将"胜过"任何其他版本的Font-AwesomehtmlDependency

诀窍是,在htmlDependency调用(在icon()函数中)中,删除package = "shiny"并将"www/shared/fontawesome"替换为我的 FA 文件夹的绝对路径(我还更新了版本号)。

编辑:更准确地说,下面是(非常轻微)修改的图标功能:

my_icon = function (name, class = NULL, lib = "font-awesome") {
prefixes <- list(`font-awesome` = "fa", glyphicon = "glyphicon")
prefix <- prefixes[[lib]]
if (is.null(prefix)) {
stop("Unknown font library '", lib, "' specified. Must be one of ", 
paste0(""", names(prefixes), """, collapse = ", "))
}
iconClass <- ""
if (!is.null(name)) {
prefix_class <- prefix
#if (prefix_class == "fa" && name %in% font_awesome_brands) {
#  prefix_class <- "fab"
#}
iconClass <- paste0(prefix_class, " ", prefix, "-", name)
}
if (!is.null(class)) 
iconClass <- paste(iconClass, class)
iconTag <- tags$i(class = iconClass)
if (lib == "font-awesome") {
htmlDependencies(iconTag) <- htmlDependency("font-awesome", 
"5.7.2", "./www/shared/fontawesome/", 
stylesheet = c("css/all.min.css"))
}
htmltools::browsable(iconTag)
}

除了注释掉一些行外,我唯一更改的部分是htmlDependency调用。在原始函数中,它是:

htmlDependency("font-awesome", "5.3.1", "www/shared/fontawesome", package = "shiny",
stylesheet = c("css/all.min.css", "css/v4-shims.min.css")

最新更新