首页 > 解决方案 > 当闪亮的动作按钮点击(和未点击)改变颜色并记录点击值

问题描述

扩展change color actionButton Shiny R,我写了一个我希望抽象和简化的脚本:

我想要多个 actionButtons 并根据选择的按钮切换它们的颜色,然后记录选定的选项。

期望的输出

library(shiny)
shinyApp(
  ui = fluidPage(
    uiOutput("button"),
    uiOutput("button2"),
    uiOutput("button3"),

    textOutput("clickedButton")
  ),
  server = function(input, output) {

    global <- reactiveValues(clicked = FALSE)

    observe({
      if(length(input$option1)){
        if(input$option1) global$clicked <- TRUE
        global2$clicked <- FALSE
        global3$clicked <- FALSE
      }
    })

    output$button <-  renderUI({
      if(!is.null(input$option1) & global$clicked){
        actionButton(inputId= "option1", "Option 1",
                     style = "color: white;
                     background-color: #35e51d;
                     position: relative;
                     text-align:center;
                     text-indent: -2px;
                     border-radius: 6px;
                     border-width: 2px;
                     float: left;
                     display: inline-block;
                     margin-right: 3px;")
      }else{
        actionButton(inputId= "option1", "Option 1",
                     style = "color: black;
                     background-color: white;
                     position: relative;
                     text-align:center;
                     text-indent: -2px;
                     border-radius: 6px;
                     border-width: 2px;
                     float: left;
                     display: inline-block;
                     margin-right: 3px;")
      }

    })

    global2 <- reactiveValues(clicked = FALSE)

    observe({
      if(length(input$option2)){
        if(input$option2) global2$clicked <- TRUE
        global$clicked <- FALSE
        global3$clicked <- FALSE
      }
    })

    output$button2 <-  renderUI({
      if(!is.null(input$option2) & global2$clicked){
        actionButton(inputId= "option2", "Option 2",
                     style = "color: white;
                     background-color: #35e51d;
                     position: relative;
                     text-align:center;
                     text-indent: -2px;
                     border-radius: 6px;
                     border-width: 2px;
                     float: left;
                     display: inline-block;
                     margin-right: 3px;")
      }else{
        actionButton(inputId= "option2", "Option 2",
                     style = "color: black;
                     background-color: white;
                     position: relative;
                     text-align:center;
                     text-indent: -2px;
                     border-radius: 6px;
                     border-width: 2px;
                     display: inline-block;
                     float: left;
                     margin-right: 3px;")
      }
    })

      global3 <- reactiveValues(clicked = FALSE)


      observe({
        if(length(input$option3)){
          if(input$option3) global3$clicked <- TRUE
          global$clicked <- FALSE
          global2$clicked <- FALSE
        }
      })

      output$button3 <-  renderUI({
        if(!is.null(input$option3) & global3$clicked){
          actionButton(inputId= "option3", "Option 3",
                       style = "color: white;
                       background-color: #35e51d;
                       position: relative;
                       text-align:center;
                       text-indent: -2px;
                       border-radius: 6px;
                       border-width: 2px
                       float: left;
                       display: inline-block;
                       margin-right: 3px;")
        }else{
          actionButton(inputId= "option3", "Option 3",
                       style = "color: black;
                       background-color: white;
                       position: relative;
                       text-align:center;
                       text-indent: -2px;
                       border-radius: 6px;
                       border-width: 2px
                       float: left;
                       display: inline-block;
                       margin-right: 3px;")
        }

      })


      output$clickedButton <- renderText({
        clicked <- c(global$clicked, global2$clicked, global3$clicked)
        names <- c("Option 1", "Option 2", "Option 3")
        names[which(clicked == TRUE)]
      })
  }
)

这段代码非常脆弱,有多个观察语句在 global、global2 和 global3 之间切换(理想情况下,我希望能够将代码用于任意数量的按钮),我认为有一个更优雅的解决方案来存储单击的选项比我上面的。

任何建议/提示/帮助表示赞赏!

标签: rshinyshinyapps

解决方案


一个选项,radioGroupButtonsshinyWidgets包中使用:

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  radioGroupButtons(
    inputId = "somevalue",
    label = "Make a choice: ",
    choices = c("Option 1", "Option 2", "Option 3"),
    individual = TRUE
  ),
  verbatimTextOutput("value")
)

server <- function(input, output) {
  output[["value"]] <- renderPrint({ input[["somevalue"]] })
}

shinyApp(ui, server)

在此处输入图像描述


推荐阅读