0

I have a couple items on a shiny dashboard (using flexdashboard, shinyjs, & shinyWidgets) that become obscured whenever I try to scale from a browser size to a tablet or phone screen size. This is only happening to items instantiated using the renderUI() function. The same objects display fine if they are simply declared and "unreactive". This is not unique to the following dropdown example, but also occurs when rendering HTML() output in a similar manner.

For example, the following shinyWidget dropdown button will scale perfectly fine if it is immediately declared. In other words, it appears on screen as the appropriate height.

dropdownButton(
    p(strong("Append to API request")),
    circle = FALSE, 
    status = "danger",
    label = " Toggle",
    icon = icon("transfer", lib = "glyphicon"), 
    width = "200px"
)

This, however, does not, and becomes obscured by a succeeding panel, with excessive padding underneath that is not present at browser size.

uiOutput('sample_dropdown')
output$sample_dropdown <- renderUI(dropdownButton(
    circle = FALSE, 
    status = "danger",
    label = " Resample",
    icon = icon("record", lib = "glyphicon"), 
    width = "200px"
))
rws
  • 31
  • 6
  • You're setting width at an absolute number of pixels, so regardless of viewer size the widget is 200px. Use the % notation, like width = '50%', instead to set width based on a widgets parent div – Nate Apr 24 '18 at 17:44
  • @Nate Thanks, but that isn't the problem. I suppose using a dropdown wasn't the greatest example. This is a button. Ignore the actual event/action. The button
    height is different in both examples. The question is why is renderUI creating a extra height and obscuring output? This is also happening to a second HTML() output as I wrote above.
     – rws Apr 24 '18 at 17:59
  • aha, does using `insertUI()` instead have the same problems? it may be something in the `shinyWidget::dropdownButton()` code... – Nate Apr 24 '18 at 18:08

0 Answers0