如何用bslib为Shiny应用创建仅导航栏着色的可切换主题

完全可以实现这种需求，不需要依赖固定CSS文件，利用bslib的主题变量自定义功能就能配合动态切换逻辑达成效果。核心思路是单独指定导航栏的背景色，同时将页面主体的背景色设置为纯黑或纯白，再调整文字、控件的颜色适配主体背景。

下面是修改后的完整代码，新增了两个自定义主题（导航栏着色+主体白色、导航栏着色+主体黑色），并更新了主题选择器：

library(shiny)
library(markdown)
library(bslib)

ui = navbarPage(
  "Navbar!",
  theme = bs_theme(), # 初始主题
  tabPanel("Plot",
           sidebarLayout(
             sidebarPanel(radioButtons(
               "plotType", "图表类型",
               c("散点图" = "p", "折线图" = "l")
             )),
             mainPanel(plotOutput("plot"))
           )),
  navbarMenu(title = "资源",
             tabPanel(
               "界面选项",
               selectInput(
                 "theme",
                 "主题选择:",
                 c(
                   "导航栏着色+主体白色" = "navbar_light",
                   "导航栏着色+主体黑色" = "navbar_dark",
                   "系统浅色" = "light",
                   "系统深色" = "dark"
                 )
               )
             ))
)

server = function(input, output, session) {
  # 系统浅色主题
  light_theme <- bs_theme()
  
  # 系统深色主题
  dark_theme <- bslib::bs_theme(
    bg = "#222222",
    fg = "#FFFFFF",
    primary = "#FFFFFF",
    secondary = "#434343"
  )
  
  # 导航栏着色+主体白色
  navbar_light_theme <- bslib::bs_theme(
    # 页面主体背景
    bg = "#FFFFFF",
    fg = "#333333",
    # 导航栏背景（自定义颜色）
    "navbar-bg" = "#86cecb",
    # 导航栏文字颜色
    "navbar-color" = "#e12885",
    # 导航栏活跃项颜色
    "navbar-active-color" = "#89cff0",
    primary = "#89cff0"
  )
  
  # 导航栏着色+主体黑色
  navbar_dark_theme <- bslib::bs_theme(
    # 页面主体背景
    bg = "#222222",
    fg = "#FFFFFF",
    # 导航栏背景（自定义颜色）
    "navbar-bg" = "#86cecb",
    # 导航栏文字颜色
    "navbar-color" = "#e12885",
    # 导航栏活跃项颜色
    "navbar-active-color" = "#89cff0",
    primary = "#89cff0"
  )
  
  # 动态切换主题
  observe(session$setCurrentTheme({
    switch(input$theme,
           "navbar_light" = navbar_light_theme,
           "navbar_dark" = navbar_dark_theme,
           "light" = light_theme,
           "dark" = dark_theme)
  }))
  
  # 示例绘图
  output$plot <- renderPlot({
    plot(mtcars$wt, mtcars$mpg, type = input$plotType)
  })
}

if (interactive())
  shinyApp(ui, server)

关键说明： #

• 通过bs_theme()里的"navbar-bg"、"navbar-color"等Bootstrap变量，直接单独定义导航栏的样式，无需额外编写CSS
• 页面主体的背景色由bg参数控制，设置为#FFFFFF（白色）或#222222（黑色），同时配套调整文字颜色fg确保内容可读性
• 所有主题都通过session$setCurrentTheme()动态切换，完全适配应用内主题切换的需求

内容的提问来源于stack exchange，提问作者nimliug