A beautiful AdminLTE3 info box.
renderbs4InfoBox(expr, env = parent.frame(), quoted = FALSE)
bs4InfoBoxOutput(outputId, width = 4)
bs4InfoBox(
title,
value = NULL,
subtitle = NULL,
icon = shiny::icon("chart-bar"),
color = NULL,
width = 4,
href = NULL,
fill = FALSE,
gradient = FALSE,
elevation = NULL,
iconElevation = NULL,
tabName = NULL
)
infoBox(
title,
value = NULL,
subtitle = NULL,
icon = shiny::icon("chart-bar"),
color = NULL,
width = 4,
href = NULL,
fill = FALSE,
gradient = FALSE,
elevation = NULL,
iconElevation = NULL,
tabName = NULL
)
infoBoxOutput(outputId, width = 4)
renderInfoBox(expr, env = parent.frame(), quoted = FALSE)
An expression that returns a Shiny tag object, HTML()
,
or a list of such objects.
The parent environment for the reactive expression. By default,
this is the calling environment, the same as when defining an ordinary
non-reactive expression. If expr
is a quosure and quoted
is TRUE
,
then env
is ignored.
If it is TRUE
, then the quote()
ed value of expr
will be used when expr
is evaluated. If expr
is a quosure and you
would like to use its expression as a value for expr
, then you must set
quoted
to TRUE
.
Output variable name.
The width of the box, using the Bootstrap grid system. This is
used for row-based layouts. The overall width of a region is 12, so the
default width of 4 occupies 1/3 of that width. For column-based
layouts, use NULL
for the width; the width is set by the column that
contains the box.
Info box title.
The value to display in the box. Usually a number or short text.
Any extra UI element.
An icon tag, created by icon
.
A color for the box. Valid colors are defined as follows:
primary
: #007bff
.
secondary
: #6c757d
.
info
: #17a2b8
.
success
: #28a745
.
warning
: #ffc107
.
danger
: #dc3545
.
gray-dark
: #343a40
.
gray
: #adb5bd
.
white
: #fff
.
indigo
: #6610f2
.
lightblue
: #3c8dbc
.
navy
: #001f3f
.
purple
: #605ca8
.
fuchsia
: #f012be
.
pink
: #e83e8c
.
maroon
: #d81b60
.
orange
: #ff851b
.
lime
: #01ff70
.
teal
: #39cccc
.
olive
: #3d9970
.
An optional URL to link to.
If FALSE (the default), use a white background for the content, and the color argument for the background of the icon. If TRUE, use the color argument for the background of the content; the icon will use the same color with a slightly darkened background.
Whether to use gradient style for background color. Default to FALSE.
Box elevation.
Icon elevation compared to the main content (relief). 3 by default.
Optional: infoBox behaves like menuItem and may be used to navigate between multiple tabItem.
Other cards:
bs4CardLayout()
,
bs4SocialCard()
,
bs4TabCard()
,
bs4UserCard()
,
descriptionBlock()
,
renderbs4ValueBox()
if (interactive()) {
library(shiny)
library(bs4Dash)
shinyApp(
ui = dashboardPage(
header = dashboardHeader(),
sidebar = dashboardSidebar(
sidebarMenu(
menuItem(
text = "Item 1",
tabName = "tab1"
),
menuItem(
text = "Item 2",
tabName = "tab2"
)
)
),
controlbar = dashboardControlbar(),
footer = dashboardFooter(),
title = "test",
body = dashboardBody(
tabItems(
tabItem(
tabName = "tab1",
fluidRow(
infoBox(
title = "Messages",
value = 1410,
icon = icon("envelope"),
color = "orange",
fill = TRUE,
),
infoBox(
title = "Bookmarks",
color = "info",
value = 240,
icon = icon("bookmark"),
tabName = "tab2"
)
)
),
tabItem(
tabName = "tab2",
infoBox(
title = "Comments",
color = "indigo",
gradient = TRUE,
value = 41410,
subtitle = "A subtitle",
icon = icon("comments"),
tabName = "tab1"
)
)
)
)
),
server = function(input, output) {}
)
}