[英]Customize drop-down width in shiny selectInput
The code below, adopted from this question , prevents a drop-down from wrapping text, and sets the width of all of the drop-downs. 从这个问题中采用的下面的代码可以防止包装文本的下拉,并设置所有下拉列表的宽度。
Is there a way to customize the width of the drop-down for each selectInput
? 有没有办法为每个
selectInput
自定义下拉列表的宽度?
library(shiny)
ui <- (fluidPage(
sidebarLayout(
sidebarPanel(
selectInput("userInput","Select User", c(1,2,3),
selected=1),
selectInput("LongInput", "Long Strings", c("This is a long long string that is long.",
"This is a long long string that is longer."))
),
# allows for long texts to not be wrapped, and sets width of drop-down
tags$head(
tags$style(HTML('
.selectize-input {
white-space: nowrap;
}
.selectize-dropdown {
width: 660px !important;
}'
)
)
)
)
))
server <- function(input, output, session) {}
shinyApp(ui, server)
If i understand your right you need something like 如果我理解你的权利,你需要类似的东西
library(shiny)
ui <- (fluidPage(
sidebarLayout(
sidebarPanel(
selectInput("userInput","Select User", c(1,2,3),
selected=1),
selectInput("LongInput", "Long Strings", c("This is a long long string that is long.",
"This is a long long string that is longer."))
),
# allows for long texts to not be wrapped, and sets width of drop-down
tags$head(
tags$style(HTML('
.selectize-input {
white-space: nowrap;
}
#LongInput + div>.selectize-dropdown{
width: 660px !important;
}
#userInput + div>.selectize-dropdown{
width: 300px !important;
}
'
)
)
)
)
))
server <- function(input, output, session) {}
shinyApp(ui, server)
Its set 660px for LongInput
and 300px for userInput
它集660px
LongInput
和300像素的userInput
you also can do it dunamic for example you have df with input name and size 你也可以做dunamic,例如你有输入名称和大小的df
df1=data.frame(name=c("LongInput","userInput"),px=c(600,300))
So try 所以试试吧
library(shiny)
ui <- (fluidPage(
sidebarLayout(
sidebarPanel(
selectInput("userInput","Select User", c(1,2,3),
selected=1),
selectInput("LongInput", "Long Strings", c("This is a long long string that is long.",
"This is a long long string that is longer."))
),
uiOutput("din_css")
)
))
server <- function(input, output, session) {
df1=data.frame(name=c("LongInput","userInput"),px=c(600,300))
output$din_css=renderUI({
tags$head(
tags$style(HTML(paste0('
.selectize-input {
white-space: nowrap;
}',
paste(apply(df1,1,function(i){
paste0("#",i[["name"]],"+ div>.selectize-dropdown{
width: ",i[["px"]],"px !important;
}")
})
,collapse='/n') )
)
)
)
})
}
shinyApp(ui, server)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.