f7Popup | R Documentation |
f7Popup
creates a popup window with any UI content that pops up over App's main content.
Popup as all other overlays is part of so called "Temporary Views".
f7Popup( ..., id, title = NULL, backdrop = TRUE, closeByBackdropClick = TRUE, closeOnEscape = FALSE, animate = TRUE, swipeToClose = FALSE, fullsize = FALSE, closeButton = TRUE, session = shiny::getDefaultReactiveDomain() )
... |
UI elements for the body of the popup window. |
id |
Popup unique id. Useful if you want to access the popup state. input$<id> is TRUE when the popup is opened and inversely. |
title |
Title for the popup window, use |
backdrop |
Enables Popup backdrop (dark semi transparent layer behind).
Default to |
closeByBackdropClick |
When enabled, popup will be closed on backdrop click.
Default to |
closeOnEscape |
When enabled, popup will be closed on ESC keyboard key press.
Default to |
animate |
Whether the Popup should be opened/closed with animation or not.
Default to |
swipeToClose |
Whether the Popup can be closed with swipe gesture.
Can be true to allow to close popup with swipes to top and to bottom.
Default to |
fullsize |
Open popup in full width or not. Default to |
closeButton |
Add or not a button to easily close the popup.
Default to |
session |
Shiny session object. |
if (interactive()) { library(shiny) library(shinyMobile) shinyApp( ui = f7Page( title = "Popup", f7SingleLayout( navbar = f7Navbar( title = "f7Popup", hairline = FALSE, shadow = TRUE ), f7Button("togglePopup", "Toggle Popup") ) ), server = function(input, output, session) { output$popupContent <- renderPrint(input$text) observeEvent(input$togglePopup, { f7Popup( id = "popup1", title = "My first popup", f7Text("text", "Popup content", "This is my first popup ever, I swear!"), verbatimTextOutput("popupContent") ) }) observeEvent(input$popup1, { popupStatus <- if (input$popup1) "opened" else "closed" f7Toast( position = "top", text = paste("Popup is", popupStatus) ) }) } ) }
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.