Iced: How to draw a simple rectangle?

Does anyone know the crate iced?

So I am over here and I want to generate a simple rectangle.

use iced::*;

fn main()
{
    loop
    {
        Rectangle::new(Point{x: 10., y: 20.}, Size::new(10., 20.));
    }
    
}

This is my code and I can't seem to draw a rectangle.

like inside the loop it does nothing I don't see any rectangle.

You're not actually creating or running an iced application anywhere in this code, you're just looping infinitely. Also, I don't think Rectangle is a thing you can draw directly - it's just a data type, like Point.

I don't know enough about iced to tell you how to actually draw a rectangle, but I would recommend reading the docs and looking at the examples to understand the structure of an iced application.

Edit: It looks like the way you do primitive shape drawing in iced is via the Canvas widget and the Program trait.

2 Likes

Didn’t know iced myself either, but I gave it a go (with different rectangle sizes than what you’ve had)

use iced::{
    canvas::{Frame, Path, Program, Stroke},
    Canvas, Length, Point, Rectangle, Sandbox, Settings, Size,
};

fn main() -> Result<(), iced::Error> {
    RectangleApp::run(Settings::default())
}

struct RectangleApp;

impl Sandbox for RectangleApp {
    type Message = ();

    fn new() -> Self {
        Self
    }

    fn title(&self) -> String {
        "My simple rectangle".into()
    }

    fn update(&mut self, _: ()) {}

    fn view(&mut self) -> iced::Element<'_, Self::Message> {
        Canvas::new(RectangleProgram)
            .width(Length::Fill)
            .height(Length::Fill)
            .into()
    }
}

struct RectangleProgram;

impl Program<()> for RectangleProgram {
    fn draw(&self, bounds: Rectangle, _: iced::canvas::Cursor) -> Vec<iced::canvas::Geometry> {
        let mut frame = Frame::new(bounds.size());
        frame.stroke(
            &Path::rectangle(
                Point {
                    x: bounds.width / 10.,
                    y: bounds.height / 10.,
                },
                Size {
                    width: 4. * bounds.width / 5.,
                    height: 4. * bounds.height / 5.,
                },
            ),
            Stroke::default(),
        );
        vec![frame.into_geometry()]
    }
}
1 Like

Thanks mate :slight_smile:

hey mate, just curious isn't there a simple hello world example so I can start minimal?

There's a hello world in the docs: https://docs.rs/iced/0.3.0/iced/trait.Sandbox.html#a-simple-hello-world.

1 Like

Thanks mate.

After looking at your link I got a question.

use iced::{Element, Sandbox, Settings, Text};

pub fn main() -> iced::Result {
    Hello::run(Settings::default())
}

struct Hello;

impl Sandbox for Hello {
    type Message = ();

    fn new() -> Hello {
        Hello
    }

    fn title(&self) -> String {
        String::from("A cool application")
    }

    fn update(&mut self, _message: Self::Message) {
        // This application has no interactions
    }

    fn view(&mut self) -> Element<Self::Message> {
        Text::new("Hello, world!").into()
    }
}

What is impl Sandbox for Hello {? Like what does Sandbox mean, is this some random name iced uses, or is this specific to a Rust name? Can it be named anything?

It’s the name of the trait that is being implemented here. (You can also see it being imported on the top in the use declaration.) Take a look around on the page with the hello-world example that I linked to, it’s actually the documentation of that very trait “iced::Sandbox:wink:

If you want to learn more about the basics of Rust like this, I can recommend the book for a beginning. It also has a chapter on traits.

1 Like

Also, if reading the docs for a crate, reading the docs for standard library, the Rust book, etc, If in your browser you type "S" to search and type the word you want to understand, you will be presented links to docs with that word in it.

https://docs.rs/iced/0.3.0/iced/?search=sandbox

1 Like