changer de couleurs interface shiny

Postez ici vos questions, réponses, commentaires ou suggestions - Les sujets seront ultérieurement répartis dans les archives par les modérateurs

Modérateur : Groupe des modérateurs

alexandre cavasino
Messages : 34
Enregistré le : 13 Juin 2017, 08:14

changer de couleurs interface shiny

Messagepar alexandre cavasino » 12 Juin 2018, 09:40

Bonjour,
Je vous contacte car je suis actuellement en train de créer une interface shiny. J'aimerai en faite modifier la couleur des onglets de mon interface ainis que la couleur de fond (background).
Je dispose d'un code UI et d'un code SERVER et en cherchant sur internet j'ai vu des codes CSS qui hélas ne fonctionnait pas. Par exemple avec le package shinyTheme il y a des thèmes corrects mais la couleur ne me convient pas. Aves vous des idées ?
merci d'avance,
Alexandre cavasino

Rémi Kerkour
Messages : 9
Enregistré le : 31 Mai 2018, 14:52

Re: changer de couleurs interface shiny

Messagepar Rémi Kerkour » 12 Juin 2018, 10:12

bonjour

as tu tester les solutions présentes ici:

https://stackoverflow.com/questions/317 ... -dashboard


+ peut tu nous donner ton code si cela ne fonctionne pas

alexandre cavasino
Messages : 34
Enregistré le : 13 Juin 2017, 08:14

Re: changer de couleurs interface shiny

Messagepar alexandre cavasino » 12 Juin 2018, 12:11

merci pour votre réponse seulement peut être que je n'écris pas au bon endroit mais cela ne change en rien la couleur des onglets ou de l'arrière plan :
Voici le début de mon code Shiny :

shinyUI(
fluidPage(

list(tags$head(HTML('<link rel="icon", href="Rstudio-Logo.png",
type="image/png" />'))),
div(style="padding: 1px 13px; width: '80%'",
titlePanel(
title="", windowTitle="Window Tab title"
)
),

navbarPage(title=div(img(src='img.png', height = 90 ,width = 110)),
inverse = F, # for diff color view
theme = shinytheme("journal"),



# 1 ER ONGLET :
tabPanel("Upload", icon = icon("upload"),
sidebarLayout( Etc......

Serge Rapenne
Messages : 1426
Enregistré le : 20 Aoû 2007, 15:17
Contact :

Re: changer de couleurs interface shiny

Messagepar Serge Rapenne » 12 Juin 2018, 13:57


alexandre cavasino
Messages : 34
Enregistré le : 13 Juin 2017, 08:14

Re: changer de couleurs interface shiny

Messagepar alexandre cavasino » 13 Juin 2018, 12:00

merci beaucoup :)
pour le fond il faut modifier la couleur sur body par exemple.
Mais si je veux changer la couleur des onglets comment puis-je faire sur mon fichier CSS ?

Serge Rapenne
Messages : 1426
Enregistré le : 20 Aoû 2007, 15:17
Contact :

Re: changer de couleurs interface shiny

Messagepar Serge Rapenne » 13 Juin 2018, 12:32

Qd tu dis "changer la couleur des onglets", c'est ça que tu veux ?

Code : Tout sélectionner

library(shiny)
ui <-shinyUI(fluidPage(
  h1("Colored Tabs"),
  tags$style(HTML("
    .tabbable > .nav > li > a                  {background-color: aqua;  color:black}
    .tabbable > .nav > li > a[data-value='t1'] {background-color: red;   color:white}
    .tabbable > .nav > li > a[data-value='t2'] {background-color: blue;  color:white}
    .tabbable > .nav > li > a[data-value='t3'] {background-color: green; color:white}
    .tabbable > .nav > li[class=active]    > a {background-color: black; color:white}
  ")),
  tabsetPanel(
    tabPanel("t0",h2("normal tab")),
    tabPanel("t1",h2("red tab")),
    tabPanel("t2",h2("blue tab")),
    tabPanel("t3",h2("green tab")),
    tabPanel("t4",h2("normal tab")),
    tabPanel("t5",h2("normal tab"))
  )
))
server <- function(input, output) {}
shinyApp(ui=ui,server=server)


Serge

alexandre cavasino
Messages : 34
Enregistré le : 13 Juin 2017, 08:14

Re: changer de couleurs interface shiny

Messagepar alexandre cavasino » 13 Juin 2018, 14:26

Serge, vous êtes mon sauveur.
Merci beaucoup :)
Bonne fin de journée à vous.

Mickael Canouil
Messages : 1315
Enregistré le : 04 Avr 2011, 08:53
Contact :

Re: changer de couleurs interface shiny

Messagepar Mickael Canouil » 13 Juin 2018, 15:21

Bonjour,

petite suggestion: utiliser le mode développeur (généralement via F12, ou clic droit "inspecter/examiner" l'élément) de votre navigateur dans lequel est ouvert votre application.
De cette façon, vous aurez accès au code HTML et aux feuilles de style css associés, vous donnant par la même le nom des balises HTML et des classes CSS impliquées.

PS: le mode développeur et aussi très pratique pour le web scraping ;)

Cordialement,
Mickaël
mickael.canouil.fr | rlille.fr


Retourner vers « Questions en cours »

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 1 invité