Question

问题

我想创建一个UI，其中有几个滑块，一个绘图输出和单选按钮。使用滑块，您可以选择值，使用单选按钮可以选择哪个滑块与绘图相关。

理想情况下，我会在每个滑块前面显示一个单选按钮（不显示标签），而不是使用单选按钮组。我怎样才能做到这一点？我想在css进行一些调整？我使用复选框（不是复选框组）并使用column做了类似的事情。但是在这种情况下，单选按钮会更合适，因为我想限制用户只选择一个元素。

当前状态

(Radiobutton 1)
(Radiobutton 2)
[----Slider 1----]
[----Slider 2----]

理想情况

(Radiobutton 1) [----Slider 1----]
(Radiobutton 2) [----Slider 2----]

代码

library(shiny)
app <- shinyApp(
   ui = bootstrapPage(
      radioButtons("slds.rb", label = "", choices = paste0("sld", 1:2)),
      sliderInput("sld1", min = 0, max = 10, label = "y1", value = 5),
      sliderInput("sld2", min = 0, max = 10, label = "y2", value = 5),
      plotOutput('plot')
   ),
   server = function(input, output) {
      output$plot <- renderPlot({ 
         plot(seq_len(input[[input$slds.rb]]))
      })
   })
runApp(app)

Answer 1

您可以使用div函数（在HTML中创建<div>块）并结合样式display: inline-block;来执行此操作。所以你的ui变成了：

ui = bootstrapPage(
    div(style="display: inline-block;",radioButtons("slds.rb", label = "", choices = paste0("sld", 1:2),width = '100px')),
    div(style="display: inline-block;",sliderInput("sld1", min = 0, max = 10, label = "y1", value = 5),
                                      sliderInput("sld2", min = 0, max = 10, label = "y2", value = 5)),
    plotOutput('plot')
  )

这会将CSS display: inline-block;应用于div块。

编辑：这只是让它们并排......要将它们相互对齐，需要手动调整padding和margin。

在闪亮的应用程序中对齐单选按钮选项和滑块

1 个答案: