主題

Shiny 讓你可以輕鬆自訂應用程式的主題。Shiny 的 UI 函式使用 Twitter Bootstrap，這是一個常見的網頁應用程式框架。Bootswatch 則在 Bootstrap 之上提供擴充，讓你只需少量程式碼就能替應用程式換上不同外觀。

在此練習中，你會為你的應用程式加入標題面板、使用主題選擇器探索不同主題，然後套用你選擇的主題。

本練習屬於課程

使用 R 的 Shiny 建立網頁應用程式

檢視課程

練習說明

執行應用程式，並使用右上角的主題選擇器來探索不同的 Bootswatch 主題。
為頁面加入合適的標題。
將 themeSelector() 替換為你選擇的主題。

動手互動練習

試著完成這個範例程式碼，體驗一下這個練習。

ui <- fluidPage(
  # CODE BELOW: Add a titlePanel with an appropriate title
  
  # REPLACE CODE BELOW: with theme = shinythemes::shinytheme("")
  shinythemes::themeSelector(),
  sidebarLayout(
    sidebarPanel(
      selectInput('name', 'Select Name', top_trendy_names$name)
    ),
    mainPanel(
      tabsetPanel(
        tabPanel('Plot', plotly::plotlyOutput('plot_trendy_names')),
        tabPanel('Table', DT::DTOutput('table_trendy_names'))
      )
    )
  )
)

server <- function(input, output, session){
  # Function to plot trends in a name
  plot_trends <- function(){
     babynames %>% 
      filter(name == input$name) %>% 
      ggplot(aes(x = year, y = n)) +
      geom_col()
  }
  output$plot_trendy_names <- plotly::renderPlotly({
    plot_trends()
  })
  
  output$table_trendy_names <- DT::renderDT({
    babynames %>% 
      filter(name == input$name)
  })
}

shinyApp(ui = ui, server = server)

編輯並執行程式碼