iced-rs/iced_aw

Additional widgets for the Iced GUI library

Iced - Additional Widgets

This crate contains additional widgets for the GUI library Iced.

Every widget is hidden by a feature gate. This allows you to cherry pick the widgets you actually need.

Usage:

Include iced_aw as a dependency in your Cargo.toml:

[dependencies]
iced = "0.12.0"
iced_aw = { version = "0.9.3", default-features = false, features = [...] }

Versioning

iced version	iced_aw version
0.8	0.4
0.9	0.5
0.10	0.6, 0.7
0.12	0.8, 0.9

Widgets

Badge

Please take a look into our examples on how to use badges.

Enable this widget with the feature badge.

Card

Please take a look into our examples on how to use cards.

Enable this widget with the feature card.

Color Picker

Please take a look into our examples on how to use color pickers.

Enable this widget with the feature color_picker.

Date Picker

Please take a look into our examples on how to use date pickers.

Enable this widget with the feature date_picker.

Floating Action Button

Please take a look into our examples on how to use floating elements.

Enable this widget with the feature floating_element. This will be depreciated in the next Release in palce of using the stack widget

Modal

Modals are useful for showing some content as an overlay on top. In combination with the Card widget, modals can be used to create some kind of dialog panels.

Please take a look into our examples on how to use modals.

Enable this widget with the feature modal. This will be depreciated in the next Release in palce of using the stack widget

NumberInput

Just like TextInput, but only for numbers.

Please take a look into our examples on how to use number inputs.

Enable this widget with the feature number_input.

This widget does currently not support web

SelectionList

A selection space to show any options passed in.

Enable this widget with the feature selection_list.

Split

A split divides the available space to display two different elements.

Please take a look into our examples on how to use Splits.

Enable Splits with the feature split.

This widget is currently not supporting web

TabBar and Tabs

Please take a look into our examples on how to use TabBars and Tabs.

Enable TabBars with the feature tab_bar and Tabs with tabs.

Time Picker

Please take a look into our examples on how to use time pickers.

Enable this widget with the feature time_picker.

Menu

Please take a look into our examples on how to use menus.

Enable this widget with the feature menu.

You might also want to enable the feature quad for drawing separators.

Slide Bar

Please take a look into our examples on how to use slidebars.

Enable this widget with the feature slide_bar.

Context Menu

See the example here

Drop Down Menu

See the example here

Quickstart features

Quickstart features are pretty handy to start and experiment having everything like colors or icons available. Nevertheless, it is recommended to disable these features once the GUI is ready for production and to only include the things you really need.

Color palette

This crate adds a predefined color palette based on the CSS color palette.

Bootstrap icons

Thanks to Bootstrap, iced_aw now contains ~1,200 icons to be used in an Iced GUI.

Enable icons with the feature icons.

Note: the icon font with ~1,200 weights around 0.274 MB. This features should only be used for experimenting with all the icons.

iced_aw's Issues

helpers not found

I'm trying to use the menu widget in my project, but I get this error with this line:

use iced_aw::{helpers::menu_tree, menu_bar, menu_tree};

error[E0432]: unresolved imports `iced_aw::helpers`, `iced_aw::menu_bar`, `iced_aw::menu_tree`
  --> src/actions.rs:25:15
   |
25 | use iced_aw::{helpers::menu_tree, menu_bar, menu_tree};
   |               ^^^^^^^             ^^^^^^^^  ^^^^^^^^^ no `menu_tree` in the root
   |               |                   |
   |               |                   no `menu_bar` in the root
   |               could not find `helpers` in `iced_aw`
   |
   = help: consider importing this module instead:
           iced_aw::style::menu_bar

For more information about this error, try `rustc --explain E0432`.

This is my Cargo.toml file:

[dependencies]
iced = "0.9"
notify = "6.0.0"
futures = "0.3.28"
iced_aw = { version = "0.5.2", features = [
    "menu",
    "quad",
    "icon_text"
] }

Tabs don't work with the latest cargo iced version?

keep getting errors like this, tried with all 3 different versions of Tabs in this repo

(Text) Focus operations don't work in the Tabs Widget

As the title says. Tested with iced = 0.5.2 and iced_aw rev 5e1c1d0b6b907dc990490034bb3519cf836bd095. A minimal example follows: with no Tabs, pressing enter in one text field swaps to the other text field, but after putting everything in a Tabs, focus is no longer controllable.

use iced::{Application, Command, Element, Settings, Theme};
use iced::widget::{container, text_input, button, column, text_input::Id};
use iced_aw::{TabLabel, Tabs};

fn main() {
    MyWindow::run(Settings {
        antialiasing: true,
        ..Default::default()
    }).unwrap()
}

#[derive(Clone, Debug)]
enum Message {
    Text1(String),
    Text2(String),
    ToText1,
    ToText2,
    ToTab(usize),
    ToggleTabs,
}

struct MyWindow {
    use_tabs: bool,
    text1_id: Id,
    text1_text: String,
    text2_id: Id,
    text2_text: String,
}

impl Application for MyWindow {
    type Executor = iced::executor::Default;
    type Message = Message;
    type Theme = Theme;
    type Flags = ();

    fn new((): ()) -> (Self, Command<Message>) {
        let text2_id = Id::unique();
        let command = text_input::focus(text2_id.clone());
        (Self {
            use_tabs: false,
            text1_id: Id::unique(),
            text1_text: Default::default(),
            text2_id,
            text2_text: Default::default(),
        }, command)
    }

    fn title(&self) -> String {
        "Focus Test".into()
    }

    fn update(&mut self, message: Self::Message) -> Command<Message> {
        match message {
            Message::Text1(t) => { self.text1_text = t; Command::none() }
            Message::Text2(t) => { self.text2_text = t; Command::none() }
            Message::ToText1 => text_input::focus(self.text1_id.clone()),
            Message::ToText2 => text_input::focus(self.text2_id.clone()),
            Message::ToTab(_) => Command::none(),
            Message::ToggleTabs => { self.use_tabs = !self.use_tabs; text_input::focus(self.text1_id.clone()) }
        }
    }

    fn view(&self) -> Element<'_, Self::Message> {
        let col = column!(
            button(if self.use_tabs { "Turn off tabs" } else { "Turn on tabs" })
                .on_press(Message::ToggleTabs),
            text_input("text 1", &self.text1_text, Message::Text1)
                .id(self.text1_id.clone())
                .on_submit(Message::ToText2),
            text_input("text 2", &self.text2_text, Message::Text2)
                .id(self.text2_id.clone())
                .on_submit(Message::ToText1),
        );

        if self.use_tabs {
            let tabs = Tabs::new(0, Message::ToTab)
                .push(TabLabel::Text("This is a tab, and now you can't focus text inputs".into()), col);
            container(tabs)
        } else {
            container(col)
        }.center_x()
            .into()
    }

    fn theme(&self) -> Theme {
        Theme::Dark
    }
}

Please add multi modal widget

The current modal widget is restricted to only two possible states: visible and not-visible. This makes quite tricky to implement modals with multiple possible overlays.
It would be very useful to have a multi_modal widget, or otherwise to extend the current modal widget. This widget could accept for instance a show_modal: Option<usize> parameter, and then an array of overlay contents. In case of show_modal = None no overlay would be shown, and in case of show_modal = Some(i) the content[i] overlay would be shown.

Problematic: Tabs::new

Here a few thoughts, I would like to discuss, before I continue implementing #128.

The new function of Tabs as well as of TabBar is kind of unsafe.

This is due to the fact that after you call it, there's no tab/tab_label setup, which could be active.

Example:

Tabs::new(123, |x|{})

This can go wrong since there's no idx 123 setup at the moment.

I'll think about it, let me know when you have an idea on your own.

expected enum `Font`, found associated type

What is iced_native::Font used for in text::Render?
Renderer: iced_native::text::Renderer<Font = iced_native::Font>,

In the iced widgets use just Renderer: text::Renderer,

Tabs and TabBar on web

Awesome project!
Do you @Kaiden42 have any plans on making the Tabs and specifically TabBar widget available on the web?

Add a TextArea widget

It would be nice to implement a TextArea widget for great blocks of text that might be hardly handled through an InputText widget.

Something like this could be a visual example:

Request table component

There is no table component in the current component and you want to add a table component

feature "card" requires feature "colors", but isn't listed in Cargo.toml

Using iced_aw with feature "card", but without "colors" (default-features = false) as a dependency fails to compile

C:\some\path>cargo build
    Blocking waiting for file lock on build directory
   Compiling iced_aw v0.2.0 (https://github.com/iced-rs/iced_aw?rev=c6a3bfdc4d01d28aeb433d42628e80a620f78bb3#c6a3bfdc)
error[E0432]: unresolved import `super::colors`
 --> C:\Users\spamv\.cargo\git\checkouts\iced_aw-d8617147b960a6c7\c6a3bfd\src\style\card.rs:5:5
  |
5 | use super::colors;
  |     ^^^^^^^^^^^^^ no `colors` in `style`

For more information about this error, try `rustc --explain E0432`.
error: could not compile `iced_aw` due to previous error

Adding "colors" to the feature-list fixes the issue.

Menu crash

I think I build menu correctly but sometimes crash .
every run generate random index 1,10,7 or else and crash.

thread 'main' panicked at 'index out of bounds: the len is 10 but the index is 10', C:\Users\goldp\.cargo\git\checkouts\iced_aw-6122b81f7c90d3a2\2ef0a0a\src\native\menu\menu_inner.rs:413:34
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace

iced_aw/src/native/menu/menu_inner.rs

Line 413 in f2b1bbb

&tree[mt.index],

Environment

• iced_future runtime tokio
• gfx backend iced_wgpu on vulkan
• os Windows11 22H2
• i use menubar in pane grid and multiple menubar to build icon button with dropdown menu.
• menu contains Image and Text widget

Cannot compile TabBar example

I want to build an app starting with the TabBar as a base to work off. Following the README, my cargo dependencies are:

[dependencies]
iced =  { git = "https://github.com/hecrj/iced", rev = "12c0c18d662d2b817b559b94c71d18e122c76990" }
iced_aw = { git = "https://github.com/iced-rs/iced_aw", branch = "main", default-features = false, features = ["tab_bar"] }

Note that I'm using iced-rs/iced_aw instead of kaiden42/iced_aw and specified the main branch and the tab_bar feature.

I then copy-pasted the source of the TabBar example into my main.rs, but get the following errors:

error[E0308]: mismatched types
   --> src\main.rs:127:32
    |
127 |                     .tab_width(Length::Shrink)
    |                                ^^^^^^^^^^^^^^ expected enum `iced_core::length::Length`, found enum `Length`
    |
    = note: perhaps two different versions of crate `iced_core` are being used?

error[E0277]: the trait bound `iced_native::element::Element<'_, Message, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>: From<iced_aw::native::TabBar<Message, iced_graphics::renderer::Renderer<_>>>` is not satisfied
    |
118 |             .push(
    |              ^^^^ the trait `From<iced_aw::native::TabBar<Message, iced_graphics::renderer::Renderer<_>>>` is not implemented for `iced_native::element::Element<'_, Message, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>

I tried to solve the first by removing the rev from the cargo dependency, but no luck.
The second error is totally beyond my Rust competency.

Selection list in split (invisible/non-displaying)

Hello, I have trouble with the selection list in a split.

https://github.com/barvirm/Radventurer

// self.paths = vec!["FIRST ROW IN LIST".to_string(), "SECOND ROW IN LIST".to_string()]
let first = Container::new(Text::new("First"))
    .width(Length::Fill)
    .height(Length::Fill);

let selection_list = SelectionList::new(
    &mut self.selection_state,
    &self.paths[..],
    Some(self.selected_path.clone()),
    Message::OnFileClick,
);
    
let split = Split::new(&mut self.split_pane, first, selection_list, Message::OnResize);

Split doesn't compile with latest version of iced - workaround?

Hello!

Congrats on this package - it looks awesome!

I have an app built on the github version of iced and wanted to incorporate the Split widget from here. It does not compile with the following errors:

error[E0277]: the trait bound `iced_native::element::Element<'_, _, iced_graphics::renderer::Renderer<_>>: From<iced_native::widget::container::Container<'_, _, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>>` is not satisfied
  --> src/main.rs:49:9
   |
49 |         Split::new(&mut self.split_pane, first, second, Message::OnResize).into()
   |         ^^^^^^^^^^ the trait `From<iced_native::widget::container::Container<'_, _, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>>` is not implemented for `iced_native::element::Element<'_, _, iced_graphics::renderer::Renderer<_>>`
   |
   = help: the following implementations were found:
             <iced_native::element::Element<'a, Message, Renderer> as From<iced_aw::native::Split<'a, Message, Renderer>>>
             <iced_native::element::Element<'a, Message, Renderer> as From<iced_native::widget::button::Button<'a, Message, Renderer>>>
             <iced_native::element::Element<'a, Message, Renderer> as From<iced_native::widget::checkbox::Checkbox<Message, Renderer>>>
             <iced_native::element::Element<'a, Message, Renderer> as From<iced_native::widget::column::Column<'a, Message, Renderer>>>
           and 16 others
   = note: required because of the requirements on the impl of `Into<iced_native::element::Element<'_, _, iced_graphics::renderer::Renderer<_>>>` for `iced_native::widget::container::Container<'_, _, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>`
   = note: required by `iced_aw::native::Split::<'a, Message, Renderer>::new`

and

error[E0277]: the trait bound `iced_native::element::Element<'_, Message, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>: From<iced_aw::native::Split<'_, Message, iced_graphics::renderer::Renderer<_>>>` is not satisfied
  --> src/main.rs:49:76
   |
49 |         Split::new(&mut self.split_pane, first, second, Message::OnResize).into()
   |                                                                            ^^^^ the trait `From<iced_aw::native::Split<'_, Message, iced_graphics::renderer::Renderer<_>>>` is not implemented for `iced_native::element::Element<'_, Message, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>`
   |
   = help: the following implementations were found:
             <iced_native::element::Element<'a, Message, Renderer> as From<Image>>
             <iced_native::element::Element<'a, Message, Renderer> as From<Svg>>
             <iced_native::element::Element<'a, Message, Renderer> as From<Viewer<'a>>>
             <iced_native::element::Element<'a, Message, Renderer> as From<iced::Space>>
           and 16 others
   = note: required because of the requirements on the impl of `Into<iced_native::element::Element<'_, Message, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>>` for `iced_aw::native::Split<'_, Message, iced_graphics::renderer::Renderer<_>>`

I understand the version mismatch issue and I was trying to use the beta branch like this:

iced_aw = { git = "https://github.com/iced-rs/iced_aw", branch = "beta", default-features = false, features = ["split"]}

and was wondering if there are any suggestions as to how to approach this issue. I do understand the issues with the versions but maybe thought someone had been able to overcome this issue with some code slapped somewhere.

Cheers!

Lack of non ::new() widget creation functions

I just noticed that the iced_aw widgets seem to lack alternative creation functions, unlike in iced.

For example in iced you can create a Button by calling Button::new() or you can use button(). This doesn't seem to be the case with any of the iced_aw widgets, tho I have not checked all of them.

Is this an oversight?

color_picker color change

Color does not change in widget when updated externally.
In the following example if the [Red] button is pressed then the [Set Color] button, the widget comes up with the old color:

use iced::{
    widget::{button, Button, Container, Row, Text},
    Alignment, Color, Element, Length, Sandbox, Settings,
};

use iced_aw::ColorPicker;

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

#[derive(Clone, Debug)]
#[allow(clippy::enum_variant_names)]
enum Message {
    ChooseColor,
    SubmitColor(Color),
    CancelColor,
    Red,
}

struct ColorPickerExample {
    color: Color,
    show_picker: bool,
}

impl Sandbox for ColorPickerExample {
    type Message = Message;

    fn new() -> Self {
        ColorPickerExample {
            color: Color::from_rgba(0.5, 0.2, 0.7, 1.0),
            show_picker: false,
        }
    }

    fn title(&self) -> String {
        String::from("ColorPicker example")
    }

    fn update(&mut self, message: Self::Message) {
        match message {
            Message::ChooseColor => {
                self.show_picker = true;
            }
            Message::SubmitColor(color) => {
                self.color = color;
                self.show_picker = false;
            }
            Message::CancelColor => {
                self.show_picker = false;
            }
            Message::Red => {
                self.color = Color::from_rgb8(255, 0, 0);
            }
        }
    }

    fn view(&self) -> Element<'_, Self::Message> {
        let but = Button::new(Text::new("Set Color")).on_press(Message::ChooseColor);

        let colorpicker = ColorPicker::new(
            self.show_picker,
            self.color,
            but,
            Message::CancelColor,
            Message::SubmitColor,
        );

        let mut row = Row::new()
            .align_items(Alignment::Center)
            .spacing(10)
            .push(colorpicker)
            .push(Text::new(format!("Color: {:?}", self.color)));

        row = row.push(button("Red").on_press(Message::Red));

        Container::new(row)
            .center_x()
            .center_y()
            .width(Length::Fill)
            .height(Length::Fill)
            .into()
    }
}

Modal example fails to compile

Taken from the official example in the Modal docstring

let modal = Modal::new(true, Text::new("Underlay"), || Text::new("Overlay").into())
    .backdrop(Message::AddPaths);

This fails to compile with the following error:

error[E0283]: type annotations needed
   --> renameplus_gui/src/gui.rs:100:15
    |
100 |         let modal = Modal::new(true, Text::new("Underlay"), || Text::new("Overlay").into())
    |                     ^^^^^^^^^^ cannot infer type of the type parameter `U` declared on the associated function `new`
    |
    = note: cannot satisfy `_: iced_aw::modal::StyleSheet`
    = help: the trait `iced_aw::modal::StyleSheet` is implemented for `iced::Theme`
note: required by a bound in `iced_aw::native::Modal::<'a, Content, Message, Renderer>::new`
   --> /home/USER/.cargo/git/checkouts/iced_aw-d8617147b960a6c7/193e3bd/src/native/modal.rs:63:22
    |
63  |     Renderer::Theme: StyleSheet,
    |                      ^^^^^^^^^^ required by this bound in `Modal::<'a, Content, Message, Renderer>::new`
help: consider specifying the generic argument
    |
100 |         let modal = Modal::new::<iced_native::widget::Text<'_, iced_graphics::renderer::Renderer<Backend, Theme>>>(true, Text::new("Underlay"), || Text::new("Overlay").into())
    |                               ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

[Feature Request] TabBar/Tabs using a type instead of `usize` for `active_tab`

It just seems way more convinient and I couldn't find anything that speaks against this.

At the moment when a tab is clicked a function (defined in new or with_tabs) will be called that has an usize type for the tab that was selected. This of course works, but is quite errorprone (think of renaming or switching a tab)

I would prefer to see a Tab type, similar to Tabs::Message, with this developers can decide themselfes if they want to use an usize or an enum or whatever. Due to renaming or switching a tab, an enum would be way easier to handle.

Menu Needs Documentation added to readme.

Could you please make and add a Image or Video of the Menu and place it in the Readme with the feature needed to use it. @latidoremi

Once you get this done I can push 0.4.1

bug : Pick list is broken when using a FloatingElement

When using FloatingElement in an application, pick lists do not display selectable values anymore.
I made a Minimal reproducible example here.

NumberInput arrow icons not flexible.

The image shows that the input arrows are not proportional to the input size and unfortunately, it cannot be customized. Please solve the problem. Thank you 🙏

and codes ...

fn view(&self) -> Element<'_, Self::Message> {
    container(
        column![
            text("Password Generator").size(24).width(Length::Fill),
            column![
                text("Length: "),
                NumberInput::new(self.length, 50, Message::ChangeLength)
                    .style(NumberInputStyles::Default),
            ]
            .spacing(8),
            row![
                text_input(
                    &String::from("password"),
                    &self.password,
                    Message::PassChange
                ),
                button("Copy").on_press(Message::Copy),
            ],
            button("Generate").on_press(Message::Generate)
        ]
        .spacing(30),
    )
    .center_x()
    .center_y()
    .width(Length::Fill)
    .height(Length::Fill)
    .padding(10)
    .into()
}

Make DatePicker / TimePicker manage their open state themselves like PickList

I'd suggest making date_picker and time_picker widgets behave like a pick_list does, ie keep their opened and closed status themselves instead of having to generate events at all times, or at least have adapters that use a button in the back as a sane default ?
As in my case, its not trivial to track that given how much of them and where i'll have them in my dynamic layout.

Panic on Component within Modal

If you try to use a custom Component within a Modal, the program crashes with:

thread 'main' panicked at 'called Option::unwrap() on a None value', iced_lazy-0.2.0\src\component.rs:124:43

Minimal Reproduction:
main...rs017991:iced_aw:modal_bug_reprod

How to distinguish which NumberInput sends the message?

I have a dynamic list of NumberInputs, when NumInpChanged is caught, is there a way to distinguish which NumberInput widget sends the message? I would like to have a Message<String, f32> to define the custom identifier.

Icon size bug

I'm importing bootstrap icons.
I tried the FontForge program to open the TTF file, and found an icon called gears. In the program's editor it looks like this:

So it seems to be perfectly touching the edges of its area.

Using the tab bar example, it gets cut off:

However if I change this line https://github.com/iced-rs/iced_aw/blob/main/src/native/tab_bar.rs#L564
to be:

size: icon_bounds.height * 0.9

I get this:

I don't know enough about fonts and how the rendering in iced works, but hopefully this at least can give an indicator.
Other icons which are made such that the icon touches the "top of their own bounds" were also cut off.

Tabs example doesn't compile

Tabs example doesn't compile with command

cargo run --release -p tabs

results in

the trait `iced_graphics::backend::Image` is not implemented for `iced_wgpu::backend::Backend`

Selection List Make Positioning and Width/Height issues.

I am currently Struggling to figure out how to fix both the Height/width issue as well as keep the positioning Constant. In this way id prefer it was not an overlay but i think there is not many ways to do this otherwise. So i am looking to see if you can give me some help @Kaiden42. Been scratching my head since this morning over this issue.

So if you place something before it like a empty Space it will lay over that space OK. IF the space is to the Top most of the container and the lists height - position then it will render above the slider box. Still trying to figure out how the Location/sizing is handled in Iced......

How to get the icon fonts like the fonts in tabs example?

menu not working with scrollable

When the MenuBar is in scrollable and the scrollable is scrolled (not at the top) the menu doesn't work.
working example (I have included whole cargo.toml and main.rs for easier test):

[package]
name = "aw_menu_scrollable"
version = "0.1.0"
edition = "2021"

# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

[dependencies]
iced = "0.8.0"
iced_aw = { version = "0.4.1", default-features = false, features = ["menu"] }

use iced::{Element, Error, Length, Sandbox, Settings};
use iced::widget::{button, container, scrollable, text, column};
use iced_aw::menu::{MenuBar, MenuTree};

struct App;

#[derive(Debug, Clone)]
pub enum AppMessage {
    Something
}

impl Sandbox for App {
    type Message = AppMessage;

    fn new() -> Self {
        App
    }

    fn title(&self) -> String {
        String::from("test")
    }

    fn update(&mut self, message: Self::Message) {
        match message {
            AppMessage::Something => {
                // nothing
            }
        }
    }

    fn view(&self) -> Element<'_, Self::Message> {
        scrollable(
            container(
                column![
                    container(MenuBar::new(vec![
                        MenuTree::with_children(
                            button("Lorem").on_press(AppMessage::Something),
                            vec![
                                MenuTree::new(button("Edit").width(Length::Fill).height(Length::Fill).on_press(AppMessage::Something)),
                                MenuTree::new(button("Delete").width(Length::Fill).height(Length::Fill).on_press(AppMessage::Something))
                            ]
                        ).width(100)
                    ])).width(Length::Fill).center_x().padding(50),
                    container(text("something in between")).height(1000).center_x(),
                    container(MenuBar::new(vec![
                        MenuTree::with_children(
                            button("Lorem").on_press(AppMessage::Something),
                            vec![
                                MenuTree::new(button("Edit").width(Length::Fill).height(Length::Fill).on_press(AppMessage::Something)),
                                MenuTree::new(button("Delete").width(Length::Fill).height(Length::Fill).on_press(AppMessage::Something))
                            ]
                        ).width(100)
                    ])).width(Length::Fill).center_x().padding(50),

                ]
            )
        ).into()
    }
}

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

Request: File dialog, console terminal

Hello, just a couple items that I think would be useful to have

File dialog: pretty self explanatory. I wasn't able to find much on how to do this in Iced.

Console terminal: equivalent to the integrated terminal in VSCode. Useful as a direct interface to bundled CLI programs.

Eye dropper for the color picker widget

It would be nice if the color picker widget overlay showed an eye dropper.

There doesn't seem to be any cross platform eye dropper crates, I've tried to find the simplest way (that don't involve taking a screenshot and extracting one pixel from it) for each platform:

• On linux, there's a a method for that in the Screenshot portal
• On web, there's the EyeDropper api although it's not very well supported, currently just on desktop chromium browsers (it should also be possible to fallback to a color input which usually includes a color picker inside it)
• On windows, I found this function
• On mac, there doesn't seem to be a proper way to do it, the best I can find is using this method to get a 1 by 1 screenshot

These can probably live in a separate eyedropper crate.

The main problem I can think of is that picking a color from the screen is an inherently an asynchronous operation (will often be several seconds until the user clicks a color) and is actually an async fn for linux and web, and I'm not sure how that fits into a widget in iced...

NumberInput panics when overwriting selected number

The number input panics when selected text is overwritten.

thread 'main' panicked at 'slice index starts at 1 but ends at 0', /home/user/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/src/rust/library/alloc/src/vec/mod.rs:1735:36

Steps to reproduce this issue:

1. Create a NumberInput that starts with a value like 5 for example.
2. Select 5 in the TextInput part of the NumberInput.
3. Type another number to overwrite the selection.
4. Panic

Maybe this is caused by the text being empty.

Problems combing tabs and a plotters instance

Hi

I can use plotters-iced to successfully put a chart into an iced page that also contains a slider, using the split-chart example. I add slider parameters to the Message and the State structs, then add a .push(self.chart.view()) to the view code and it works as expected.

However, if I try the same thing using the tabs example code from iced_aw, where there isn't a view method, but rather a 'content' method, if I add .push(self.chart.view()) I end up with an error:

.push(self.chart.view());
   |              ^^^^ the trait `From<iced_native::element::Element<'_, Message, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>>` is not implemented for `iced_native::element::Element<'_, TimePlotMessage, iced_graphics::renderer::Renderer<iced_wgpu::backend::Backend>>`

In this case, I'm replacing the ferris jpeg in the iced_aw example tabs with the call to the plotters-iced chart. I'm stumped. I'm pretty sure this is my fault, but in the meanwhile, can anyone point me in the right direction? Until then, back to an app without a tab bar.

[Help] Custom style for Tabs

How to implement custom style for Tabs?
I'm trying to add a Dark style when the current theme is Dark
I've tried to do the following:

#[derive(Debug, Clone, Copy, Eq, PartialEq, Display, Default)]
pub enum MyTheme {
    Light,
    #[default]
    Dark,
}

impl iced_aw::tab_bar::StyleSheet for iced::Theme {
    type Style = MyTheme;

    fn active(&self, style: Self::Style, is_active: bool) -> iced_aw::style::tab_bar::Appearance {
        // ...
    }

    fn hovered(&self, style: Self::Style, is_active: bool) -> iced_aw::style::tab_bar::Appearance {
        // ...
    }
}

This does not work due to one of Rust's principles:
"Only traits defined in the current crate can be implemented for types defined outside of the crate define and implement a trait or new type instead"

If this approach is not feasible, what is the correct one? Thanks 😊🎉

PS: What do you think if we add Dark in TabBarStyles?
PSPS: I think styling is not strictly related to Tabs but also for other widgets too... Add an example on how to override a style? 👀

Custom Theme for Tabs

Is it possible to create a custom theme for tabs?
I have been trying but it looks like there is no way to style the tabs other than with the TabBarStyles.
Before I spend more time I thought to just ask here and see if it is possible at all?

how to make Grid 'cell' editable

I was trying to use grid feature to create a table-like widget, whose cells are editable.
My cell type is defined like:

#[derive(Debug, Clone)]
pub struct MyCell {
    row: usize,
    col: usize,
    value: String,
    state: text_input::State,
}

and my grid struct is like:

struct GridExample {
    cells: Vec<MyCell>,
    button_state: button::State,
    scrollable_state: scrollable::State,
}

However, whenever I tried to grid.insert() a TextInput into the grid in a for loop, the compiler complains that self.cells cannot be mutably borrowed more than once, since iced TextInput::new() method takes a mutable state, and that state arg originates from &mut self.cells.

So, what is the correct way to make the 'cell' editable?

Thanks in advance.

Using the Grid widget like a complete table.

I'm trying to make something like a Hex Viewer using a Grid Widget.

Apparently, this only works with a small number of lines, since the window just freezes. Is there any way to make a table?
The table was also requested here [(https://github.com/iced-rs/iced/discussions/1234)]

I'm a beginner, I apologize if the question seems naive.

     let mut grid = Grid::with_columns(3)
    .push(Text::new("").style(theme::Text::Color(Color::from([0.05882, 0.72157, 0.10196]))))
    .push(Text::new("01 02 03 04 05 06 07 08 09 0A 0B 0C 0D 0E 0F").style(theme::Text::Color(Color::from([0.05882, 0.72157, 0.10196]))))
    .push(Text::new("ASCII").style(theme::Text::Color(Color::from([0.05882, 0.72157, 0.10196]))));


    let mut rows_amount = (buff.end_addr - buff.start_addr) / buff.lenght_;

    let hex_index = usize::from(rows_amount);
    dbg!(hex_index);


    for i in 0..hex_index {
    grid.insert(Text::new(format!("Row {}, Test", (1))));
    grid.insert(Text::new(format!("Row {}, Test", (2))));
    grid.insert(Text::new(format!("Row {}, Test", (3))));

    let  final_buff = Column::new()
    .spacing(15)
    .max_width(600)
    .padding(10)
    .width(Length::Fill)
    .align_items(Alignment::Center)
    .push(grid)
    .into();
    
    let page_buff_scroll = Scrollable::new(final_buff);

    final_buff

Official community crate (?)

Hey, iced author here! This crate is great! 🎉

I was wondering if you would be interested in moving this crate to the iced-rs organization and make it an "official", community-driven "widget crate". We could use it to explore new widget ideas, APIs, and learn more about the current limitations. If a widget matures enough, then we could migrate it to the iced_native crate.

See this Zulip discussion for some context.

iced_aw theming

is it possible to theme and style widgets from iced_aw while using iced v0.5/iced v0.6?

if so, how do I do it? couldn't figure it out on my own

I don't know where to track progress on that

Allow NumberInput to have the same value as its minimum and maximum

NumberInput::bounds(), NumberInput::max() and NumberInput::min() all currently check that the minimum is less than the maximum. However, it would be nice if they checked if the minimum is less than or equal to the maximum. This would allow for a static number input with both the step buttons grayed out. A possible use case for this is a "locked" number input.

iced_style v0.5.0 broken?

I just tried building an example and now I'm experiencing a missing menu::Style from the pick_list. Seems that was changed recently to Appearance...

iced_style-0.5.0/src/pick_list.rs:31:66
fn menu(&self, style: &::Style) -> menu::Style;

This is still referencing menu::Style. I think this is fixed in iced 0.5.2 but there doesn't seem to be an iced_style v 0.5.2 yet?

How to implement multiple selection button over a map image

Just like the image above, I want to implement a map with multiple buttons floating around to click on. However, with the following code, I can let only one button overlaying the map. It seems that FloatingElement doesn't support multiple elements floating on a widget. How can I avoid this?

fn view(&self) -> Element<Message> {
    let mut map = container(widget::image(image::Handle::from_memory(
        include_bytes!("map.png"),
    )));
    for (index, i) in vision.images.iter().enumerate() {
        map = container(
            FloatingElement::new(map, move || {
                crate::button_from_svg(include_bytes!(
                    "location-pin.svg"
                ))
                .width(Length::Fixed(30.0))
                .on_press(Message::ClickedPin(index))
                .into()
            })
            .offset(Offset {
                x: i.pinpoint.0,
                y: i.pinpoint.1,
            }),
        );
    }
    map.into()
}

The actual effect is shown below. The only red button is the pinpoint of the last iterator of the loop.

Split doesn't do scrollable operations

Description

I am facing an issue when using the Split component in conjunction with a scrollable. When executing the command to make the scrollable go to the end, it does not function as expected. However, when testing the same scrollable without the Split component, the command works properly.

Steps to reproduce

1. Insert the Split component into the project
2. Add a scrollable inside the Split component
3. Execute the command to make the scrollable go to the end

Expected behavior

The scrollable should go to the end when the command is executed, even when inside the Split component.

Current behavior

The scrollable does not go to the end when inside the Split component and the command is executed.

Environment

• Operating System: Windows 11
• Dependencies
  iced = { version = "0.9.0", features = ["debug"] }
  iced_aw = { version="0.5.0", features = ["split"] }
  once_cell = "1.16.0"

Additional information

• Here is a Gist with the code I used to reproduce the bug
• Check if the issue occurs on different browsers or operating systems, if applicable.

Please let me know if you need more information or if there is anything I can do to help diagnose and resolve the issue.

number_input example doesn't work at all(Color issue?)

It's hard for me to say, where is the problem, but it's coming from src/style/colors.rs

request: make iced_aw work with the latest iced

It would be wonderful if one could use the master versions of both iced and iced_aw. As best I can tell, this is not currently possible, because iced_aw uses the crates.io versions of iced crates, and this leads to two different versions of the same iced crate in use at the same time, which won't compile.

In principle this might be enabled by iced_aw specifying iced crates using the general form

iced... = { git = "https://github.com/hecrj/iced", version = "..." }

I started a PR to do this, but ran into issues with the use of Padding. I could try to fix this, but am not sure I'd be making the correct changes.

how to set floating_element example button become a round

at commit 81b4dd1 version, the floating_element example button is a rectangular, not a round

Tabs incorrect behavior (tab bar filling widget space) when combined with window menus

This issue is based on a discussion thread. I was asked to open it.

---

Hello

I combined the menu example with the tabs example, but the result seems to be faulty somehow. The tabs bar fills the whole screen no matter what. I tried to change everything possible (even removing the icons altogether), but nothing helped.

Please find a minimal reproducible example in this repo: https://github.com/TheQuantumPhysicist/IcedTabsTest

build and run with cargo run. On some of my machines I needed to install libfontconfig-dev.

Thank you and have a great day.

icon text display issue

I used date_picker in my project, but those icons don't display correctly. Is the font file not configuring in Cargo.toml via git?

Modal components are broken

Same issue as in #73, examples/modal_components (175b928) can be used to reproduce:

thread 'main' panicked at 'called `Option::unwrap()` on a `None` value', /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:139:38
stack backtrace:
   0: rust_begin_unwind
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/std/src/panicking.rs:584:5
   1: core::panicking::panic_fmt
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/core/src/panicking.rs:67:14
   2: core::panicking::panic
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/core/src/panicking.rs:117:5
   3: core::option::Option<T>::unwrap
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/core/src/option.rs:949:21
   4: iced_lazy::component::Instance<Message,Renderer,Event,S>::rebuild_element_if_necessary::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:139:38
   5: iced_lazy::component::ouroboros_impl_state::State<Message,Renderer,Event,S>::new
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:94:1
   6: iced_lazy::component::ouroboros_impl_state::StateBuilder<Message,Renderer,Event,S,ElementBuilder_>::build
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:94:1
   7: iced_lazy::component::Instance<Message,Renderer,Event,S>::rebuild_element_if_necessary
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:146:18
   8: iced_lazy::component::Instance<Message,Renderer,Event,S>::with_element_mut
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:206:9
   9: iced_lazy::component::Instance<Message,Renderer,Event,S>::with_element
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:199:9
  10: <iced_lazy::component::Instance<Message,Renderer,Event,S> as iced_native::widget::Widget<Message,Renderer>>::layout
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_lazy-0.6.1/src/component.rs:258:14
  11: <iced_native::widget::container::Container<Message,Renderer> as iced_native::widget::Widget<Message,Renderer>>::layout::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_native-0.10.3/src/widget/container.rs:169:17
  12: iced_native::widget::container::layout
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_native-0.10.3/src/widget/container.rs:309:23
  13: <iced_native::widget::container::Container<Message,Renderer> as iced_native::widget::Widget<Message,Renderer>>::layout
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_native-0.10.3/src/widget/container.rs:158:9
  14: <iced_aw::native::overlay::modal::ModalOverlay<Message,Renderer> as iced_native::overlay::Overlay<Message,Renderer>>::layout
             at /Users/turai/Development/iced_aw/src/native/overlay/modal.rs:81:27
  15: iced_native::overlay::element::Element<Message,Renderer>::layout
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_native-0.10.3/src/overlay/element.rs:62:9
  16: iced_native::user_interface::UserInterface<Message,Renderer>::update
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_native-0.10.3/src/user_interface.rs:208:30
  17: iced_winit::application::run_instance::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_winit-0.9.1/src/application.rs:424:44
  18: iced_winit::application::run::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_winit-0.9.1/src/application.rs:251:24
  19: <winit::platform_impl::platform::app_state::EventLoopHandler<T> as winit::platform_impl::platform::app_state::EventHandler>::handle_nonuser_event::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/app_state.rs:106:17
  20: winit::platform_impl::platform::app_state::EventLoopHandler<T>::with_callback
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/app_state.rs:80:13
  21: <winit::platform_impl::platform::app_state::EventLoopHandler<T> as winit::platform_impl::platform::app_state::EventHandler>::handle_nonuser_event
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/app_state.rs:101:9
  22: winit::platform_impl::platform::app_state::Handler::handle_nonuser_event
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/app_state.rs:209:21
  23: winit::platform_impl::platform::app_state::AppState::cleared
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/app_state.rs:394:9
  24: winit::platform_impl::platform::observer::control_flow_end_handler::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/observer.rs:184:21
  25: winit::platform_impl::platform::observer::control_flow_handler::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/observer.rs:145:9
  26: std::panicking::try::do_call
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/std/src/panicking.rs:490:40
  27: std::panicking::try
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/std/src/panicking.rs:454:19
  28: std::panic::catch_unwind
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/std/src/panic.rs:140:14
  29: winit::platform_impl::platform::event_loop::stop_app_on_panic
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/event_loop.rs:265:11
  30: winit::platform_impl::platform::observer::control_flow_handler
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/observer.rs:143:5
  31: winit::platform_impl::platform::observer::control_flow_end_handler
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/observer.rs:179:9
  32: <unknown>
  33: <unknown>
  34: <unknown>
  35: <unknown>
  36: <unknown>
  37: <unknown>
  38: <unknown>
  39: <unknown>
  40: <unknown>
  41: <unknown>
  42: <() as objc::message::MessageArguments>::invoke
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/objc-0.2.7/src/message/mod.rs:128:17
  43: objc::message::platform::send_unverified
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/objc-0.2.7/src/message/apple/mod.rs:27:9
  44: objc::message::send_message
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/objc-0.2.7/src/message/mod.rs:178:5
  45: winit::platform_impl::platform::event_loop::EventLoop<T>::run_return::{{closure}}
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/objc-0.2.7/src/macros.rs:133:15
  46: objc::rc::autorelease::autoreleasepool
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/objc-0.2.7/src/rc/autorelease.rs:29:5
  47: winit::platform_impl::platform::event_loop::EventLoop<T>::run_return
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform_impl/macos/event_loop.rs:212:25
  48: <winit::event_loop::EventLoop<T> as winit::platform::run_return::EventLoopExtRunReturn>::run_return
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/winit-0.27.5/src/platform/run_return.rs:62:9
  49: iced_winit::application::platform::run
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_winit-0.9.1/src/application.rs:870:28
  50: iced_winit::application::run
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced_winit-0.9.1/src/application.rs:226:5
  51: iced::application::Application::run
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced-0.9.0/src/application.rs:209:12
  52: iced::sandbox::Sandbox::run
             at /Users/turai/.cargo/registry/src/index.crates.io-6f17d22bba15001f/iced-0.9.0/src/sandbox.rs:153:9
  53: modal_component::main
             at ./src/main.rs:9:5
  54: core::ops::function::FnOnce::call_once
             at /rustc/f5559e338256f17ada6d82b429acc2dbd8facc9c/library/core/src/ops/function.rs:250:5
note: Some details are omitted, run with `RUST_BACKTRACE=full` for a verbose backtrace.

Did wasm stop building?

If I clone the repo and run cargo check --target wasm32-unknown-unknown, I get a bunch of errors, such as:

error[E0433]: failed to resolve: use of undeclared type `Color`
  --> src/style/colors.rs:57:26
   |
57 | pub const BLACK: Color = Color::BLACK;
   |                          ^^^^^ use of undeclared type `Color`

error[E0433]: failed to resolve: use of undeclared type `Color`
   --> src/style/colors.rs:468:26
    |
468 | pub const WHITE: Color = Color::WHITE;
    |                          ^^^^^ use of undeclared type `Color`

error[E0433]: failed to resolve: use of undeclared type `Color`
   --> src/style/colors.rs:471:32
    |
471 | pub const WHITE_SMOKE: Color = Color::WHITE;
    |                                ^^^^^ use of undeclared type `Color`

error[E0412]: cannot find type `Color` in this scope
  --> src/style/colors.rs:12:20
   |
12 | pub const PRIMARY: Color = DODGER_BLUE;
   |                    ^^^^^ not found in this scope
   |
help: consider importing this struct
   |
8  | use iced_style::Color;
   |

error[E0412]: cannot find type `Color` in this scope

I'm wondering if wasm support broke recently?