Como inserir 2 sidebars em uma página com flexdashboard?

Eu tentei inserir dois sidebars em uma mesma página (um do lado esquerdo - padrão - , e outro do lado direito). Exemplo:

Suponha este rmarkdown fictício:

---
title: "Curso R"
runtime: shiny
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
    vertical_layout: fill
    theme: yeti
---

```{r}
library(tidyverse)

df_1 <- data.frame(
  m = .01, 
  d = .02, 
  q = 1
)

dis_1 <- function(mc, desc, qtde) {
  ((((mc) / (mc - desc)) - 1) * qtde + qtde)
}

price <- dis_1(
  mc = df_1$m, 
  desc = df_1$d, 
  qtde = df_1$q
)
```

```{r}
library(flexdashboard)
library(shiny)
```

Dashboard
=================================

Sidebar1{.sidebar data-width=290}
--------------------------------

```{r}
sliderInput(
  inputId = 'm', label = 'Price 1', 
  value = 50, 
  min = 0, 
  max = 100, 
  step = 5
)

sliderInput(
  inputId = 'd', label = 'Price 2', 
  value = 25, 
  min = 0, 
  max = 100, 
  step = 5
)

numericInput(
  inputId = 'q', label = 'qtde', 
  value = 1500, step = 1
)
```

```{r}
reac_1 <- reactive({
  tibble(
    m = input$m, 
    d = input$d, 
    q = input$q
  )
})

pred_1 <- reactive({
  temp <- reac_1()
  dis_1(
  mc = temp$m, 
  desc = temp$d, 
  qtde = temp$q
 )
})
```

calculator1{}
----------------------

###
```{r}
renderValueBox(
  expr = valueBox(
    value = scales::number(x = round(x = pred_1(), digits = 2), 
                           big.mark = '.'), 
    color = 'lightgreen'
  ) 
)
```

Como colocar 2 sidebars (na esquerda - padrão - e na direita) dentro de Dashboard? Além disso, gostaria que o scroll do sidebar do lado direito ficasse à esquerda (o do lado esquerdo fica à direita por padrão).

No curso de dashboards que fiz, aprendi apenas a inserir o sidebar padrão, do lado esquerdo. É que como tenho vários botões, gostaria de criar dois sidebars para a página ficar mais elegante.

Eu suspeito que isso possa ser feito com CSS. Mas, como tenho pouca proeficiência nesta linguagem, não sei como fazer isso.

Edição após a resposta do Athos

Eu coloquei um novo exemplo com rmarkdown. Infelizmente precisaria fazer isso com flexdashboard, pois tudo que já tenho está escrito nele. E só preciso ajustar essa página com este layout (2 sidebars). Assim, o input Price 1 deveria ficar do lado esquerdo, enquanto que o input Price 2 e qtde deveriam ser passados para a direita da página (de acordo com a descrição que fiz acima).

Obrigado pela atenção.

1 curtida

Giovani, eu também não sei fazer sem apelar para um grande CSS! Mas no Shiny puro ficaria assim:

library(shiny)

ui <- shinyUI(fluidPage(

   titlePanel("Old Faithful Geyser Data"),

   fluidRow(
     column(2,
            sliderInput("bins",
                        "Number of bins:",
                        min = 1,
                        max = 50,
                        value = 30),
            style="overflow-x: scroll; overflow-y: scroll"),
     column(8,
            plotOutput("distPlot")),
     column(2,
            textInput("test", "Test"),
            style="overflow-x: scroll; overflow-y: scroll")
   )
))

server <- shinyServer(function(input, output) {

   output$distPlot <- renderPlot({
      x    <- faithful[, 2] 
      bins <- seq(min(x), max(x), length.out = input$bins + 1)

      hist(x, breaks = bins, col = 'darkgray', border = 'white')
   })
})

shinyApp(ui = ui, server = server)

No Shiny vc vai ganhar a versatilidade que está querendo, talvez seja hora =P.

Se precisar continuar no flexdashboard, dá um toque pq daí podemos ver como se faz no CSS.

fonte: https://stackoverflow.com/questions/37777302/one-main-panel-and-2-side-panels-in-shiny

2 curtidas