在闪亮的selectInput中自定义下拉宽度 [英] Customize drop-down width in shiny selectInput
问题描述
下面的代码通过这个问题,可以防止下拉环绕文本,并设置所有下拉菜单的宽度。
有没有办法自定义下拉菜单的宽度?每个 selectInput
?
库(闪亮)
ui< - (fluidPage(
sidebarLayout(
sidebarPanel(
selectInput(userInput,Select User,c(1,2,3),
选择= 1),
selectInput(LongInput,Long Strings,c(这是一个很长的长字符串,
这是一个很长的字符串, 。))
),
#允许长文本不被打包,并设置下拉宽度
标签$ head(
tags $ style (HTML('
.selectize-input {
白色空间:nowrap;
}
.selectize-dropdown {
width:660px!important;
}'
)
)
)
)
))
服务器< - 函数(输入,输出, session){}
shinyApp(ui,server)
如果我理解你的权利,你需要像
library(shiny)
ui< - (fluidPage(
sidebarLayout(
sidebarPanel(
selectInput(userInput,Select User,c(1,2,3),
selected) = 1),
selectInput(LongInput,Long Strings,c(这是一个很长的长字符串),
这是一个较长的长字符串。 ))
),
#允许长文本不被打包,并设置下拉宽度
标签$ head(
tags $ style(HTML ('
.selectize-input {
white-space:nowrap;
}
#LongInput + div> .selectize-dropdown {
width:660px!important;
}
#userInput + div> .selectize-dropdown {
width:300px!important;
}
'
)
)
)
)
))
服务器< - function输入,输出,会话){}
shinyApp(ui,server)
其为 LongInput
设置为660px,为 userInput
更新
你也可以做到疯狂
例如你有输入名称和大小的df
< pre $ df1 = data.frame(name = c(LongInput,userInput),px = c(600,300))
pre>
所以试试看
$ p $ library(shiny)
ui< - (fluidPage(
sidebarLayout(
sidebarPanel(
selectInput(userInput,Select User,c(1,2,3),
选择= 1),
selectInput(LongInput,Long Strings,c(这是一个很长的长字符串,
这是一个很长的字符串,它是l ))
),
uiOutput(din_css)
)
))
服务器< ;函数(输入,输出,会话){
df1 = data.frame(name = c(LongInput,userInput),px = c(600,300))
输出$ 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)
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
?
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
Update
you also can do it dunamic for example you have df with input name and size
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)
这篇关于在闪亮的selectInput中自定义下拉宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!