shinycssloaders (version 1.1.0)

showHidePage: Show (and hide) a full-page spinner that covers the entire page

Description

Use these functions to show and hide a full-page spinner.

All parameters (except expr) can be set globally in order to use a default setting for all full-page spinner in your Shiny app. This can be done by setting an R option with the parameter's name prepended by "page.spinner.". For example, to set all page spinners to type=5 and color=#0dc5c1 by default, use options(page.spinner.type = 5, page.spinner.color = "#0dc5c1").

Usage

showPageSpinner(
  expr,
  background = getOption("page.spinner.background", default = "#FFFFFFCC"),
  type = getOption("page.spinner.type", default = 8),
  color = getOption("page.spinner.color", default = "#0275D8"),
  size = getOption("page.spinner.size", default = 1),
  color.background = getOption("page.spinner.color.background"),
  custom.css = getOption("page.spinner.custom.css", default = FALSE),
  id = getOption("page.spinner.id"),
  image = getOption("page.spinner.image"),
  image.width = getOption("page.spinner.image.width"),
  image.height = getOption("page.spinner.image.height"),
  caption = getOption("page.spinner.caption")
)
hidePageSpinner()

Value

If expr is provided, the result of expr is returned. Otherwise, NULL.

Arguments

expr

(optional) An R expression to run while showing the spinner. The spinner will automatically get hidden when this expression completes. If not provided, you must explicitly end the spinner with a call to hidePageSpinner().

background

Background color for the spinner. You can use semi-transparent colours in order to have the Shiny app visible in the background, eg. "#FFFFFFD0" or "rgba(0, 0, 0, 0.7)".

type

The type of spinner to use. Valid values are integers between 0-8 (0 means no spinner). Check out https://daattali.com/shiny/shinycssloaders-demo/ to see the different types of spinners. You can also use your own custom image using the image parameter.

color

The color of the spinner in hex format. Ignored if image is used.

size

The size of the spinner, relative to its default size (default is 1, a size of 2 means twice as large). Ignored if image is used.

color.background

For certain spinners (type 2-3), you will need to specify the background color of the spinner. Ignored if image is used.

custom.css

Set to TRUE if you have your own custom CSS that you defined and you don't want the automatic CSS applied to the spinner. Ignored if image is used.

id

The HTML ID to use for the spinner. If you don't provide one, it will be generated automatically.

image

The path or URL of the image to use if you want to use a custom image instead of a built-in spinner. If image is provided, then type is ignored.

image.width

The width for the custom image spinner, in pixels. If not provided, then the original size of the image is used. Ignored if not using image.

image.height

The height for the custom image spinner, in pixels. If not provided, then the original size of the image is used. Ignored if not using image.

caption

Caption to display below the spinner or image (text or HTML). The caption's font color is determined by the color parameter. Ignored if type is 1.

See Also

withSpinner(), showSpinner(), hideSpinner()

Examples

if (interactive()) {
  library(shiny)

  #--- Example 1: Using showPageSpinner/hidePageSpinner ---

  ui <- fluidPage(
    actionButton("go", "Go"),
    plotOutput("plot")
  )
  server <- function(input, output) {
    observeEvent(input$go, {
      showPageSpinner()
      Sys.sleep(1)
      hidePageSpinner()
    })
    output$plot <- renderPlot({
     plot(runif(10))
    })
  }
  shinyApp(ui, server)

  #--- Example 2: Using showPageSpinner with expr ---

  some_slow_function <- function() {
    Sys.sleep(1)
  }

  ui <- fluidPage(
    actionButton("go", "Go"),
    plotOutput("plot")
  )
  server <- function(input, output) {
    observeEvent(input$go, {
      showPageSpinner({ some_slow_function() })
    })
    output$plot <- renderPlot({
     plot(runif(10))
    })
  }
  shinyApp(ui, server)
}