R shiny:在功能运行时显示"loading ..."消息

Question

我使用Shiny GUI R包.我正在寻找一种在按下actionButton后显示"loading ..."等消息的方法.该函数需要几分钟才能执行,因此我需要以某种方式通知用户按钮实际触发了某个事件.现在server.R代码如下所示:

DATA <- reactive({
  if(input$DownloadButton>0) {
    RunDownload()
  } else {
    NULL
  }
})

output$Download <- renderText({
  if(NROW(DATA())>0) {
    paste0(Sys.time(),": ",NROW(DATA()), " items downloaded")
  } else {
    ''
  }
})

actionButton()是一种从互联网下载数据的功能.input$DownloadButton是actionButton.因此,在按下按钮后,用户等待几分钟,然后才会看到一条消息,说下载成功.我想在按下actionButton之后显示消息"正在加载...",然后paste0(Sys.time(),": ",NROW(DATA()), " items downloaded")在执行结束时显示另一条消息.

Answer 1

我已经使用了比之前发布的更简单,更可靠的方式.

结合的

tags$style(type="text/css", "
           #loadmessage {
             position: fixed;
             top: 0px;
             left: 0px;
             width: 100%;
             padding: 5px 0px 5px 0px;
             text-align: center;
             font-weight: bold;
             font-size: 100%;
             color: #000000;
             background-color: #CCFF66;
             z-index: 105;
           }
  ")

同

conditionalPanel(condition="$('html').hasClass('shiny-busy')",
                 tags$div("Loading...",id="loadmessage")
)

例:

runApp(list(
  ui = pageWithSidebar(
      headerPanel("Test"),
         sidebarPanel(
           tags$head(tags$style(type="text/css", "
             #loadmessage {
               position: fixed;
               top: 0px;
               left: 0px;
               width: 100%;
               padding: 5px 0px 5px 0px;
               text-align: center;
               font-weight: bold;
               font-size: 100%;
               color: #000000;
               background-color: #CCFF66;
               z-index: 105;
             }
          ")),
           numericInput('n', 'Number of obs', 100),
           conditionalPanel(condition="$('html').hasClass('shiny-busy')",
                            tags$div("Loading...",id="loadmessage"))
         ),
         mainPanel(plotOutput('plot'))
  ),
  server = function(input, output) {
    output$plot <- renderPlot({ Sys.sleep(2); hist(runif(input$n)) })
  }
))

标签$ head()不是必需的,但将所有样式保留在head标签内是一种很好的做法.

Answer 2

尽管这个问题很老了，但我认为它仍然有意义。我提供了另一种解决方案，该解决方案在按钮上显示活动指示器，该指示器在按钮标签旁边启动一个漫长的过程。

\n

\n

我们需要一个带有标签的操作按钮，span并以某种方式识别该标签。

\n

actionButton("btnUpdate", span("Update", id="UpdateAnimate", class=""))\n

\n

我们还需要一些可以添加到按钮标签的 CSS 动画，例如：

\n

            tags$head(tags$style(type="text/css", \'\n            .loading {\n                display: inline-block;\n                overflow: hidden;\n                height: 1.3em;\n                margin-top: -0.3em;\n                line-height: 1.5em;\n                vertical-align: text-bottom;\n                box-sizing: border-box;\n            }\n            .loading.dots::after {\n                text-rendering: geometricPrecision;\n                content: "\xe2\xa0\x8b\\\\A\xe2\xa0\x99\\\\A\xe2\xa0\xb9\\\\A\xe2\xa0\xb8\\\\A\xe2\xa0\xbc\\\\A\xe2\xa0\xb4\\\\A\xe2\xa0\xa6\\\\A\xe2\xa0\xa7\\\\A\xe2\xa0\x87\\\\A\xe2\xa0\x8f";\n                animation: spin10 1s steps(10) infinite;\n                animation-duration: 1s;\n                animation-timing-function: steps(10);\n                animation-delay: 0s;\n                animation-iteration-count: infinite;\n                animation-direction: normal;\n                animation-fill-mode: none;\n                animation-play-state: running;\n                animation-name: spin10;\n            }\n            .loading::after {\n                display: inline-table;\n                white-space: pre;\n                text-align: left;\n            }\n            @keyframes spin10 { to { transform: translateY(-15.0em); } }\n            \'))\n

\n

现在我们可以使用shinyjs来操纵span动态添加按钮标签后面的动画的类。当用户按下按钮时，我们添加动画：

\n

    observeEvent(input$btnUpdate, { # User requests update\n        # ... \n\n        shinyjs::addClass(id = "UpdateAnimate", class = "loading dots")\n        shinyjs::disable("btnUpdate")\n        \n        # ...\n    })\n

\n

操作完成后，我们可以从范围中删除该类并结束动画：

\n

    output$distPlot <- renderPlot({\n        # ...\n        \n        Sys.sleep(1) # just for show, you probably want to remove it in a real app\n        # Button settings        \n        shinyjs::enable("btnUpdate")\n        shinyjs::removeClass(id = "UpdateAnimate", class = "loading dots")\n\n        # ...\n    })\n

\n

示例应用程序的完整代码可在 GitHub 上以要点形式获取。

\n

Answer 3

很简单，您可以在函数showModal()的开头和removeModal()结尾使用内置的闪亮函数。如果删除页脚，则无法从中单击该模式。

例：

observeEvent(input$button, {
     showModal(modalDialog("Doing a function", footer=NULL))
     #Do the stuff here....
     #...
     #...
     #Finish the function
     removeModal()
})