想要自定義R中閃爍的按鈕的外觀

我對我正在開發的Shiny應用程序中的默認操作按鈕的外觀並不滿意。一些示例代碼包含在下面。我不知道從哪裏開始學習如何調整Shiny的HTML和CSS方面，以實現我想要的。想要自定義R中閃爍的按鈕的外觀

我在尋找關於如何改進這些按鈕佈局的建議。

下面是默認按鈕的樣子。

這裏是我想的按鈕來進行安排。

工作示例代碼包括：

library(shiny) 
    library(shinydashboard) 

    # UI ---------------------------------------------------------------------- 

    # Header 
    Header <- 
     dashboardHeader() 



    # Sidebar 
    Sidebar <- 
     dashboardSidebar(
     #/Sidebar Inputs ---- 

     # Date Slider 
     dateRangeInput(
      "Date_Range", 
      label = "Date Range", 
      start = Sys.time(), 
      end = Sys.time(), 
      startview = "year"), 

     # Date Buttons 
     fluidRow(
      column(4, 
       align = "left", 
       offset = 1, 
       actionButton("Last_Month", 
           label = "Last Month")), 

      column(4, 
       align = "right", 
       offset = 1, 
       actionButton("Default_Dates", 
           label = "All Dates"))), 

     fluidRow(
      column(4, 
       align = "left", 
       offset = 1, 
       actionButton("Three_Months", 
           label = "Last 3 Months"))), 

     fluidRow(
      column(4, 
       align = "right", 
       offset = 1, 
       actionButton("Six_Months", 
           label = "Last 6 Months"))) 
     ) 



    # Body 
    Body <- 
     dashboardBody() 



    # UI 
    UI <- dashboardPage(Header, Sidebar, Body) 




    # Server ------------------------------------------------------------------ 
    Server <- function(input, output, session) { } 

    # Run --------------------------------------------------------------------- 
    shinyApp(UI, Server)

來源

2016-12-02 k.putschko

快速複習 - 使用HTML添加換行符，使用列的寬度適當地對齊，注入自定義CSS到頁面中。

需要做一些更多的工作才能正確對齊所有內容。

library(shiny) 
library(shinydashboard) 

# UI ---------------------------------------------------------------------- 

# Header 
Header <- dashboardHeader() 



# Sidebar 
Sidebar <- 
    dashboardSidebar(
    #/Sidebar Inputs ---- 

    # Date Slider 
    dateRangeInput(
     "Date_Range", 
     label = "Date Range", 
     start = Sys.time(), 
     end = Sys.time(), 
     startview = "year"), 

    fluidPage(
    # Date Buttons 
     fluidRow(
     column(12, align = "center", 
       actionButton("Default_Dates", label = "All Dates", width = "100%")) 
     ), 

     fluidRow(
     column(3, align = "center", 
       actionButton("Last_Month", label = HTML("<span style='font-size:0.75em;'>Last<br />Month</span>"))), 

     column(3, align = "center", 
       actionButton("Three_Months", label = HTML("<span style='font-size:0.75em;'>Last 3<br />Months</span>"))), 

     column(3, align = "center", 
      actionButton("Six_Months", label = HTML("<span style='font-size:0.75em;'>Last 6<br />Months</span>"))), 

     column(3, align = "center", 
       actionButton("YTD", label = HTML("<span style='font-size:0.75em;'>Year to<br />Date</span>"))) 
    ) 

    ) 
) 



# Body 
Body <- 
    dashboardBody(
    tags$head(
     tags$style(HTML(".col-sm-3 button {padding:5px;}")) 
    ) 
) 



UI <- dashboardPage(Header, Sidebar, Body) 




# Server ------------------------------------------------------------------ 
Server <- function(input, output, session) { } 

# Run --------------------------------------------------------------------- 
shinyApp(UI, Server)

來源

2016-12-02 19:17:29

想要自定義R中閃爍的按鈕的外觀

回答

相關問題