Rich text

In plain words

A sentence where some words are bold, colored or links.

Combines pz.span(text, color=, size=, font=, weight=, italic=, bg=, underline=, strikethrough=, link=) fragments into a single block of text that wraps as a whole. Clicking a span with link sends that value.

pz.rich_text · Category: Content · Full reference →

Preview

Code

pz.rich_text([
    pz.span("rich_text "),
    pz.span("mixes ", color="#e5c07b"),
    pz.span("styles", weight="bold", underline=True),
    pz.span(" on one line, with "),
    pz.span(" code ", font="IBM Plex Mono", bg="#3b414d", radius=4),
    pz.span(" and "),
    pz.span("links", color="#74ade8", underline=True, link="https://iced.rs"),
], size=18, width=460)

When to use

• For inline highlights, mentions, search matches and short formatted messages.

Usage

import pyzed as pz

pz.rich_text([
    pz.span("rich_text "),
    pz.span("mixes ", color="#e5c07b"),
    pz.span("styles", weight="bold", underline=True),
    pz.span(" on one line, with "),
    pz.span(" code ", font="IBM Plex Mono", bg="#3b414d", radius=4),
    pz.span(" and "),
    pz.span("links", color="#74ade8", underline=True, link="https://iced.rs"),
], size=18, width=460)

Variants

About these captures

Each capture is recorded by pyzed itself, off-screen at 2x, in Pyzed Dark or Pyzed Light to match this site’s theme, and cropped to the component so it shows at its real size. The pointer hovers, presses or types into it; a component that does not react to the pointer cycles through a few themes. With reduced motion you see the first frame. Open Code under a capture to see the snippet that draws it; free names such as on_save stand for your own callbacks.

Span styles

weight="bold"

Code

pz.rich_text([pz.span("Some "), pz.span("bold", weight="bold"), pz.span(" text")], size=16)

italic=True

Code

pz.rich_text([pz.span("Some "), pz.span("italic", italic=True), pz.span(" text")], size=16)

color=

Code

pz.rich_text([pz.span("Some "), pz.span("colored", color="#e5c07b"), pz.span(" text")], size=16)

underline=True

Code

pz.rich_text([pz.span("Some "), pz.span("underlined", underline=True), pz.span(" text")], size=16)

strikethrough=True

Code

pz.rich_text([pz.span("Some "), pz.span("struck", strikethrough=True), pz.span(" text")], size=16)

bg=, radius=

Code

pz.rich_text([pz.span("Run "), pz.span(" pyzed new ", font="mono", bg="#3b414d", color="#e6e6e6", radius=4)], size=16)

link=

Code

pz.rich_text([pz.span("Read "), pz.span("the docs", color="#74ade8", underline=True, link="https://iced.rs")], size=16)

size=

Code

pz.rich_text([pz.span("small ", size=12), pz.span("big", size=24, weight="bold")])

Events

Rich text has no events of its own: it shows what you give it. Like every widget it also has the 18 common events (click, double_click, right_click, mouse_enter, drag, key_down, resize…), attached with .on(...): see Events and Events of every component.

Properties and API

pz.rich_text

rich_text(
    spans,
    *,
    size=None,
    color=None,
    font=None,
    line_height=None,
    width=None,
    align_x=None,
    wrap=True,
)

Text made of spans with different styles. Plain strings are unstyled spans.

Property	Default	Description
spans	required	List of span(...) or strings.
size	None	Size.
color	None	Text or icon color.
font	None	Font of the span or text (family name, e.g. "IBM Plex Mono").
line_height	None	Line height.
width	None	Width: pixels, "fill", "shrink" or "fill:N" (proportion).
align_x	None	Horizontal alignment: "start"/"left", "center", "end"/"right".
wrap	True	Line wrapping / moves children to a new row when they don’t fit.

Full reference →

pz.span

span(
    text,
    *,
    color=None,
    size=None,
    font=None,
    weight=None,
    italic=False,
    bg=None,
    radius=0.0,
    padding=None,
    underline=False,
    strikethrough=False,
    link=None,
)

A styled span for rich_text. With link, clicking it sends (or calls) that value.

Property	Default	Description
text	required	The text.
color	None	Text or icon color.
size	None	Size.
font	None	Font of the span or text (family name, e.g. "IBM Plex Mono").
weight	None	Font weight: "normal", "medium", "semibold" or "bold".
italic	False	If True, the span is drawn in italics.
bg	None	Background color ("#rrggbb[aa]", (r, g, b[, a]) or "transparent").
radius	0.0	Background radius.
padding	None	Inner padding: 8, (vertical, horizontal) or (top, right, bottom, left).
underline	False	Underline.
strikethrough	False	Strikethrough.
link	None	Message or callable on click.

Full reference →

Related

TextA piece of text with size, color, font and weight.

MarkdownRenders Markdown with the theme's colors.