UI
#| standalone: true
#| components: [viewer]
#| viewerHeight: 300
library(shiny)
library(bslib)
ui <- page_fluid(
checkboxInput("show_slider", label = "Show slider", value = TRUE),
uiOutput("slider_ui")
)
server <- function(input, output) {
output$slider_ui <- renderUI({
if (input$show_slider) {
sliderInput("slider", "Slider", 1, 10, 5)
}
})
}
shinyApp(ui = ui, server = server)
library(shiny)
library(bslib)
ui <- page_fluid(
checkboxInput("show_slider", label = "Show slider", value = TRUE),
uiOutput("slider_ui")
)
server <- function(input, output) {
output$slider_ui <- renderUI({
if (input$show_slider) {
sliderInput("slider", "Slider", 1, 10, 5)
}
})
}
shinyApp(ui = ui, server = server)
Relevant Functions
-
uiOutput
uiOutput(outputId, inline = FALSE, container = if (inline) span else div, fill = FALSE, ...)
-
renderUI
renderUI(expr, env = parent.frame(), quoted = FALSE, outputArgs = list())
Details
A UI output creates an output container for a UI (i.e., HTML) element, such as a set of additional controls. Adding a UI output allows you to show, hide, or update input controls within your app.
To add a UI output, follow three steps:
Call
uiOutput()
in the UI of your app to create a div in which to display the UI element. Where you call this function within the UI functions will determine where the UI element will appear within the layout of the app. Set theoutputId
argument ofuiOutput()
to a unique value.Within the server function, call
renderUI()
and save its output as an element of theoutput
list. Name the element after theoutputId
used above. For example,output$ui <- renderUI()
.uiOutput()
will display the value of theoutput
element whose name matches itsoutputId
.Pass
renderUI()
a block of code, surrounded with{}
. The code should return a Shiny tag object, an object created withHTML()
, or a list of such objects.
See also: Dynamic UI.
Variations
Create dependent controls
You can use renderUI()
and uiOutput()
to create a set of controls that are dependent on a setting in your app. In this example, we show a different set of options when the app is in “plot” or “table” mode. Note that we use the current input values or a default value when creating the dependent controls. Without this, the values are re-initialized every time and forget previous user input.
#| standalone: true
#| components: [viewer]
#| viewerHeight: 225
library(shiny)
library(bslib)
ui <- page_fluid(
radioButtons(
"mode",
"Display mode",
choices = c("Table", "Plot"),
selected = "Table"
),
uiOutput("mode_controls")
)
server <- function(input, output) {
output$mode_controls <- renderUI({
if (input$mode == "Table") {
rows <- ifelse(!is.null(input$rows), input$rows, 10)
cols <- ifelse(!is.null(input$cols), input$cols, 4)
tagList(
sliderInput("rows", "Rows:", value = rows, min = 1, max = 10),
sliderInput("cols", "Columns:", value = cols, min = 1, max = 10)
)
}
else {
height <- ifelse(!is.null(input$height), input$height, 500)
width <- ifelse(!is.null(input$width), input$width, 500)
tagList(
sliderInput("height", "Height:", value = height, min = 100, max = 1000),
sliderInput("width", "Width:", value = width, min = 100, max = 1000),
)
}
})
}
shinyApp(ui = ui, server = server)
library(shiny)
library(bslib)
ui <- page_fluid(
radioButtons(
"mode",
"Display mode",
choices = c("Table", "Plot"),
selected = "Table"
),
uiOutput("mode_controls")
)
server <- function(input, output) {
output$mode_controls <- renderUI({
if (input$mode == "Table") {
rows <- ifelse(!is.null(input$rows), input$rows, 10)
cols <- ifelse(!is.null(input$cols), input$cols, 4)
tagList(
sliderInput("rows", "Rows:", value = rows, min = 1, max = 10),
sliderInput("cols", "Columns:", value = cols, min = 1, max = 10)
)
}
else {
height <- ifelse(!is.null(input$height), input$height, 500)
width <- ifelse(!is.null(input$width), input$width, 500)
tagList(
sliderInput("height", "Height:", value = height, min = 100, max = 1000),
sliderInput("width", "Width:", value = width, min = 100, max = 1000),
)
}
})
}
shinyApp(ui = ui, server = server)