闪亮的 navbarPage 与 fluidRow 相结合

Question

我在设置闪亮应用的布局时遇到了一些问题。在尝试了几个不同的选项之后，最适合我的是 navbarPage。虽然，我设法解决了我的大部分问题（在 Whosebug 的帮助下），但我陷入了困境。基本上，我有一个 table 有很多列，它最终总是比包含 table.

的 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)

当您运行代码时，您将看到当前布局。如果不是那个巨大的宽度，一切都会很好 table 3 其中一半总是在 wellPanel 之外。

我的问题是，是否可以将 wellPanel 向左扩展，使其占据布局的整个宽度？

非常感谢任何指点。干杯

Answer 1

fluidRow 和 column 函数在 wellPanel/mainPanel 中不做任何事情 - 您想要将这个特定的 wellPanel 作为它自己的 fluidRow 与侧边栏布局分开。

此外，如果您的 table 是在 DT 包中制作的，您可以将 scrollX=TRUE 添加到渲染选项，以便在 table 太高时添加滚动条大适合。

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"

)

闪亮的 navbarPage 与 fluidRow 相结合

Shiny navbarPage combined with fluidRow

r

fluid

shiny