为闪亮仪表板标签框添加标题答案

【问题标题】：Add caption to shinydashboard tabBox为闪亮仪表板标签框添加标题
【发布时间】：2021-01-16 12:05:42
【问题描述】：

我希望在闪亮仪表板标签框下方添加一行 HTML 文本。下面的脚本将文本添加到下一列的顶部。

如何在 tabBox 正下方添加一行 HTML 文本。它类似于标题。

library("shiny")
library("shinydashboard")

shinyApp(
  ui = dashboardPage(
    dashboardHeader(disable = TRUE),
    dashboardSidebar(width = 0),

    body <- dashboardBody(
      fluidRow(
        tabBox(
          id = "tabset1", height = "250px",
          tabPanel("Tab1", "First tab content"),
          tabPanel("Tab2", "Tab content 2")
        ),
        htmlOutput("last_updated")
      )
    )
  ),
  server = function(input, output) {
    # The currently selected tab from the first box
    output$tabset1Selected <- renderText({
      input$tabset1
    })
    
    output$last_updated <- renderText({
      paste("<font size='1px;'>Place this caption beneath the tab box</font>") 
    })
  }
)

【问题讨论】：

标签： r shiny shinydashboard

【解决方案1】：

一种选择是创建一个新的fluidRow。

library(shiny)
library(shinydashboard)

shinyApp(
  ui = dashboardPage(
    dashboardHeader(disable = TRUE),
    dashboardSidebar(width = 0),
    
    body <- dashboardBody(
      fluidRow(
        tabBox(
          id = "tabset1", height = "250px",
          tabPanel("Tab1", "First tab content"),
          tabPanel("Tab2", "Tab content 2")
        ),
      ),
      fluidRow(htmlOutput("last_updated"))
    )
  ),
  server = function(input, output) {
    # The currently selected tab from the first box
    output$tabset1Selected <- renderText({
      input$tabset1
    })
    
    output$last_updated <- renderText({
      paste("<font size='1px;'>&ensp;&ensp;&ensp;Place this caption beneath the tab box</font></p>") 
    })
  }
)

【讨论】：

【解决方案2】：

使用弹性框：

library("shiny")
library("shinydashboard")

shinyApp(
  ui = dashboardPage(
    dashboardHeader(disable = TRUE),
    dashboardSidebar(width = 0),
    
    body <- dashboardBody(
      div(
        style = "display: flex; flex-direction: column;",
        tabBox(
          id = "tabset1", height = "250px",
          tabPanel("Tab1", "First tab content"),
          tabPanel("Tab2", "Tab content 2")
        ),
        htmlOutput("last_updated")
      )
    )
  ),
  server = function(input, output) {
    # The currently selected tab from the first box
    output$tabset1Selected <- renderText({
      input$tabset1
    })
    
    output$last_updated <- renderText({
      paste("<font size='1px;'>Place this caption beneath the tab box</font>") 
    })
  }
)

【讨论】：