Unclear sensitivity of Bootstrap Switch Input Controls

[omarvelor]

Considering the R Shiny code below,

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  switchInput("test1", "Destiny by Occupancy"),
  switchInput("test2", "Destiny by Origin"),
  switchInput("test3", "Destiny by Ownership")
)

server <- function(input, output) {
  
}

shinyApp(ui = ui, server = server)

The second switch button is larger than the other two for no apparent reason (this can be solved by using labelWidth = "80px").

Link to the original stackoverflow post

[pvictor]

Hello,

Probably a problem in the JavaScript library used by this widget, unfortunately this one doesn't seem to be actively maintained anymore, so I think this widget will be dprecated in a future release.

Here's some alternatives:

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  theme = bslib::bs_theme(version = 5),
  
  tags$h2("With prettySwitch"),
  prettySwitch("test1", "Destiny by Occupancy", fill = TRUE, status = "primary"),
  prettySwitch("test2", "Destiny by Origin", fill = TRUE, status = "primary"),
  prettySwitch("test3", "Destiny by Ownership", fill = TRUE, status = "primary"),
  
  tags$h2("With prettyToggle"),
  tags$div(
    style = htmltools::css(
      display = "grid",
      gridTemplateColumns = "200px 100px",
      gridTemplateRows = "repeat(3, 1fr)" 
    ),
    tags$p("Destiny by Occupancy:"),
    prettyToggle("test4", "On", "Off", icon_on = icon("check"), icon_off = icon("xmark")),
    tags$p("Destiny by Origin:"),
    prettyToggle("test5", "On", "Off", icon_on = icon("check"), icon_off = icon("xmark")),
    tags$p("Destiny by Ownership:"),
    prettyToggle("test6", "On", "Off", icon_on = icon("check"), icon_off = icon("xmark"))
  ),
  
  tags$h2("With radioGroupButtons"),
  radioGroupButtons("test7", "Destiny by Occupancy:", choices = c("On", "Off"), status = "outline-primary"),
  radioGroupButtons("test8", "Destiny by Origin:", choices = c("On", "Off"), status = "outline-primary"),
  radioGroupButtons("test9", "Destiny by Ownership:", choices = c("On", "Off"), status = "outline-primary"),
)

server <- function(input, output) {}

shinyApp(ui = ui, server = server)