使用导航栏时更改Shiny中的按钮颜色

时间:2017-10-23 13:07:03

标签: r button shiny navbar

我的目标是更改Shine侧边栏中actionButton的颜色。在我的信息中心内容使用navbarPage进行整理。

我找到了不同的解决方案,例如:

这两者都很有效,但只要我在仪表板中添加导航栏,它们就会停止工作。唯一改变颜色的东西似乎是按钮的边框而不是整个背景。

以下是可重现的例子。

这可行

library(shiny)

shinyApp(
ui = fluidPage(

  titlePanel("Styling Action Button"),
  sidebarLayout(
    sidebarPanel(
      h4("Default CSS styling"),
      # default styling
      actionButton('downloadData1', label= 'Download 1'), 
      tags$hr(),

      actionButton("download1", label="Download with style", class = "butt1"),
      # style font family as well in addition to background and font color
      tags$head(tags$style(".butt1{background-color:orange;} .butt1{color: black;} .butt1{font-family: Courier New}"))


    ),
    mainPanel()
  )
),

  server = function(input, output){}

)

这不起作用

library(shiny)

shinyApp(
  ui = fluidPage(
    navbarPage("Test multi page", 
               tabPanel("test",           
                        titlePanel("Styling Action Button"),
                        sidebarLayout(
                          sidebarPanel(
                            h4("Default CSS styling"),
                            # default styling
                            actionButton('downloadData1', label= 'Download 1'), 
                            tags$hr(),

                            actionButton("download1", label="Download with style", class = "butt1"),
                            # style font family as well in addition to background and font color
                            tags$head(tags$style(".butt1{background-color:orange;} .butt1{color: black;} .butt1{font-family: Courier New}"))


                          ),
                          mainPanel()
                        )
               ))),

  server = function(input, output){}

)

这不起作用

library(shiny)

shinyApp(
  ui = fluidPage(
    navbarPage("Test multi page",  theme = shinytheme("cerulean"), 
               tabPanel("test",   
    titlePanel("Styling Download Button"),
    sidebarLayout(
      sidebarPanel(
        h4("Default CSS styling"),
        # default styling
        actionButton('downloadData1', label= 'Download 1'), 


        actionButton("download1", label="Download with style",
                     style="color: #fff; background-color: #337ab7")


      ),
      mainPanel()
    )
  ))),

  server = function(input, output){})

1 个答案:

答案 0 :(得分:1)

参考您的第三个示例,如果您不使用shinythemes,则以下内容有效:

actionButton("download1", "Download with style", style = "color: white; background-color:#4682b4")

您可以根据自己的选择更改颜色。 style将更改按钮文字颜色,background-color将使用HTML十六进制代码更改按钮颜色。您可以在此处获取任何HEX代码:http://htmlcolorcodes.com/