记录一下bs4Dash各个控件的效果，方便查找和对照。
案例均来自于官方文档。
accordion(
id = "accordion1",
accordionItem(
title = "Accordion 1 Item 1",
status = "danger",
collapsed = F,
"This is some text!"
)
)
popover(
actionButton("goButton", "Click me to see the popover!"),
title = "My popover",
placement = "right",
content = "Vivamus sagittis lacus vel augue laoreet rutrum faucibus."
)
tooltip(
actionButton("goButton", "Hover to see the tooltip"),
title = "My tooltip",
placement = "top"
)
appButton(
inputId = "myAppButton",
label = "Users",
icon = icon("users"),
color = "orange",
dashboardBadge(textOutput("btnVal"), color = "primary")
)
attachmentBlock(
image = "https://adminlte.io/themes/v3/dist/img/user1-128x128.jpg",
title = "Test",
href = "https://google.com",
"This is the content"
)
fluidRow(
blockQuote("Blablabla", color = "indigo"),
blockQuote("Blablabla", color = "danger"),
blockQuote("Blablabla", color = "teal"),
blockQuote("Blablabla", color = "orange"),
blockQuote("Blablabla", color = "warning"),
blockQuote("Blablabla", color = "fuchsia")
)
boxComment(
image = "https://adminlte.io/themes/AdminLTE/dist/img/user3-128x128.jpg",
title = paste("Comment", i),
date = "01.05.2018",
paste0("The ", i, "-th comment")
)
boxPad(
color = "purple",
descriptionBlock(
header = "8390",
text = "VISITS",
rightBorder = FALSE,
marginBottom = TRUE
)
)
boxProfile(
image = "https://adminlte.io/themes/AdminLTE/dist/img/user4-128x128.jpg",
title = "Nina Mcintire",
subtitle = "Software Engineer",
bordered = TRUE,
boxProfileItem(
title = "Followers",
description = 1322
),
boxProfileItem(
title = "Following",
description = 543
),
boxProfileItem(
title = "Friends",
description = 13287
)
)
box(
title = "Update box sidebar",
closable = TRUE,
width = 12,
height = "500px",
solidHeader = FALSE,
collapsible = TRUE,
actionButton("update", "Toggle card sidebar"),
sidebar = boxSidebar(
id = "mycardsidebar",
p("Sidebar Content")
)
)
dashboardBadge("Badge 1", color = "danger"),
actionButton(
inputId = "badge",
label = "Hello",
icon = NULL,
width = NULL,
dashboardBadge(1, color = "primary")
)
callout(
title = "I am a danger callout!",
elevation = 4,
status = "danger",
"There is a problem that we need to fix.
A wonderful serenity has taken possession of
my entire soul, like these sweet mornings of
spring which I enjoy with my whole heart."
)
carousel(
id = "mycarousel",
carouselItem(
caption = "Item 1",
tags$img(src = "https://pic2.zhimg.com/v2-5141def5f12716555c28270a8d2fa567_b.jpg")
),
carouselItem(
caption = "Item 2",
tags$img(src = "https://p.qqan.com/up/2020-11/16061230758938414.jpg")
)
)
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"
)
)
jumbotron(
title = "Hello, world!",
lead = "This is a simple hero unit, a simple jumbotron-style
component for calling extra attention to featured
content or information.",
"It uses utility classes for typography and spacing
to space content out within the larger container.",
status = "info",
href = "https://www.google.com"
)
listGroup(
type = "action",
listGroupItem(
"Cras justo odio",
active = TRUE,
disabled = FALSE,
href = "https://www.google.com"
),
listGroupItem(
active = FALSE,
disabled = FALSE,
"Dapibus ac facilisis in",
href = "https://www.google.com"
),
listGroupItem(
"Morbi leo risus",
active = FALSE,
disabled = TRUE,
href = "https://www.google.com"
)
)
box(
title = "loading spinner",
loadingState()
)
box(
title = "Horizontal",
progressBar(
value = 10,
striped = TRUE,
animated = TRUE
),
progressBar(
value = 50,
status = "warning",
size = "xs"
),
progressBar(
value = 20,
status = "danger",
size = "sm"
),
multiProgressBar(
value = c(50, 20),
status = c("warning", "danger"),
size = "sm"
)
)
box(
width = 4,
title = "Blue ribbon",
bs4Ribbon(
text = "New",
color = "primary"
)
socialBox(
title = userBlock(
image = "https://adminlte.io/themes/AdminLTE/dist/img/user4-128x128.jpg",
title = "Social Box",
subtitle = "example-01.05.2018"
),
"Some text here!",
attachmentBlock(
image = "https://adminlte.io/themes/v3/dist/img/user1-128x128.jpg",
title = "Test",
href = "https://google.com",
"This is the content"
)
box(
title = "Star example",
starBlock(5),
starBlock(5, color = "fuchsia"),
starBlock(1, color = "danger"),
starBlock(3, color = "secondary")
)
tabBox(
id = "tabcard",
title = "A card with tabs",
selected = "Tab 2",
status = "primary",
solidHeader = F,
type = "tabs",
tabPanel(
title = "Tab 1",
"Content 1"
),
tabPanel(
title = "Tab 2",
"Content 2"
)
)
box(
title = "Timeline",
timelineBlock(
width = 12,
reversed = TRUE,
timelineEnd(color = "danger"),
timelineLabel("10 Feb. 2014", color = "pink"),
timelineItem(
elevation = 4,
title = "Item 1",
icon = icon("gears"),
color = "olive",
time = "now",
footer = "Here is the footer",
"This is the body"
),
timelineItem(
title = "Item 2",
border = FALSE
)
userBox(
title = userDescription(
title = "Nadia Carmichael",
subtitle = "lead Developer",
type = 2,
image = "https://adminlte.io/themes/AdminLTE/dist/img/user7-128x128.jpg",
),
status = "primary",
gradient = TRUE,
background = "primary",
boxToolSize = "xl",
"Some text here!",
footer = "The footer here!"
)
dashboardUser(
name = "Divad Nojnarg",
image = "https://adminlte.io/themes/AdminLTE/dist/img/user2-160x160.jpg",
title = "shinydashboardPlus",
subtitle = "Author",
footer = p("The footer", class = "text-center"),
fluidRow(
dashboardUserItem(
width = 6,
"Item 1"
),
dashboardUserItem(
width = 6,
"Item 2"
)
)
)
valueBox(
value = 150,
subtitle = "New orders",
color = "primary",
icon = icon("shopping-cart")
)
productList(
productListItem(
image = "https://www.pngmart.com/files/1/Haier-TV-PNG.png",
title = "Samsung TV",
subtitle = "$1800",
color = "warning",
"This is an amazing TV, but I don't like TV!"
)
ionicon(name ="heart"),
ionicon(name ="beer")
