dropdownButton對準內dashboardSidebar

Question

我使用的dropdownButton功能從這個鏈接drop-down checkbox input in shiny即在shinyWidgets，有輕微的修改，使得文字爲黑色。

我想dropdownButton看起來像selectInput下拉我把它上面儘可能多地。我讓他們在列（1，）函數的邊欄中排隊，但我也希望dropdownButton的寬度與selectInput的寬度相同。

我也得到了下拉選擇的寬度是其上方的selectInput與寬度= 200的寬度相同，但我想下拉按鈕也具有相同的尺寸。

人可以幫我修改dropDownButton功能或我的界面，因此這種情況？

library(shiny) 
library(shinydashboard) 


dropdownButton2 <- function(label = "", status = c("default", "primary", "success", "info", "warning", "danger"), ..., width = NULL) { 

    status <- match.arg(status) 
    # dropdown button content 
    html_ul <- list(
    class = "dropdown-menu", 
    style = if (!is.null(width)) 
     paste0("width: ", validateCssUnit(width), ";"), 
    lapply(X = list(...), FUN = tags$li, style = "margin-left: 10px; margin-right: 10px;color:black") 
) 
    # dropdown button apparence 
    html_button <- list(
    class = paste0("btn btn-", status," dropdown-toggle"), 
    type = "button", 
` data-toggle` = "dropdown" 
) 
    html_button <- c(html_button, list(label)) 
    html_button <- c(html_button, list(tags$span(class = "caret"))) 
    # final result 
    tags$div(
    class = "dropdown", 
    do.call(tags$button, html_button), 
    do.call(tags$ul, html_ul), 
    tags$script(
    "$('.dropdown-menu').click(function(e) { 
    e.stopPropagation(); 
});") 
) 
    } 

ui <- dashboardPage(
    dashboardHeader(), 
    dashboardSidebar(width = 325, 
       selectInput('month',label='Filter 1:',choices= month.name,multiple = FALSE,selected = "March"), 
       br(), 
       column(1, 
       h5(strong(("Filter 2:"))), 
       dropdownButton2(
       label = "Filter 2:", status = "default", width = 200,#circle = FALSE, 
       checkboxGroupInput(inputId = "check1", label = "Choose", choices = c("A","B","C")) 
       ) 
       )), 
    dashboardBody()   
) 

server <- function(input, output){ 
} 

shinyApp(ui = ui, server = server) 

Answer 1

你可以在你的ui代碼添加css標籤tags$style(type = 'text/css', ".btn-default{width: 275px;}")如下這樣做：

ui <- dashboardPage(
    dashboardHeader(), 
    dashboardSidebar(width = 325, 
        selectInput('month',label='Filter 1:',choices= month.name,multiple = FALSE,selected = "March"), 
        br(), 
        column(1, 
          h5(strong(("Filter 2:"))), 
          tags$style(type = 'text/css', ".btn-default{width: 275px;}"), 
          dropdownButton2(
           label = "Filter 2:", status = "default", width = 200,#circle = FALSE, 
           checkboxGroupInput(inputId = "check1", label = "Choose", choices = c("A","B","C")) 
          ) 
        )), 
    dashboardBody()   
) 

在其上添加標籤，你得到的東西是這樣的：

[編輯]： 我遲到[R意識到插入符號是不正確如在selectInput因此這種情況排列對齊，我再補充幾個CSS標籤如下：

ui <- dashboardPage(
    dashboardHeader(), 
    dashboardSidebar(width = 325, 
        selectInput('month',label='Filter 1:',choices= month.name,multiple = FALSE,selected = "March"), 
        br(), 
        column(1, 
          h5(strong(("Filter 2:"))), 

          tags$style(type = 'text/css', ".btn-default{width: 275px;}"), 
          tags$style(type = 'text/css', ".btn .caret{position: relative;}"), 
          tags$style(type = 'text/css', ".caret{top: 45%; right:-35%}"), 
          dropdownButton2(
           label = "Filter 2:", status = "default", width = 200,#circle = FALSE, 
           checkboxGroupInput(inputId = "check1", label = "Choose", choices = c("A","B","C")) 
          ) 
        )), 
    dashboardBody()   
) 

附加標籤也帶來插入符如下排列：