shuffle_container: Create a Shuffle container

In dreamRs/shufflecards: Filter and Sort Grid Layouts in 'Shiny' and 'Markdown'

Description

Use this function inside the UI of a Shiny application to define a Shuffle layout.

Usage

shuffle_container(
  shuffleId,
  ...,
  card_list = NULL,
  options = shuffle_options(),
  no_card = NULL,
  use_bs_grid = FALSE,
  width = NULL
)

Arguments

shuffleId	Shuffle's id.
...	List of shuffle_cards to include.
card_list	Alternative list of shuffle_cards to include.
options	Options for Shuffle, see shuffle_options.
no_card	UI definition (or text) to display when all cards are filtered out.
use_bs_grid	Allow to use Bootstrap grid system, e.g. same as in column. If TRUE, you can use a width between 1 and 12 in shuffle_card.
width	The width of the container, e.g. '400px', or '100%'; see validateCssUnit.

Examples

if (interactive()) {
  library(shiny)
  library(shufflecards)

  ui <- fluidPage(
    tags$h2("Create a responsive grid of cards"),
    shuffle_container(
      shuffleId = "grid",
      width = "650px",
      shuffle_card(
        tags$div("My first card", style = "text-align: center; line-height: 200px"),
        style = "border: 2px solid red; border-radius: 5px;",
        width = "300px", # better with fixed width/height
        height = "200px"
      ),
      shuffle_card(
        tags$div("Second one", style = "text-align: center; line-height: 200px"),
        style = "border: 2px solid red; border-radius: 5px;",
        width = "300px", # better with fixed width/height
        height = "200px"
      ),
      shuffle_card(
        tags$div("Third one", style = "text-align: center; line-height: 200px"),
        style = "border: 2px solid red; border-radius: 5px;",
        width = "300px", # better with fixed width/height
        height = "200px"
      ),
      shuffle_card(
        tags$div("Fourth one", style = "text-align: center; line-height: 200px"),
        style = "border: 2px solid red; border-radius: 5px;",
        width = "300px", # better with fixed width/height
        height = "200px"
      )
    )
  )

  server <- function(input, output, session) {

  }

  shinyApp(ui, server)
}

dreamRs/shufflecards documentation built on Dec. 4, 2019, 4:44 a.m.