Skip to contents

Create a tab panel

Source: R/bootstrap.R
tabPanel.Rd

Create a tab panel

Usage

tabPanel(title, ..., value = title, icon = NULL)

tabPanelBody(value, ..., icon = NULL)

Arguments

title

Display title for tab

...

UI elements to include within the tab

value

The value that should be sent when tabsetPanel reports that this tab is selected. If omitted and tabsetPanel has an id, then the title will be used.

icon

Optional icon to appear on the tab. This attribute is only valid when using a tabPanel within a navbarPage().

Value

A tab that can be passed to tabsetPanel()

Functions

  • tabPanel(): Create a tab panel that can be included within a tabsetPanel() or a navbarPage().

  • tabPanelBody(): Create a tab panel that drops the title argument. This function should be used within tabsetPanel(type = "hidden"). See tabsetPanel() for example usage.

See also

tabsetPanel()

Examples

# Show a tabset that includes a plot, summary, and
# table view of the generated distribution
mainPanel(
  tabsetPanel(
    tabPanel("Plot", plotOutput("plot")),
    tabPanel("Summary", verbatimTextOutput("summary")),
    tabPanel("Table", tableOutput("table"))
  )
)
#> <div class="col-sm-8" role="main">
#>   <div class="tabbable">
#>     <ul class="nav nav-tabs" data-tabsetid="2032">
#>       <li class="active">
#>         <a href="#tab-2032-1" data-toggle="tab" data-bs-toggle="tab" data-value="Plot">Plot</a>
#>       </li>
#>       <li>
#>         <a href="#tab-2032-2" data-toggle="tab" data-bs-toggle="tab" data-value="Summary">Summary</a>
#>       </li>
#>       <li>
#>         <a href="#tab-2032-3" data-toggle="tab" data-bs-toggle="tab" data-value="Table">Table</a>
#>       </li>
#>     </ul>
#>     <div class="tab-content" data-tabsetid="2032">
#>       <div class="tab-pane active" data-value="Plot" id="tab-2032-1">
#>         <div class="shiny-plot-output html-fill-item" id="plot" style="width:100%;height:400px;"></div>
#>       </div>
#>       <div class="tab-pane" data-value="Summary" id="tab-2032-2">
#>         <pre class="shiny-text-output noplaceholder" id="summary"></pre>
#>       </div>
#>       <div class="tab-pane" data-value="Table" id="tab-2032-3">
#>         <div id="table" class="shiny-html-output shiny-table-output"></div>
#>       </div>
#>     </div>
#>   </div>
#> </div>