如何使用R的bslib包修改Shiny应用导航栏及重置按钮颜色

完全可以通过bslib包实现你需要的样式修改，bslib原生支持Bootstrap主题定制，比传统的shinythemes灵活度高很多，你要的顶部导航栏浅绿色、重置按钮蓝色背景的需求可以直接通过参数配置实现，不需要额外写复杂的CSS。

修改后的完整可运行代码 #

library(shiny)
library(bslib) # 替换原来的shinythemes包

ui <- shiny::navbarPage(
  # 配置bslib主题，保留你原来使用的flatly风格基底
  theme = bs_theme(bootswatch = "flatly"),
  collapsible = TRUE,
  # 设置顶部导航栏背景为浅绿色，可自行调整色值匹配需求
  bg = "#90EE90",
  title = "", 
  
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins",
                  "Number of bins:",
                  min = 1,
                  max = 50,
                  value = 30),
      # 设置重置按钮背景为蓝色，文字设为白色保证可读性
      actionButton("reset", "Reset", style = "background-color: #0066CC; color: white; border: none;")
    ),
    
    mainPanel(
      plotOutput("distPlot")
    )
  )
)

server <- function(input, output, session) {
  # 补充重置按钮触发逻辑，点击后滑块回到默认值30
  observeEvent(input$reset, {
    updateSliderInput(session, "bins", value = 30)
  })
  
  output$distPlot <- renderPlot({
    x    <- faithful[, 2]
    bins <- seq(min(x), max(x), length.out = input$bins + 1)
    
    hist(x, breaks = bins, col = 'darkgray', border = 'white')
  })
}

shinyApp(ui = ui, server = server)

核心改动说明 #

• 替换shinythemes为bslib，通过bs_theme(bootswatch = "flatly")保留了原有的flatly主题风格
• 在navbarPage中新增bg参数，直接配置导航栏背景色，你可以替换色值为你想要的任意浅绿色
• 给actionButton添加style参数直接设置按钮背景色，同时调整文字颜色避免可读性问题
• 补充了重置按钮的功能逻辑，点击后滑块会回到初始默认值，符合reset按钮的实际使用需求

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