f7Skeleton {shinyMobile} | R Documentation |
Framework 7 skeleton effect
Description
Nice loading overlay for UI elements.
Usage
f7Skeleton(
target = ".card",
effect = c("fade", "blink", "pulse"),
duration = NULL,
session = shiny::getDefaultReactiveDomain()
)
Arguments
target |
CSS selector on which to apply the effect. In general, you apply the effect on a wrapper such as a card, such that all nested elements receive the skeleton. |
effect |
Choose between "fade", "blink" or "pulse". |
duration |
Effect duration. NULL by default. If you know exactly how much time your most time consuming output takes to render, you can pass an explicit duration. In other cases, leave it to NULL. |
session |
Shiny session object. |
Examples
if (interactive()) {
library(shiny)
library(shinyMobile)
shinyApp(
ui = f7Page(
title = "Skeletons",
f7SingleLayout(
navbar = f7Navbar(title = "f7Skeleton"),
f7Card(
title = "Card header",
"This is a simple card with plain text,
but cards can also contain their own header,
footer, list view, image, or any other element.",
footer = tagList(
f7Button(color = "blue", label = "My button", href = "https://www.google.com"),
f7Badge("Badge", color = "green")
)
),
f7List(
f7ListItem(
href = "https://www.google.com",
title = "Item 1"
),
f7ListItem(
href = "https://www.google.com",
title = "Item 2"
)
)
)
),
server = function(input, output, session) {
observeEvent(TRUE, {
f7Skeleton(".card", "fade", 2)
}, once = TRUE)
}
)
}
[Package shinyMobile version 1.0.1 Index]