Module zng::icon

source ·
Expand description

Icons service, icon font widget and other types.

§Service

The ICONS service bridges icon providers and icon users. Icon theme providers can register handlers that provide a node that renders the icon identified by name. Widget styles or other UI only need to request the icon, avoiding having to embed icon resources in lib crates and avoiding icons having a fixed appearance.

use zng::{prelude::*, icon, widget::node::NilUiNode};

icon::ICONS.register(wgt_fn!(|a: icon::IconRequestArgs| {
    match a.name() {
        "accessibility" => Text!("A").boxed(),
        "settings" => Text!("S").boxed(),
        _ => NilUiNode.boxed()
    }
}));

The example above registers a handler that provides two “icons” that are rendered by a Text! widgets.

§Widget

The Icon! widget renders icons using an icon font, it allows setting the font and icon in a single value and can auto size the font size, this makes it a better alternative to just using the Text! widget.

use zng::{prelude::*, icon};

icon::Icon! {
    ico = icon::material::rounded::req("accessibility");
    ico_size = 80;
}

You can implement your own icon sets by providing GlyphIcon instances or a type that converts to GlyphIcon. Glyph icons define a font name and a GlyphSource that can be a char or a ligature text.

use zng::{prelude::*, icon, font};

let font = font::CustomFont::from_file(
    "Font Awesome 6 Free-Regular",
    r#"Font Awesome 6 Free-Regular-400.otf"#,
    0,
);
font::FONTS.register(font).wait_into_rsp().await.unwrap();

icon::Icon! {
    ico = icon::GlyphIcon::new("Font Awesome 6 Free-Regular", "address-book").with_ligatures();
    ico_size = 80;
}

The example above loads an icon font and display one of the icons selected using a ligature that matches "address-book".

§Full API

See zng_wgt_text::icon for the full widget API.

Modules§

Structs§

Enums§

Traits§

Functions§