Status, cores e skins

Construindo dashboards com shinydashboard

Png Kee Seng

Researcher

Embelezando um restaurante

Personalizar o dashboard é como embelezar o restaurante
Dizem que primeiro comemos com os olhos
Um dashboard mais atraente melhora a experiência do usuário
Vamos focar em mudar as cores de alguns elementos

Um restaurante embelezado com comidas atraentes.

¹ Imagem de Freepik

Status no shinydashboard

Alguns objetos do shinydashboard têm a propriedade status
Esses status podem ser definidos via argumento status
```
<object>(status = <status>, ...)
```

Status em um shinydashboard

Status em notificationItems

Vamos adicionar dois avisos no cabeçalho
- Defina o alerta de compra como mensagem de sucesso
- Defina o alerta de venda como mensagem de perigo
O status padrão de notificationItem() é "success"

Status success e danger para notificationItem.

header <- dashboardHeader(
  ...
  dropdownMenu(type = "notifications",

       notificationItem("Sell alert",

       status = "danger"

       ),

       notificationItem("Buy alert",

       status = "success"

       )

))
...

Status em boxes

Deixar status em branco cria uma caixa sem cor
Defina status como "info"
Defina o título
Defina solidHeader = TRUE

...
body <- dashboardBody(...,
        box("Stock name",

        title="Stock name title",

        width = 6,

        status = "info",

        solidHeader = TRUE)),

...

Caixa com status info.

Caixa com status info e título.

Caixa com status info, título e preenchimento sólido.

Adicionando cor ao shinydashboard

Em alguns objetos do shinydashboard, dá para definir color
Suponha que o preço de close caiu 2% desde ontem
- Renderize valueBox() em vermelho para alertar Sally

Podemos colorir um valueBox().

...
body <- dashboardBody(...,

    valueBox("Close (%)", 
            "-2%", 
            width = 2,

            color = "red"

            ),

    ...)
...

Mais cores

Cores disponíveis no shinydashboard:

Cores disponíveis no shinydashboard.

Veja os status e cores com ?validStatuses e ?validColors

Skins em um shinydashboard

Há skins predefinidas no shinydashboard
Aplique definindo o argumento skin em dashboardPage()

dashboardPage(skin = <color>)

Estas são as possíveis cores

"blue" (padrão)
"black"
"purple"
"green"
"red"
"yellow"

Testando skins diferentes

Defina a cor como roxa para testar
Defina a cor como preta para comparar

ui <- dashboardPage(skin = "purple",
                    header, sidebar, body)

ui <- dashboardPage(skin = "black",
                    header, sidebar, body)

Skin roxa.

Skin preta

Vamos praticar!

Construindo dashboards com shinydashboard