Блестящий navbarPage в сочетании с FluidRow

Question

У меня возникли проблемы с настройкой макета моего блестящего приложения. После того, как я попробовал несколько разных вариантов, лучшим вариантом для меня стал navbarPage. Хотя мне удалось решить большинство моих проблем (с помощью stackoverflow), я застрял в одной. По сути, у меня есть таблица, которая имеет много столбцов, и она всегда оказывается больше, чем wellPanel, который содержит таблицу.

Ниже приведен код, иллюстрирующий проблему:

require(shiny)
require(shinythemes)

side_width <- 5

sidebar_panel <-
  sidebarPanel(
    width = side_width,
    radioButtons("Radio1",
                 label = h4("Radio label 1"),
                 choices = list("Europe" = "EU", 
                                "USA" = "US"), 
                               selected = "EU"),
hr()
br()

    radioButtons("Radio 2", 
                 label = h4("Radio label 2"),
                 choices = list("Annual" = 1, "Monthly" = 12), 
                             selected = 1)

  )

main_panel <- mainPanel(
    width = 12 - side_width,


                     wellPanel(

                     h5(helpText("Figure 1: ..."))
                               ), 

                     wellPanel(
                       h5(helpText("Table 1: ..."))
                              ),

                     wellPanel(
                       h5(helpText("Table 2: ..."))
                               ),

                     wellPanel(
                              fluidRow(
                              column(12,

                                h5(helpText("Table 3: ..."))
                                    )
                                 )

                       )
)

# user interface
ui <- shiny::navbarPage("testing shiny", 

  tabPanel("Tab1",
    sidebarLayout(
    sidebarPanel = sidebar_panel,
    mainPanel = main_panel,
    position = "left")
           ),

  tabPanel("Tab2",
    verbatimTextOutput("summary")
            ),

  tags$style(type="text/css", "body {padding-top: 70px;}"),
  theme=shinytheme("cosmo"),
  position ="fixed-top"

)

server <- function(input, output) {

}

shinyApp(ui = ui, server = server)

Когда выЗапустите код, вы увидите текущий макет. Все было бы хорошо, если бы не эта широкая широкая таблица 3. Половина ее всегда находилась вне лунной панели.

Мой вопрос: можно ли расширить лунную панель влево, чтобы она занимала всюширина макета?

Любые указатели высоко ценятся. Ура

Answer 1

Функции liquidRow и столбца ничего не делают внутри wellPanel / mainPanel - вы хотите поместить этот конкретный wellPanel в качестве его собственного LiquidRow отдельно от макета боковой панели.

Кроме того, если ваша таблица создается в пакете DT, вы можете добавить scrollX = TRUE к параметрам рендеринга, чтобы она добавила полосу прокрутки, если таблица слишком велика, чтобы уместиться.

require(shiny)
require(shinythemes)

side_width <- 5

# user interface
ui <- navbarPage(
  "testing shiny",
  tabPanel("Tab1",
    sidebarLayout(position = "left",
      sidebarPanel(width = side_width,
        radioButtons("Radio1",
          label = h4("Radio label 1"),
          choices = list("Europe" = "EU",
                         "USA" = "US"),
          selected = "EU"),
        hr(),
        br(),
        radioButtons("Radio 2",
          label = h4("Radio label 2"),
          choices = list("Annual" = 1, "Monthly" = 12),
          selected = 1)),
      mainPanel(
        width = 12 - side_width,
        wellPanel(
          h5(helpText("Figure 1: ..."))
        ),        
        wellPanel(
          h5(helpText("Table 1: ..."))
        ),
        wellPanel(
          h5(helpText("Table 2: ..."))
        )
      )
    ),
    fluidRow(
        column(12,
            wellPanel(
               h5(helpText("Table 3: ..."))
            )
        )
    )
  ),

  tabPanel("Tab2",
           verbatimTextOutput("summary")),

  tags$style(type = "text/css", "body {padding-top: 70px;}"),
  theme = shinytheme("cosmo"),
  position = "fixed-top"

)