Tip: Interface patterns give you an opportunity to explore different interface designs. Be sure to check out How to Adapt a Pattern for Your Application.
Dynamically show a star rating based on a numeric score.
This example uses a familiar set of star icons to display an aggregated value taken from many previous rating. To see how to capture and display an individual rating, see the Set a Numeric Rating Using Rich Text Icons recipe.
This scenario demonstrates:
a!forEach()
within rich text.1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
a!localVariables(
local!score: 5.88,
local!limit: 10,
a!richTextDisplayField(
value: {
a!forEach(
items: enumerate(local!limit) + 1,
expression: a!richTextIcon(
color: "ACCENT",
icon: if(
fv!index <= local!score,
"star",
if(
fv!index - 1 < local!score,
"star-half-o",
"star-o"
)
)
)
)
}
)
)
local!limit
and click TEST to reload the interface.
local!score
and click TEST to reload the interface.
if()
statement, providing a different value than 1
when running the index comparison against local!score
.Show a Numeric Rating as Rich Text Icons