如何观察动态渲染的用户界面 [英] How to observe dynamically rendered ui

查看:51
本文介绍了如何观察动态渲染的用户界面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

因此,您解决了一个问题并遇到了下一个问题.

So, you solve one problem and run into the next.

我现在已经成功构建了一部分代码,该代码可以动态创建uiOutput,即许多滑块,按钮和/或文本字段,并且它们的数量取决于在更简单的步骤中从我的模型中得出的值.

I've now succesfully build a part of code that dynamically creates uiOutput, i.e. a number of sliders, buttons and/or textfields and the amount of them depends on a value that comes rolling out of my model in an ealier step.

但是,我对如何观察用户是否点击"/更改"它们一无所知.可以说,该模型给出了nr 12 然后服务器告诉我的ui做12个按钮. 我想知道用户何时按下任何一个按钮,哪个按下了哪个按钮

However, I'm pretty clueless how to observe whether they are "clicked" / "changed" by the user. Lets say, the model gives out a nr 12 then the server tells my ui to make 12 buttons. I want to know when the user pushes ANY of the buttons and WHICH button it is

举一个清晰的例子:如果用户单击按钮8,我想让R告诉我用户单击按钮8". 目的是不仅要有动态按钮,还要有动态的使用它们的反应.

To give a clear example in words: if user clicks button 8, i want to have R tell me "User clicked button 8". The objective is to have not only dynamic buttons, but also dynamic reactions to the use of them.

我的最终目标之一是收集是/否答案列表,并为每个元素输入名称.因此,我正在寻找一种通用的方式来挂起条件以观察按钮"i"或文本字段"j"等的事件

One of the final aims I have is to collect a list of yes / no answers and entered names for each of the elements. So I'm looking for a universal way to hang conditions to observeevent for button " i" or text field "j" and so on

这里是我如何创建动态UI的功能全面的最小示例.

Here is a fully functional minimal example of how I create the dynamic UI.

服务器:

shinyServer = function(input, output, session) {

  ################# start functionality HOME TAB #############################  

  values <- reactiveValues()

  observeEvent(input$myNr, { 
    values$nrofelements <- input$myNr  })  


  observeEvent(values$nrofelements, {
    if (values$nrofelements > 0 & values$nrofelements < 25) { 
    output$sliders <- renderUI({
      lapply(1:values$nrofelements, function(j) {
        sliderInput(inputId = paste0("ind", j), label = paste("Individual", j),
                    min = 0, max = 20000, value = c(0, 500), step = 100)

      })
    })
    output$buttons <- renderUI({
      lapply(1:values$nrofelements, function(i) {
        div(br(),bsButton(inputId = paste0("indr", i), label = paste("Yes", i), block = FALSE, style = "succes"), br(), br() )

      })

    })
    }  
  })

  observe({
    if(values$nrofelements != ""){
      for(nr in 1:values$nrofelements){
    if(!is.null(input[[paste0("indr", nr)]])) print(paste0("Inputname 'indr", nr, "': ", "value is ", isolate(input[[paste0("indr", nr)]])))       
      }
    }


   })

   }

和UI.r

library(shiny)

    library(shinydashboard)
   library(shinybs)





ui <- dashboardPage(
  dashboardHeader(title = "FLOW C.A.R.S."),
  dashboardSidebar(
    sidebarMenu(id = "tabs", menuItem("Home", tabName = "Home", icon = icon("book"))
    )
  ),

  dashboardBody(

tabItems(

  ### HOME ###_________
  tabItem(tabName = "Home",  class = 'rightAlign',

          h5("Enter desired nr of elements here"),
          textInput(inputId ="myNr", label = NULL , placeholder = NULL),

          fluidRow(
            column(3,
                   uiOutput("sliders")),
            column(1,
                   uiOutput("buttons")
            )
          ),

          textOutput('clickedwhat')
          )


   )
  )
)

推荐答案

好的,所以经过长时间的困惑之后,我设法找到了一个可行的答案:

Ok, so after long puzzling I have managed to find an answer that works:

server.R

shinyServer = function(input, output, session) {

  ################# start functionality HOME TAB #############################  

  values <- reactiveValues()

  dynamicvalues <- reactiveValues()

  observeEvent (input$myNr, {
    values$nrofelements <- paste0(input$myNr) })



#### RENDER DYNAMIC UI 
  observeEvent(values$nrofelements, {
    if (isolate(values$nrofelements>0)) { 
      output$actionbuttons <- renderUI({
        lapply(1:values$nrofelements, function(ab) {
          if (!is.null(dynamicvalues[[paste0("button", ab)]])) { if(dynamicvalues[[paste0("button", ab)]] == 0 ) {
            div(br(), actionButton(inputId = paste0("ind", ab), label = paste("highlight", ab)), br(), br()) } 
            else { div(br(), actionButton(inputId = paste0("ind", ab), label = paste("unhighlight", ab)), br(), br())} }
          else {
            div(br(), actionButton(inputId = paste0("ind", ab), label = paste("highlight", ab)), br(), br()) } 
            })
      })
      output$allbutton <- renderUI({ div( br(), br(), actionButton(inputId = "All", label = "All"), br(), br())
        })
      output$buttons <- renderUI({
        lapply(1:values$nrofelements, function(bsb) {
          div(br(),bsButton(inputId = paste0("indr", bsb), label = paste("Yes", bsb), 
                            block = FALSE, style = "succes", onclick = paste0("Shiny.onInputChange('rnd',", bsb,")")), br(), br() )
          })
      })

      output$multicheckbox <- renderUI ({ 
            div( br(), checkboxInput(inputId = "multiselect", label ="allow multiselect", value = FALSE, width = NULL), br())   })

    }  
  })


#### OBSERVE DYNAMIC UI

observeEvent( values$nrofelements, {
  if (values$nrofelements> 0) {

    isolate(lapply(1:values$nrofelements,  function(su) {
      dynamicvalues[[paste0("button", su)]] <- 0 }))


    dynamiclistB <- reactiveValuesToList(dynamicvalues)

    values$dynamiclistB2 <- as.character(unlist(dynamiclistB, use.names = FALSE))


  isolate(lapply(1:values$nrofelements,  function(ob) {
     observeEvent(input[[paste0("ind", ob)]], {

       if (input$multiselect == FALSE) { 
            for (clicked in 1:values$nrofelements) { if ( ob != clicked) { dynamicvalues[[paste0("button", clicked)]] <- 0} }}

        if    (is.null(dynamicvalues[[paste0("button", ob)]]))  {dynamicvalues[[paste0("button", ob)]] <- 1}  
        else    {  if (dynamicvalues[[paste0("button", ob)]] == 1) {dynamicvalues[[paste0("button", ob)]] <- 0} 
                  else { dynamicvalues[[paste0("button", ob)]] <- 1} 
                }

      dynamiclist <- reactiveValuesToList(dynamicvalues)
      values$dynamiclist2 <- as.character(unlist(dynamiclist, use.names = FALSE))
      print(paste0("dl = ", toString(values$dynamiclist2)))

      print(paste("ob =", ob ))
      values$button_nr_clicked <- ob

      myVector <- vector(mode="character", length=values$nrofelements)
      myVector <- replace(myVector, myVector == "", "GREY")
      myVector[values$button_nr_clicked]="RED"
      print(paste("pallete = ", toString(myVector)))
      print( "-----------next click event prints the below this line--------------------------------------------------------------")
      }) }) ) }})



observeEvent(input$All,{
  myVector <- NULL
  myVector <- vector(mode="character", length=values$nrofelements)
  myVector <- replace(myVector, myVector == "", "RED")

  print(paste("pallete = ", toString(myVector)))
  print( "-----------next click event prints the below this line--------------------------------------------------------------")

})

}

和UI.R

library(shiny)
library(shinydashboard)
library(shinyBS)


ui <- dashboardPage(
  dashboardHeader(title = "FLOW C.A.R.S."),
  dashboardSidebar(
    sidebarMenu(id = "tabs", menuItem("Home", tabName = "Home", icon = icon("book"))
    )
  ),

  dashboardBody(



    tabItems(




      ### HOME ###_________
      tabItem(tabName = "Home",  

              h5("Enter desired nr of elements here"),
              textInput(inputId ="myNr", label = NULL , placeholder = "NULL"),

              fluidRow(
                column(3,
                       uiOutput("actionbuttons"),
                uiOutput("allbutton")),

                column(1,
                       uiOutput("buttons")
                )
              ),
              uiOutput("multicheckbox")
              )
    )
  )
)

如您所见,我建立了一些额外的功能,例如全部"按钮,我将在现实中使用这些功能来运行具有彩虹色的调色板(在可打印的3D模式中,每个组都是自己的颜色, 和多重选择"复选框,以便用户可以突出显示1个组或多个组.

As you can see I build in some extra features like the "All" button, which I will use in reality to run a pallete with a rainbow of colors (each group in the plotly 3D scatter it's own color, and the "multi select check box so the user can hightlight either 1 group, or multiple.

我们现在拥有的是:

var'ob',报告最后一次点击的按钮 var'dl'给出了0和1的列表,以查看谁被突出显示/单击了 var'pallete,将点击转换为红色"或灰色"状态

var 'ob' that reports the last clicked button var 'dl' that gives a list of 0's and 1's to see who's highlighted / clicked var 'pallete that converts the clicks into "RED" or "GREY" status

接下来,我将构建文本输入字段,以为组添加名称, 可能是拾色器,以便用户可以自定义自己的调色板 并将bsButtons修改为是/否"按钮,方法是像我对高亮/取消突出显示按钮所做的那样,有条件地将标签呈现为是"或否",以允许用户选择要保留"的组以及为下一个删除"的组聚类阶段.

Next I will work on building text input fields to add a name to the groups, possibly a color picker so the user can custom compose his/her own pallete and a modification of the bsButtons into YES/NO buttons by conditionaly rendering the Label as YES or NO as i did with the highlight / unhighlight buttons to allow the user to select which groups to "keep" and which to "remove" for the next clustering phase.

仍然想知道以BigDataScientist开头的观察者结构是否可以实现相同的目标…….

Still wondering whether it's possible to achieve the same with the observer structure BigDataScientist started with.............

这篇关于如何观察动态渲染的用户界面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆