Struct iced_native::Element

pub struct Element<'a, Message, Renderer> { /* fields omitted */ }

A generic Widget.

It is useful to build composable user interfaces that do not leak implementation details in their view logic.

If you have a built-in widget, you should be able to use Into<Element> to turn it into an Element.

Implementations

impl<'a, Message, Renderer> Element<'a, Message, Renderer> where
    Renderer: Renderer, 

pub fn new(
    widget: impl Widget<Message, Renderer> + 'a
) -> Element<'a, Message, Renderer>

Creates a new Element containing the given Widget.

pub fn map<F, B>(self, f: F) -> Element<'a, B, Renderer> where
    Message: 'static,
    Renderer: 'a,
    B: 'static,
    F: 'static + Fn(Message) -> B, 

Applies a transformation to the produced message of the Element.

This method is useful when you want to decouple different parts of your UI and make them composable.

Example

Imagine we want to use our counter. But instead of showing a single counter, we want to display many of them. We can reuse the Counter type as it is!

We use composition to model the state of our new application:

use counter::Counter;

struct ManyCounters {
    counters: Vec<Counter>,
}

We can store the state of multiple counters now. However, the messages we implemented before describe the user interactions of a single counter. Right now, we need to also identify which counter is receiving user interactions. Can we use composition again? Yes.

#[derive(Debug, Clone, Copy)]
pub enum Message {
    Counter(usize, counter::Message)
}

We compose the previous messages with the index of the counter producing them. Let’s implement our view logic now:

use iced_native::{Element, Row};
use iced_wgpu::Renderer;

impl ManyCounters {
    pub fn view(&mut self) -> Row<Message, Renderer> {
        // We can quickly populate a `Row` by folding over our counters
        self.counters.iter_mut().enumerate().fold(
            Row::new().spacing(20),
            |row, (index, counter)| {
                // We display the counter
                let element: Element<counter::Message, Renderer> =
                    counter.view().into();

                row.push(
                    // Here we turn our `Element<counter::Message>` into
                    // an `Element<Message>` by combining the `index` and the
                    // message of the `element`.
                    element.map(move |message| Message::Counter(index, message))
                )
            }
        )
    }
}

Finally, our update logic is pretty straightforward: simple delegation.

impl ManyCounters {
    pub fn update(&mut self, message: Message) {
        match message {
            Message::Counter(index, counter_msg) => {
                if let Some(counter) = self.counters.get_mut(index) {
                    counter.update(counter_msg);
                }
            }
        }
    }
}

pub fn explain<C: Into<Color>>(self, color: C) -> Element<'a, Message, Renderer> where
    Message: 'static,
    Renderer: 'a + Debugger, 

Marks the Element as to-be-explained.

The Renderer will explain the layout of the Element graphically. This can be very useful for debugging your layout!

pub fn width(&self) -> Length

Returns the width of the Element.

pub fn height(&self) -> Length

Returns the height of the Element.

pub fn layout(&self, renderer: &Renderer, limits: &Limits) -> Node

Computes the layout of the Element in the given Limits.

pub fn on_event(
    &mut self,
    event: Event,
    layout: Layout<'_>,
    cursor_position: Point,
    renderer: &Renderer,
    clipboard: &mut dyn Clipboard,
    messages: &mut Vec<Message>
) -> Status

Processes a runtime Event.

pub fn draw(
    &self,
    renderer: &mut Renderer,
    defaults: &Renderer::Defaults,
    layout: Layout<'_>,
    cursor_position: Point,
    viewport: &Rectangle
) -> Renderer::Output

Draws the Element and its children using the given Layout.

pub fn hash_layout(&self, state: &mut Hasher)

Computes the layout hash of the Element.

pub fn overlay<'b>(
    &'b mut self,
    layout: Layout<'_>
) -> Option<Element<'b, Message, Renderer>>

Returns the overlay of the Element, if there is any.

Trait Implementations

impl<'a, Message, Renderer> From<Button<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Message: 'a + Clone,
    Renderer: 'a + Renderer, 

fn from(button: Button<'a, Message, Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Checkbox<Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer + Renderer + Renderer,
    Message: 'a, 

fn from(checkbox: Checkbox<Message, Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Column<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(column: Column<'a, Message, Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Container<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(
    column: Container<'a, Message, Renderer>
) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Image> for Element<'a, Message, Renderer> where
    Renderer: Renderer, 

fn from(image: Image) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<PaneGrid<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer + Renderer,
    Message: 'a, 

fn from(
    pane_grid: PaneGrid<'a, Message, Renderer>
) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<ProgressBar<Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(progress_bar: ProgressBar<Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Radio<Message, Renderer>> for Element<'a, Message, Renderer> where
    Message: 'a + Clone,
    Renderer: 'a + Renderer + Renderer + Renderer, 

fn from(radio: Radio<Message, Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Row<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(row: Row<'a, Message, Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Rule<Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(rule: Rule<Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Scrollable<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(
    scrollable: Scrollable<'a, Message, Renderer>
) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, T, Message, Renderer> From<Slider<'a, T, Message, Renderer>> for Element<'a, Message, Renderer> where
    T: 'a + Copy + Into<f64> + FromPrimitive,
    Message: 'a + Clone,
    Renderer: 'a + Renderer, 

fn from(
    slider: Slider<'a, T, Message, Renderer>
) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Space> for Element<'a, Message, Renderer> where
    Renderer: Renderer,
    Message: 'a, 

fn from(space: Space) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Svg> for Element<'a, Message, Renderer> where
    Renderer: Renderer, 

fn from(icon: Svg) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Text<Renderer>> for Element<'a, Message, Renderer> where
    Renderer: Renderer + 'a, 

fn from(text: Text<Renderer>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<TextInput<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Message: 'a + Clone,
    Renderer: 'a + Renderer, 

fn from(
    text_input: TextInput<'a, Message, Renderer>
) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Tooltip<'a, Message, Renderer>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer,
    Message: 'a, 

fn from(
    column: Tooltip<'a, Message, Renderer>
) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, Message, Renderer> From<Viewer<'a>> for Element<'a, Message, Renderer> where
    Renderer: 'a + Renderer + Renderer,
    Message: 'a, 

fn from(viewer: Viewer<'a>) -> Element<'a, Message, Renderer>

Performs the conversion.

impl<'a, T: 'a, Message, Renderer> Into<Element<'a, Message, Renderer>> for PickList<'a, T, Message, Renderer> where
    T: Clone + ToString + Eq,
    [T]: ToOwned<Owned = Vec<T>>,
    Renderer: Renderer + 'a,
    Message: 'static, 

fn into(self) -> Element<'a, Message, Renderer>

Performs the conversion.