数值框是在仪表盘中突出显示简单值的好方法。例如，这是一个包含三个数值框的仪表盘行：
以下是您可以用来创建这些数值框的代码。请注意，我们在本示例中混合使用了 Python 和 R 单元来说明每种语言的语法。另请注意，我们假设变量 articles、comments 和 spam 是先前在文档中计算的。
## Row
```{python}
#| content: valuebox
#| title: "Articles per day"
#| icon: pencil
#| color: primary
dict(
value = articles
)
```
```{python}
#| content: valuebox
#| title: "Comments per day"
dict(
icon = "chat",
color = "primary",
value = comments
)
```
```{r}
#| content: valuebox
#| title: "Spam per day"
list(
icon = "trash",
color = "danger",
value = spam
)
```
您可以选择在 YAML 中或在单元格打印的 dict() 或 list()（分别适用于 Python 和 R）中指定数值框选项。当您希望图标或颜色根据值动态变化时，后一种语法很方便。
3.1 Icon and Color
数值框中使用的icon可以是 2,000 个可用的bootstrap icons中的任何一个。
color可以是任何 CSS 颜色值，但是有一些专为仪表盘调整的颜色别名，您可能会考虑默认使用：
| Color Alias | Default Theme Color(s) |
|---|---|
| primary | Blue |
| secondary | Gray |
| success | Green |
| info | Bright Blue |
| warning | Yellow/Orange |
| danger | Red |
| light | Light Gray |
| dark | Black |
虽然别名适用于所有themes，但它们对应的颜色有所不同。
3.2 Shiny
在 Shiny 交互式仪表盘中，您可以拥有根据应用程序状态动态更新的数值框。有关如何执行此操作的详细信息是特定于语言的：
使用 bslib::value_box() 函数以及从 bsicons 包中绘制的可选图标。例如：
```{r}
library(bslib)
library(bsicons)
value_box(
title = "Value",
value = textOutput("valuetext"),
showcase = bs_icon("music-note-beamed")
)
```
3.3 Markdown Syntax
您还可以使用纯 Markdown 创建数值框，在这种情况下，您通常会通过内联表达式包含该值。例如：
## Row
::: {.valuebox icon="pencil" color="blue"}
Articles per day
`{python} articles`
:::