CommencerCommencez gratuitement

Thèmes

Shiny facilite la personnalisation du thème d’une application. Les fonctions d’interface de Shiny s’appuient sur Twitter Bootstrap, un framework populaire pour créer des applications web. Bootswatch étend Bootstrap et permet de changer l’apparence d’une application très facilement, avec très peu de modifications de code.

Dans cet exercice, vous allez ajouter un panneau de titre à votre application, utiliser le sélecteur de thèmes pour explorer différentes options, puis appliquer le thème de votre choix.

Cet exercice fait partie du cours

<cours>Créer des applications web avec Shiny en R</cours>
Voir le cours

Instructions de l’exercice

  • Exécutez l’application et utilisez le sélecteur de thèmes en haut à droite pour explorer différents thèmes Bootswatch.
  • Ajoutez un titre pertinent à la page.
  • Remplacez themeSelector() par le thème de votre choix.

Exercice interactif pratique

Essayez cet exercice en complétant ce code d’exemple.

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)
Modifier et exécuter le code