Creating Material Design Checkbox Groups in R Shiny with shinymaterial

=====================================

In this article, we will explore how to create material design checkbox groups in an R Shiny application using the shinymaterial package. We will delve into the details of creating a custom function that generates individual checkboxes and discuss alternative approaches.

Introduction to shinymaterial

The shinymaterial package provides a set of user interface components based on Google’s Material Design guidelines. While it offers a wide range of customizable UI elements, it lacks support for checkbox groups out of the box. In this article, we will explore how to work around this limitation by creating our own custom function that generates individual checkboxes.

Creating Custom Checkbox Function

To create a custom checkbox function, we can start by defining a function called materialCheckboxGroupGen that takes in several parameters:

idBase: the base ID for all input IDs
choices: a character vector containing the labels for each checkbox
initials: an optional logical vector indicating the initial value for each checkbox (defaults to FALSE)
color: an optional character vector containing the color for each checkbox (requires hex codes, e.g., “#ef5350”)

Here is the implementation of the materialCheckboxGroupGen function:

## Create a custom function to generate individual checkboxes

materialCheckboxGroupGen <- function(idBase, choices, initials = rep(FALSE, length(out)), color = rep("", length(choices))) {
  # Setup
  nBoxes <- length(choices)
  if (missing(initials)) {
    initials <- rep(FALSE, length.out = nBoxes)
  }
  
  # Color will be recycled if it is not long enough
  if (length(color) != nBoxes) {
    color <- rep(x = color, length.out = nBoxes)
    warning("Length of color input not the same as number of choices. Color vector recycled to match.")
  }
  
  # Loop to generate commands
  for (i in 1:nBoxes) {
    # Set up all the arguments
    id <- paste0("\"", idBase, as.character(i), "\"")
    lab <- paste0("\"", choices[i], "\"")
    init <- as.character(initials[i])
    col <- paste0("\"", color[i], "\""
    
    # Add a comma before all but the first checkbox
    if (i != 1) {
      command <- paste0(command, ", ")
    }
    
    # Add a new checkbox command to the end of the string
    command <- paste0(command,
                      "material_checkbox(input_id = ", id,
                      ", label = ", lab,
                      ", initial_value = ", init,
                      ", color = ", col,
                      ")")
  }
  
  return(command)
}

Using the Custom Checkbox Function in Shiny UI

To use the custom checkbox function in a Shiny application, you can wrap its output in eval(parse(text = ...)). Here is an example of how to do this:

# Create a minimal working example using the custom checkbox function

library(shiny)
library(shinymaterial)

out <- c('material_checkbox(input_id = "testing1",
                             label = "Foo",
                             initial_value = FALSE,
                             color = "#ef5350")',
         'material_checkbox(input_id = "testing2",
                           label = "Bar",
                           initial_value = FALSE,
                           color = "#ef5350")')

ui <- material_page(
  title = "shinymaterial",
  tags$br(),
  material_row(
    material_column(
      width = 2,
      material_card(
        title = "",
        depth = 4,
        lapply(out, function(x) eval(parse(text = x)))
      )
    ),
    material_column(
      width = 9,
      material_card(
        title = "Output here",
        depth = 4
      )
    )
  )
)

server <- function(input, output) {
  NULL
}

shinyApp(ui, server)

Alternative Approach using `make_checkboxgroup` Function

Instead of using the custom checkbox function, we can create an alternative approach by defining a new function called make_checkboxgroup. This function takes in a character vector and returns a list of individual checkboxes.

Here is the implementation of the make_checkboxgroup function:

## Create an alternative approach to generate individual checkboxes

make_checkboxgroup <- function(x) {
  lapply(seq_along(x), function(i) {
    material_checkbox(input_id = paste0("var", i), label = x[i])
  })
}

In the Shiny UI, we can use this new function to dynamically generate the checkboxes based on user input.

# Create a minimal working example using the alternative approach

library(shiny)
library(shinymaterial)

ui <- material_page(
  title = "shinymaterial",
  tags$br(),
  material_row(
    material_column(
      width = 3,
      material_text_box("string", "Variables"),
      uiOutput("checkboxes")
    ),
    material_column(
      width = 9,
      material_card(
        title = "Output here",
        depth = 4,
        htmlOutput("checkbox_status")
      )
    )
  )
)

server <- function(input, output) {
  output$checkboxes <- renderUI({
    X <- strsplit(input$string, ",")[[1]]
    do.call(material_card, c(make_checkboxgroup(X), title = "", depth = 4))
  })
  
  output$checkbox_status <- renderUI({
    X <- strsplit(input$string, ",")[[1]]
    status <- sapply(paste0("var", seq_along(X)), function(i) input[[i]])
    HTML(paste(X, status, collapse = '&lt;br/&gt;'))
  })
}

shinyApp(ui, server)

In this alternative approach, we use renderUI to generate the checkboxes dynamically based on user input. We also use htmlOutput to display the checkbox values.

Conclusion

In this article, we explored how to create material design checkbox groups in an R Shiny application using the shinymaterial package. We defined a custom function called materialCheckboxGroupGen that generates individual checkboxes and discussed alternative approaches using make_checkboxgroup. By understanding these different methods, you can tailor your Shiny application’s UI to meet specific requirements.

References

Last modified on 2024-10-06