Module freya::_docs::elements

Elements

This is an overview of the elements supported in Freya.

For more info check the API Reference.

rect

rect is a generic element that acts as a container for other elements.

You can specify things like width, padding or even in what direction the inner elements are stacked.

Example:

fn app() -> Element {
    rsx!(
        rect {
            direction: "vertical",
            label { "Hi!" }
        }
    )
}

label

label simply let’s you display some text.

Example:

fn app() -> Element {
    rsx!(
        label {
            "Hello World"
        }
    )
}

paragraph

paragraph element let’s you build texts with different styles.

This used used with the text element.

Example:

fn app() -> Element {
    rsx!(
        paragraph {
            text {
                font_size: "15",
                "Hello, "
            }
            text {
                font_size: "30",
                "World!"
            }
        }
    )
}

image

image element let’s you show an image.

Example:

static RUST_LOGO: &[u8] = include_bytes!("./rust_logo.png");

fn app() -> Element {
    let image_data = static_bytes(RUST_LOGO);
    rsx!(image {
        image_data: image_data,
        width: "100%",
        height: "100%",
    })
}

svg

svg element let’s you display an SVG.

Example:

static FERRIS: &[u8] = include_bytes!("./ferris.svg");

fn app() -> Element {
    let ferris = static_bytes(FERRIS);
    rsx!(svg {
        svg_data: ferris,
        width: "100%",
        height: "100%",
    })
}