css 的闪亮进度条

Question

在以下脚本中，我尝试使用 CSS 更改默认的闪亮进度条：

server <- function(input, output) {
  output$plot <- renderPlot({
    input$goPlot

    dat <- data.frame(x = numeric(0), y = numeric(0))

    withProgress(message = 'Making plot', value = 0, {
      n <- 10

      for (i in 1:n) {
        dat <- rbind(dat, data.frame(x = rnorm(1), y = rnorm(1)))
        incProgress(1/n, detail = paste("Doing part", i))
        Sys.sleep(0.1)
      }
    })

    plot(dat$x, dat$y)
  })
}

ui <- shinyUI(basicPage(
   tags$style(type = 'text/css', '.shiny-progress .progress-text { color: #020202; font-size: 30px; background-color: #FF0000; }'),

   plotOutput('plot', width = "300px", height = "300px"),
   actionButton('goPlot', 'Go plot')
))

shinyApp(ui = ui, server = server)

我尝试用这一行来改变颜色、字体大小和背景颜色：

tags$style(type = 'text/css', '.shiny-progress .progress-text { color: #020202; font-size: 30px; background-color: #FF0000; }'),

完全遵循温斯顿张的建议：https://groups.google.com/forum/#!topic/shiny-discuss/aFJTOLhld3U and consulting: https://github.com/rstudio/shiny/blob/515a67a/inst/www/shared/shiny.css#L94-L114

但无论我尝试什么，都没有改变进度条。有人有什么主意吗？例如。我是否使用正确的 css 选择器 'connect' 到闪亮的进度条？

Answer 1

如果您想使用自定义 css，您必须设置选项 style="old":

withProgress(message = 'Making plot', value = 0, {
  n <- 10
  for (i in 1:n) {
    dat <- rbind(dat, data.frame(x = rnorm(1), y = rnorm(1)))
    incProgress(1/n, detail = paste("Doing part", i))
    Sys.sleep(0.1)
  }
}, style="old")

css 的闪亮进度条

shiny progress bar with css

css

r

progress

progress-bar

shiny