diff options
56 files changed, 1716 insertions, 103 deletions
@@ -56,6 +56,7 @@ members = [ "examples/bezier_tool", "examples/clock", "examples/color_palette", + "examples/combo_box", "examples/counter", "examples/custom_widget", "examples/download_progress", diff --git a/examples/combo_box/Cargo.toml b/examples/combo_box/Cargo.toml new file mode 100644 index 00000000..7e1e4133 --- /dev/null +++ b/examples/combo_box/Cargo.toml @@ -0,0 +1,11 @@ +[package] +name = "combo_box" +version = "0.1.0" +authors = ["Héctor Ramón Jiménez <hector0193@gmail.com>"] +edition = "2018" +publish = false + +[dependencies] +iced = { path = "../..", features = ["debug"] } +iced_native = { path = "../../native" } +iced_wgpu = { path = "../../wgpu" } diff --git a/examples/combo_box/README.md b/examples/combo_box/README.md new file mode 100644 index 00000000..4d9fc5b9 --- /dev/null +++ b/examples/combo_box/README.md @@ -0,0 +1,18 @@ +## Counter + +The classic counter example explained in the [`README`](../../README.md). + +The __[`main`]__ file contains all the code of the example. + +<div align="center"> + <a href="https://gfycat.com/fairdeadcatbird"> + <img src="https://thumbs.gfycat.com/FairDeadCatbird-small.gif"> + </a> +</div> + +You can run it with `cargo run`: +``` +cargo run --package counter +``` + +[`main`]: src/main.rs diff --git a/examples/combo_box/src/main.rs b/examples/combo_box/src/main.rs new file mode 100644 index 00000000..416e9f76 --- /dev/null +++ b/examples/combo_box/src/main.rs @@ -0,0 +1,121 @@ +use iced::{ + button, combo_box, scrollable, Align, Button, ComboBox, Container, Element, + Length, Sandbox, Scrollable, Settings, Space, Text, +}; + +pub fn main() { + Example::run(Settings::default()) +} + +#[derive(Default)] +struct Example { + scroll: scrollable::State, + button: button::State, + combo_box: combo_box::State, + selected_language: Language, +} + +#[derive(Debug, Clone, Copy)] +enum Message { + ButtonPressed, + LanguageSelected(Language), +} + +impl Sandbox for Example { + type Message = Message; + + fn new() -> Self { + Self::default() + } + + fn title(&self) -> String { + String::from("Combo box - Iced") + } + + fn update(&mut self, message: Message) { + match message { + Message::ButtonPressed => {} + Message::LanguageSelected(language) => { + self.selected_language = language; + } + } + } + + fn view(&mut self) -> Element<Message> { + let combo_box = ComboBox::new( + &mut self.combo_box, + &Language::ALL[..], + Some(self.selected_language), + Message::LanguageSelected, + ); + + let button = Button::new(&mut self.button, Text::new("Press me!")) + .on_press(Message::ButtonPressed); + + let mut content = Scrollable::new(&mut self.scroll) + .width(Length::Fill) + .align_items(Align::Center) + .spacing(10) + .push(Space::with_height(Length::Units(800))) + .push(Text::new("Which is your favorite language?")) + .push(combo_box); + + content = content + .push(button) + .push(Space::with_height(Length::Units(800))); + + Container::new(content) + .width(Length::Fill) + .height(Length::Fill) + .center_x() + .center_y() + .into() + } +} + +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum Language { + Rust, + Elm, + Ruby, + Haskell, + C, + Javascript, + Other, +} + +impl Language { + const ALL: [Language; 7] = [ + Language::C, + Language::Elm, + Language::Ruby, + Language::Haskell, + Language::Rust, + Language::Javascript, + Language::Other, + ]; +} + +impl Default for Language { + fn default() -> Language { + Language::Rust + } +} + +impl std::fmt::Display for Language { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + write!( + f, + "{}", + match self { + Language::Rust => "Rust", + Language::Elm => "Elm", + Language::Ruby => "Ruby", + Language::Haskell => "Haskell", + Language::C => "C", + Language::Javascript => "Javascript", + Language::Other => "Some other language", + } + ) + } +} diff --git a/examples/custom_widget/src/main.rs b/examples/custom_widget/src/main.rs index bcf896b0..a6068f91 100644 --- a/examples/custom_widget/src/main.rs +++ b/examples/custom_widget/src/main.rs @@ -25,7 +25,7 @@ mod circle { } } - impl<Message, B> Widget<Message, Renderer<B>> for Circle + impl<'a, Message, B> Widget<'a, Message, Renderer<B>> for Circle where B: Backend, { diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs index 71ce0d8c..3795323a 100644 --- a/examples/geometry/src/main.rs +++ b/examples/geometry/src/main.rs @@ -27,7 +27,7 @@ mod rainbow { } } - impl<Message, B> Widget<Message, Renderer<B>> for Rainbow + impl<'a, Message, B> Widget<'a, Message, Renderer<B>> for Rainbow where B: Backend, { diff --git a/examples/todos/src/main.rs b/examples/todos/src/main.rs index c9cbcc69..5713a6f2 100644 --- a/examples/todos/src/main.rs +++ b/examples/todos/src/main.rs @@ -425,7 +425,7 @@ impl Filter { } } -fn loading_message() -> Element<'static, Message> { +fn loading_message<'a>() -> Element<'a, Message> { Container::new( Text::new("Loading...") .horizontal_alignment(HorizontalAlignment::Center) @@ -437,7 +437,7 @@ fn loading_message() -> Element<'static, Message> { .into() } -fn empty_message(message: &str) -> Element<'static, Message> { +fn empty_message<'a>(message: &str) -> Element<'a, Message> { Container::new( Text::new(message) .width(Length::Fill) diff --git a/glow/src/backend.rs b/glow/src/backend.rs index 8b5b4f9c..e1685816 100644 --- a/glow/src/backend.rs +++ b/glow/src/backend.rs @@ -193,6 +193,7 @@ impl iced_graphics::Backend for Backend { impl backend::Text for Backend { const ICON_FONT: Font = font::ICONS; const CHECKMARK_ICON: char = font::CHECKMARK_ICON; + const ARROW_DOWN_ICON: char = font::ARROW_DOWN_ICON; fn default_size(&self) -> u16 { self.default_text_size diff --git a/glow/src/lib.rs b/glow/src/lib.rs index a6c8a75a..bdd854e3 100644 --- a/glow/src/lib.rs +++ b/glow/src/lib.rs @@ -2,7 +2,7 @@ //! //! [`glow`]: https://github.com/grovesNL/glow //! [`iced_native`]: https://github.com/hecrj/iced/tree/master/native -#![deny(missing_docs)] +//#![deny(missing_docs)] #![deny(missing_debug_implementations)] #![deny(unused_results)] #![forbid(rust_2018_idioms)] diff --git a/glow/src/widget.rs b/glow/src/widget.rs index 9968092b..c8f16725 100644 --- a/glow/src/widget.rs +++ b/glow/src/widget.rs @@ -11,6 +11,7 @@ use crate::Renderer; pub mod button; pub mod checkbox; +pub mod combo_box; pub mod container; pub mod pane_grid; pub mod progress_bar; @@ -24,6 +25,8 @@ pub use button::Button; #[doc(no_inline)] pub use checkbox::Checkbox; #[doc(no_inline)] +pub use combo_box::ComboBox; +#[doc(no_inline)] pub use container::Container; #[doc(no_inline)] pub use pane_grid::PaneGrid; diff --git a/glow/src/widget/combo_box.rs b/glow/src/widget/combo_box.rs new file mode 100644 index 00000000..bfface29 --- /dev/null +++ b/glow/src/widget/combo_box.rs @@ -0,0 +1,8 @@ +pub use iced_native::combo_box::State; + +pub use iced_graphics::combo_box::{Style, StyleSheet}; +pub use iced_graphics::overlay::menu::Style as Menu; + +/// A widget allowing the selection of a single value from a list of options. +pub type ComboBox<'a, T, Message> = + iced_native::ComboBox<'a, T, Message, crate::Renderer>; diff --git a/graphics/fonts/Icons.ttf b/graphics/fonts/Icons.ttf Binary files differindex 1c832f86..5e455b69 100644 --- a/graphics/fonts/Icons.ttf +++ b/graphics/fonts/Icons.ttf diff --git a/graphics/src/backend.rs b/graphics/src/backend.rs index b73c636e..dd7dbbc2 100644 --- a/graphics/src/backend.rs +++ b/graphics/src/backend.rs @@ -22,9 +22,14 @@ pub trait Text { /// The `char` representing a ✔ icon in the [`ICON_FONT`]. /// - /// [`ICON_FONT`]: #associatedconst.ICON_FONt + /// [`ICON_FONT`]: #associatedconst.ICON_FONT const CHECKMARK_ICON: char; + /// The `char` representing a ▼ icon in the built-in [`ICONS`] font. + /// + /// [`ICON_FONT`]: #associatedconst.ICON_FONT + const ARROW_DOWN_ICON: char; + /// Returns the default size of text. fn default_size(&self) -> u16; diff --git a/graphics/src/font.rs b/graphics/src/font.rs index bcc28857..5c62681c 100644 --- a/graphics/src/font.rs +++ b/graphics/src/font.rs @@ -31,3 +31,9 @@ pub const ICONS: iced_native::Font = iced_native::Font::External { #[cfg(feature = "font-icons")] #[cfg_attr(docsrs, doc(cfg(feature = "font-icons")))] pub const CHECKMARK_ICON: char = '\u{F00C}'; + +/// The `char` representing a ▼ icon in the built-in [`ICONS`] font. +/// +/// [`ICONS`]: const.ICONS.html +#[cfg(feature = "font-icons")] +pub const ARROW_DOWN_ICON: char = '\u{E800}'; diff --git a/graphics/src/lib.rs b/graphics/src/lib.rs index 38d8dffa..0c427634 100644 --- a/graphics/src/lib.rs +++ b/graphics/src/lib.rs @@ -2,7 +2,7 @@ //! for [`iced`]. //! //! [`iced`]: https://github.com/hecrj/iced -#![deny(missing_docs)] +//#![deny(missing_docs)] #![deny(missing_debug_implementations)] #![deny(unused_results)] #![deny(unsafe_code)] @@ -13,13 +13,14 @@ mod primitive; mod renderer; mod transformation; mod viewport; -mod widget; pub mod backend; pub mod defaults; pub mod font; pub mod layer; +pub mod overlay; pub mod triangle; +pub mod widget; pub mod window; #[doc(no_inline)] diff --git a/graphics/src/overlay.rs b/graphics/src/overlay.rs new file mode 100644 index 00000000..b9a0e3e0 --- /dev/null +++ b/graphics/src/overlay.rs @@ -0,0 +1 @@ +pub mod menu; diff --git a/graphics/src/overlay/menu.rs b/graphics/src/overlay/menu.rs new file mode 100644 index 00000000..89a9cd03 --- /dev/null +++ b/graphics/src/overlay/menu.rs @@ -0,0 +1,107 @@ +use crate::backend::{self, Backend}; +use crate::{Primitive, Renderer}; +use iced_native::{ + mouse, overlay, Color, Font, HorizontalAlignment, Point, Rectangle, + VerticalAlignment, +}; + +pub use iced_style::menu::Style; + +impl<B> overlay::menu::Renderer for Renderer<B> +where + B: Backend + backend::Text, +{ + type Style = Style; + + fn decorate( + &mut self, + bounds: Rectangle, + _cursor_position: Point, + style: &Style, + (primitives, mouse_cursor): Self::Output, + ) -> Self::Output { + ( + Primitive::Group { + primitives: vec![ + Primitive::Quad { + bounds, + background: style.background, + border_color: style.border_color, + border_width: style.border_width, + border_radius: 0, + }, + primitives, + ], + }, + mouse_cursor, + ) + } + + fn draw<T: ToString>( + &mut self, + bounds: Rectangle, + cursor_position: Point, + options: &[T], + hovered_option: Option<usize>, + padding: u16, + text_size: u16, + font: Font, + style: &Style, + ) -> Self::Output { + use std::f32; + + let is_mouse_over = bounds.contains(cursor_position); + + let mut primitives = Vec::new(); + + for (i, option) in options.iter().enumerate() { + let is_selected = hovered_option == Some(i); + + let bounds = Rectangle { + x: bounds.x, + y: bounds.y + + ((text_size as usize + padding as usize * 2) * i) as f32, + width: bounds.width, + height: f32::from(text_size + padding * 2), + }; + + if is_selected { + primitives.push(Primitive::Quad { + bounds, + background: style.selected_background, + border_color: Color::TRANSPARENT, + border_width: 0, + border_radius: 0, + }); + } + + primitives.push(Primitive::Text { + content: option.to_string(), + bounds: Rectangle { + x: bounds.x + f32::from(padding), + y: bounds.center_y(), + width: f32::INFINITY, + ..bounds + }, + size: f32::from(text_size), + font, + color: if is_selected { + style.selected_text_color + } else { + style.text_color + }, + horizontal_alignment: HorizontalAlignment::Left, + vertical_alignment: VerticalAlignment::Center, + }); + } + + ( + Primitive::Group { primitives }, + if is_mouse_over { + mouse::Interaction::Pointer + } else { + mouse::Interaction::default() + }, + ) + } +} diff --git a/graphics/src/renderer.rs b/graphics/src/renderer.rs index c9360f3a..5ca6c057 100644 --- a/graphics/src/renderer.rs +++ b/graphics/src/renderer.rs @@ -1,7 +1,9 @@ use crate::{Backend, Defaults, Primitive}; use iced_native::layout::{self, Layout}; use iced_native::mouse; -use iced_native::{Background, Color, Element, Point, Widget}; +use iced_native::{ + Background, Color, Element, Point, Rectangle, Vector, Widget, +}; /// A backend-agnostic renderer that supports all the built-in widgets. #[derive(Debug)] @@ -53,6 +55,35 @@ where layout } + + fn overlay( + &mut self, + (base_primitive, base_cursor): (Primitive, mouse::Interaction), + (overlay_primitives, overlay_cursor): (Primitive, mouse::Interaction), + overlay_bounds: Rectangle, + ) -> (Primitive, mouse::Interaction) { + ( + Primitive::Group { + primitives: vec![ + base_primitive, + Primitive::Clip { + bounds: Rectangle { + width: overlay_bounds.width + 0.5, + height: overlay_bounds.height + 0.5, + ..overlay_bounds + }, + offset: Vector::new(0, 0), + content: Box::new(overlay_primitives), + }, + ], + }, + if base_cursor > overlay_cursor { + base_cursor + } else { + overlay_cursor + }, + ) + } } impl<B> layout::Debugger for Renderer<B> @@ -62,7 +93,7 @@ where fn explain<Message>( &mut self, defaults: &Defaults, - widget: &dyn Widget<Message, Self>, + widget: &dyn Widget<'_, Message, Self>, layout: Layout<'_>, cursor_position: Point, color: Color, diff --git a/graphics/src/widget.rs b/graphics/src/widget.rs index 1f6d6559..a0d06999 100644 --- a/graphics/src/widget.rs +++ b/graphics/src/widget.rs @@ -9,6 +9,7 @@ //! ``` pub mod button; pub mod checkbox; +pub mod combo_box; pub mod container; pub mod image; pub mod pane_grid; diff --git a/graphics/src/widget/canvas.rs b/graphics/src/widget/canvas.rs index b8466239..0257f819 100644 --- a/graphics/src/widget/canvas.rs +++ b/graphics/src/widget/canvas.rs @@ -134,7 +134,7 @@ impl<Message, P: Program<Message>> Canvas<Message, P> { } } -impl<Message, P, B> Widget<Message, Renderer<B>> for Canvas<Message, P> +impl<'a, Message, P, B> Widget<'a, Message, Renderer<B>> for Canvas<Message, P> where P: Program<Message>, B: Backend, diff --git a/graphics/src/widget/combo_box.rs b/graphics/src/widget/combo_box.rs new file mode 100644 index 00000000..e7ed4e04 --- /dev/null +++ b/graphics/src/widget/combo_box.rs @@ -0,0 +1,96 @@ +use crate::backend::{self, Backend}; +use crate::{Primitive, Renderer}; +use iced_native::{ + mouse, Font, HorizontalAlignment, Point, Rectangle, VerticalAlignment, +}; +use iced_style::menu; + +pub use iced_native::combo_box::State; +pub use iced_style::combo_box::{Style, StyleSheet}; + +/// A widget allowing the selection of a single value from a list of options. +pub type ComboBox<'a, T, Message, Backend> = + iced_native::ComboBox<'a, T, Message, Renderer<Backend>>; + +impl<B> iced_native::combo_box::Renderer for Renderer<B> +where + B: Backend + backend::Text, +{ + type Style = Box<dyn StyleSheet>; + + const DEFAULT_PADDING: u16 = 5; + + fn menu_style(style: &Box<dyn StyleSheet>) -> menu::Style { + style.menu() + } + + fn draw( + &mut self, + bounds: Rectangle, + cursor_position: Point, + selected: Option<String>, + padding: u16, + text_size: u16, + font: Font, + style: &Box<dyn StyleSheet>, + ) -> Self::Output { + let is_mouse_over = bounds.contains(cursor_position); + + let style = if is_mouse_over { + style.hovered() + } else { + style.active() + }; + + let background = Primitive::Quad { + bounds, + background: style.background, + border_color: style.border_color, + border_width: style.border_width, + border_radius: style.border_radius, + }; + + let arrow_down = Primitive::Text { + content: B::ARROW_DOWN_ICON.to_string(), + font: B::ICON_FONT, + size: bounds.height * style.icon_size, + bounds: Rectangle { + x: bounds.x + bounds.width - f32::from(padding) * 2.0, + y: bounds.center_y(), + ..bounds + }, + color: style.text_color, + horizontal_alignment: HorizontalAlignment::Right, + vertical_alignment: VerticalAlignment::Center, + }; + + ( + Primitive::Group { + primitives: if let Some(label) = selected { + let label = Primitive::Text { + content: label, + size: f32::from(text_size), + font, + color: style.text_color, + bounds: Rectangle { + x: bounds.x + f32::from(padding), + y: bounds.center_y(), + ..bounds + }, + horizontal_alignment: HorizontalAlignment::Left, + vertical_alignment: VerticalAlignment::Center, + }; + + vec![background, label, arrow_down] + } else { + vec![background, arrow_down] + }, + }, + if is_mouse_over { + mouse::Interaction::Pointer + } else { + mouse::Interaction::default() + }, + ) + } +} diff --git a/native/src/element.rs b/native/src/element.rs index 73e39012..b00f9e55 100644 --- a/native/src/element.rs +++ b/native/src/element.rs @@ -1,6 +1,8 @@ use crate::{ - layout, Clipboard, Color, Event, Hasher, Layout, Length, Point, Widget, + layout, Clipboard, Color, Event, Hasher, Layout, Length, Overlay, Point, + Widget, }; +use std::rc::Rc; /// A generic [`Widget`]. /// @@ -15,7 +17,7 @@ use crate::{ /// [`Element`]: struct.Element.html #[allow(missing_debug_implementations)] pub struct Element<'a, Message, Renderer> { - pub(crate) widget: Box<dyn Widget<Message, Renderer> + 'a>, + pub(crate) widget: Box<dyn Widget<'a, Message, Renderer> + 'a>, } impl<'a, Message, Renderer> Element<'a, Message, Renderer> @@ -27,7 +29,7 @@ where /// [`Element`]: struct.Element.html /// [`Widget`]: widget/trait.Widget.html pub fn new( - widget: impl Widget<Message, Renderer> + 'a, + widget: impl Widget<'a, Message, Renderer> + 'a, ) -> Element<'a, Message, Renderer> { Element { widget: Box::new(widget), @@ -270,16 +272,23 @@ where pub fn hash_layout(&self, state: &mut Hasher) { self.widget.hash_layout(state); } + + pub fn overlay<'b>( + &'b mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'b, Message, Renderer>> { + self.widget.overlay(layout) + } } struct Map<'a, A, B, Renderer> { - widget: Box<dyn Widget<A, Renderer> + 'a>, - mapper: Box<dyn Fn(A) -> B>, + widget: Box<dyn Widget<'a, A, Renderer> + 'a>, + mapper: Rc<dyn Fn(A) -> B>, } impl<'a, A, B, Renderer> Map<'a, A, B, Renderer> { pub fn new<F>( - widget: Box<dyn Widget<A, Renderer> + 'a>, + widget: Box<dyn Widget<'a, A, Renderer> + 'a>, mapper: F, ) -> Map<'a, A, B, Renderer> where @@ -287,14 +296,16 @@ impl<'a, A, B, Renderer> Map<'a, A, B, Renderer> { { Map { widget, - mapper: Box::new(mapper), + mapper: Rc::new(mapper), } } } -impl<'a, A, B, Renderer> Widget<B, Renderer> for Map<'a, A, B, Renderer> +impl<'a, A, B, Renderer> Widget<'a, B, Renderer> for Map<'a, A, B, Renderer> where - Renderer: crate::Renderer, + Renderer: crate::Renderer + 'a, + A: 'static, + B: 'static, { fn width(&self) -> Length { self.widget.width() @@ -351,6 +362,17 @@ where fn hash_layout(&self, state: &mut Hasher) { self.widget.hash_layout(state); } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, B, Renderer>> { + let mapper = self.mapper.clone(); + + self.widget + .overlay(layout) + .map(move |overlay| overlay.map(mapper)) + } } struct Explain<'a, Message, Renderer: crate::Renderer> { @@ -367,7 +389,7 @@ where } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Explain<'a, Message, Renderer> where Renderer: crate::Renderer + layout::Debugger, @@ -426,4 +448,11 @@ where fn hash_layout(&self, state: &mut Hasher) { self.element.widget.hash_layout(state); } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, Message, Renderer>> { + self.element.overlay(layout) + } } diff --git a/native/src/layout/debugger.rs b/native/src/layout/debugger.rs index e4b21609..9c58f4f1 100644 --- a/native/src/layout/debugger.rs +++ b/native/src/layout/debugger.rs @@ -18,7 +18,7 @@ pub trait Debugger: Renderer { fn explain<Message>( &mut self, defaults: &Self::Defaults, - widget: &dyn Widget<Message, Self>, + widget: &dyn Widget<'_, Message, Self>, layout: Layout<'_>, cursor_position: Point, color: Color, diff --git a/native/src/lib.rs b/native/src/lib.rs index b67ff2a1..ea328592 100644 --- a/native/src/lib.rs +++ b/native/src/lib.rs @@ -30,14 +30,15 @@ //! [`Widget`]: widget/trait.Widget.html //! [`UserInterface`]: struct.UserInterface.html //! [renderer]: renderer/index.html -#![deny(missing_docs)] -#![deny(missing_debug_implementations)] +//#![deny(missing_docs)] +//#![deny(missing_debug_implementations)] #![deny(unused_results)] #![forbid(unsafe_code)] #![forbid(rust_2018_idioms)] pub mod keyboard; pub mod layout; pub mod mouse; +pub mod overlay; pub mod program; pub mod renderer; pub mod subscription; @@ -75,6 +76,7 @@ pub use element::Element; pub use event::Event; pub use hasher::Hasher; pub use layout::Layout; +pub use overlay::Overlay; pub use program::Program; pub use renderer::Renderer; pub use runtime::Runtime; diff --git a/native/src/overlay.rs b/native/src/overlay.rs new file mode 100644 index 00000000..b8c8bb48 --- /dev/null +++ b/native/src/overlay.rs @@ -0,0 +1,150 @@ +mod content; + +pub mod menu; + +pub use content::Content; +pub use menu::Menu; + +use crate::{layout, Clipboard, Event, Hasher, Layout, Point, Size, Vector}; +use std::rc::Rc; + +#[allow(missing_debug_implementations)] +pub struct Overlay<'a, Message, Renderer> { + position: Point, + content: Box<dyn Content<Message, Renderer> + 'a>, +} + +impl<'a, Message, Renderer> Overlay<'a, Message, Renderer> +where + Renderer: crate::Renderer, +{ + pub fn new( + position: Point, + content: Box<dyn Content<Message, Renderer> + 'a>, + ) -> Self { + Self { position, content } + } + + pub fn translate(mut self, translation: Vector) -> Self { + self.position = self.position + translation; + self + } + + pub fn map<B>(self, f: Rc<dyn Fn(Message) -> B>) -> Overlay<'a, B, Renderer> + where + Message: 'a, + Renderer: 'a, + B: 'static, + { + Overlay { + position: self.position, + content: Box::new(Map::new(self.content, f)), + } + } + + pub fn layout(&self, renderer: &Renderer, bounds: Size) -> layout::Node { + self.content.layout(renderer, bounds, self.position) + } + + pub fn draw( + &self, + renderer: &mut Renderer, + defaults: &Renderer::Defaults, + layout: Layout<'_>, + cursor_position: Point, + ) -> Renderer::Output { + self.content + .draw(renderer, defaults, layout, cursor_position) + } + + pub fn hash_layout(&self, state: &mut Hasher) { + self.content.hash_layout(state, self.position); + } + + pub fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec<Message>, + renderer: &Renderer, + clipboard: Option<&dyn Clipboard>, + ) { + self.content.on_event( + event, + layout, + cursor_position, + messages, + renderer, + clipboard, + ) + } +} + +struct Map<'a, A, B, Renderer> { + content: Box<dyn Content<A, Renderer> + 'a>, + mapper: Rc<dyn Fn(A) -> B>, +} + +impl<'a, A, B, Renderer> Map<'a, A, B, Renderer> { + pub fn new( + content: Box<dyn Content<A, Renderer> + 'a>, + mapper: Rc<dyn Fn(A) -> B + 'static>, + ) -> Map<'a, A, B, Renderer> { + Map { content, mapper } + } +} + +impl<'a, A, B, Renderer> Content<B, Renderer> for Map<'a, A, B, Renderer> +where + Renderer: crate::Renderer, +{ + fn layout( + &self, + renderer: &Renderer, + bounds: Size, + position: Point, + ) -> layout::Node { + self.content.layout(renderer, bounds, position) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec<B>, + renderer: &Renderer, + clipboard: Option<&dyn Clipboard>, + ) { + let mut original_messages = Vec::new(); + + self.content.on_event( + event, + layout, + cursor_position, + &mut original_messages, + renderer, + clipboard, + ); + + original_messages + .drain(..) + .for_each(|message| messages.push((self.mapper)(message))); + } + + fn draw( + &self, + renderer: &mut Renderer, + defaults: &Renderer::Defaults, + layout: Layout<'_>, + cursor_position: Point, + ) -> Renderer::Output { + self.content + .draw(renderer, defaults, layout, cursor_position) + } + + fn hash_layout(&self, state: &mut Hasher, position: Point) { + self.content.hash_layout(state, position); + } +} diff --git a/native/src/overlay/content.rs b/native/src/overlay/content.rs new file mode 100644 index 00000000..5259c4b8 --- /dev/null +++ b/native/src/overlay/content.rs @@ -0,0 +1,34 @@ +use crate::{layout, Clipboard, Event, Hasher, Layout, Point, Size}; + +pub trait Content<Message, Renderer> +where + Renderer: crate::Renderer, +{ + fn layout( + &self, + renderer: &Renderer, + bounds: Size, + position: Point, + ) -> layout::Node; + + fn draw( + &self, + renderer: &mut Renderer, + defaults: &Renderer::Defaults, + layout: Layout<'_>, + cursor_position: Point, + ) -> Renderer::Output; + + fn hash_layout(&self, state: &mut Hasher, position: Point); + + fn on_event( + &mut self, + _event: Event, + _layout: Layout<'_>, + _cursor_position: Point, + _messages: &mut Vec<Message>, + _renderer: &Renderer, + _clipboard: Option<&dyn Clipboard>, + ) { + } +} diff --git a/native/src/overlay/menu.rs b/native/src/overlay/menu.rs new file mode 100644 index 00000000..a192e389 --- /dev/null +++ b/native/src/overlay/menu.rs @@ -0,0 +1,406 @@ +use crate::{ + container, layout, mouse, overlay, scrollable, text, Clipboard, Container, + Element, Event, Hasher, Layout, Length, Point, Rectangle, Scrollable, Size, + Vector, Widget, +}; + +pub struct Menu<'a, T, Message, Renderer: self::Renderer> { + state: &'a mut State, + options: &'a [T], + on_selected: &'a dyn Fn(T) -> Message, + width: u16, + padding: u16, + text_size: Option<u16>, + font: Renderer::Font, + style: <Renderer as self::Renderer>::Style, +} + +impl<'a, T, Message, Renderer> Menu<'a, T, Message, Renderer> +where + T: ToString + Clone, + Message: 'a, + Renderer: self::Renderer + 'a, +{ + pub fn new( + state: &'a mut State, + options: &'a [T], + on_selected: &'a dyn Fn(T) -> Message, + ) -> Self { + Menu { + state, + options, + on_selected, + width: 0, + padding: 0, + text_size: None, + font: Default::default(), + style: Default::default(), + } + } + + pub fn width(mut self, width: u16) -> Self { + self.width = width; + self + } + + pub fn padding(mut self, padding: u16) -> Self { + self.padding = padding; + self + } + + pub fn text_size(mut self, text_size: u16) -> Self { + self.text_size = Some(text_size); + self + } + + pub fn font(mut self, font: Renderer::Font) -> Self { + self.font = font; + self + } + + pub fn style( + mut self, + style: impl Into<<Renderer as self::Renderer>::Style>, + ) -> Self { + self.style = style.into(); + self + } + + pub fn overlay( + self, + position: Point, + target_height: f32, + ) -> overlay::Overlay<'a, Message, Renderer> { + overlay::Overlay::new( + position, + Box::new(Overlay::new(self, target_height)), + ) + } +} + +#[derive(Default)] +pub struct State { + scrollable: scrollable::State, + hovered_option: Option<usize>, + is_open: bool, +} + +impl State { + pub fn is_open(&self) -> bool { + self.is_open + } + + pub fn open(&mut self, hovered_option: Option<usize>) { + self.is_open = true; + self.hovered_option = hovered_option; + } +} + +struct Overlay<'a, Message, Renderer: self::Renderer> { + container: Container<'a, Message, Renderer>, + is_open: &'a mut bool, + width: u16, + target_height: f32, + style: <Renderer as self::Renderer>::Style, +} + +impl<'a, Message, Renderer: self::Renderer> Overlay<'a, Message, Renderer> +where + Message: 'a, + Renderer: 'a, +{ + pub fn new<T>( + menu: Menu<'a, T, Message, Renderer>, + target_height: f32, + ) -> Self + where + T: Clone + ToString, + { + let Menu { + state, + options, + on_selected, + width, + padding, + font, + text_size, + style, + } = menu; + + let container = + Container::new(Scrollable::new(&mut state.scrollable).push(List { + options, + hovered_option: &mut state.hovered_option, + on_selected, + font, + text_size, + padding, + style: style.clone(), + })) + .padding(1); + + Self { + container, + is_open: &mut state.is_open, + width: width, + target_height, + style: style, + } + } +} + +impl<'a, Message, Renderer> overlay::Content<Message, Renderer> + for Overlay<'a, Message, Renderer> +where + Renderer: self::Renderer, +{ + fn layout( + &self, + renderer: &Renderer, + bounds: Size, + position: Point, + ) -> layout::Node { + let space_below = bounds.height - (position.y + self.target_height); + let space_above = position.y; + + let limits = layout::Limits::new( + Size::ZERO, + Size::new( + bounds.width - position.x, + if space_below > space_above { + space_below + } else { + space_above + }, + ), + ) + .width(Length::Units(self.width)); + + let mut node = self.container.layout(renderer, &limits); + + node.move_to(if space_below > space_above { + position + Vector::new(0.0, self.target_height) + } else { + position - Vector::new(0.0, node.size().height) + }); + + node + } + + fn hash_layout(&self, state: &mut Hasher, position: Point) { + use std::hash::Hash; + + struct Marker; + std::any::TypeId::of::<Marker>().hash(state); + + (position.x as u32).hash(state); + (position.y as u32).hash(state); + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec<Message>, + renderer: &Renderer, + clipboard: Option<&dyn Clipboard>, + ) { + let bounds = layout.bounds(); + let current_messages = messages.len(); + + self.container.on_event( + event.clone(), + layout, + cursor_position, + messages, + renderer, + clipboard, + ); + + let option_was_selected = current_messages < messages.len(); + + match event { + Event::Mouse(mouse::Event::ButtonPressed(mouse::Button::Left)) + if !bounds.contains(cursor_position) || option_was_selected => + { + *self.is_open = false; + } + _ => {} + } + } + + fn draw( + &self, + renderer: &mut Renderer, + defaults: &Renderer::Defaults, + layout: Layout<'_>, + cursor_position: Point, + ) -> Renderer::Output { + let primitives = + self.container + .draw(renderer, defaults, layout, cursor_position); + + renderer.decorate( + layout.bounds(), + cursor_position, + &self.style, + primitives, + ) + } +} + +struct List<'a, T, Message, Renderer: self::Renderer> { + options: &'a [T], + hovered_option: &'a mut Option<usize>, + on_selected: &'a dyn Fn(T) -> Message, + padding: u16, + text_size: Option<u16>, + font: Renderer::Font, + style: <Renderer as self::Renderer>::Style, +} + +impl<'a, T, Message, Renderer: self::Renderer> Widget<'a, Message, Renderer> + for List<'a, T, Message, Renderer> +where + T: Clone + ToString, + Renderer: self::Renderer, +{ + fn width(&self) -> Length { + Length::Fill + } + + fn height(&self) -> Length { + Length::Shrink + } + + fn layout( + &self, + renderer: &Renderer, + limits: &layout::Limits, + ) -> layout::Node { + use std::f32; + + let limits = limits.width(Length::Fill).height(Length::Shrink); + let text_size = self.text_size.unwrap_or(renderer.default_size()); + + let size = { + let intrinsic = Size::new( + 0.0, + f32::from(text_size + self.padding * 2) + * self.options.len() as f32, + ); + + limits.resolve(intrinsic) + }; + + layout::Node::new(size) + } + + fn hash_layout(&self, state: &mut Hasher) { + use std::hash::Hash as _; + + struct Marker; + std::any::TypeId::of::<Marker>().hash(state); + + self.options.len().hash(state); + self.text_size.hash(state); + self.padding.hash(state); + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec<Message>, + renderer: &Renderer, + _clipboard: Option<&dyn Clipboard>, + ) { + match event { + Event::Mouse(mouse::Event::ButtonPressed(mouse::Button::Left)) => { + let bounds = layout.bounds(); + + if bounds.contains(cursor_position) { + if let Some(index) = *self.hovered_option { + if let Some(option) = self.options.get(index) { + messages.push((self.on_selected)(option.clone())); + } + } + } + } + Event::Mouse(mouse::Event::CursorMoved { .. }) => { + let bounds = layout.bounds(); + let text_size = + self.text_size.unwrap_or(renderer.default_size()); + + if bounds.contains(cursor_position) { + *self.hovered_option = Some( + ((cursor_position.y - bounds.y) + / f32::from(text_size + self.padding * 2)) + as usize, + ); + } + } + _ => {} + } + } + + fn draw( + &self, + renderer: &mut Renderer, + _defaults: &Renderer::Defaults, + layout: Layout<'_>, + cursor_position: Point, + ) -> Renderer::Output { + self::Renderer::draw( + renderer, + layout.bounds(), + cursor_position, + self.options, + *self.hovered_option, + self.padding, + self.text_size.unwrap_or(renderer.default_size()), + self.font, + &self.style, + ) + } +} + +pub trait Renderer: + scrollable::Renderer + container::Renderer + text::Renderer +{ + type Style: Default + Clone; + + fn decorate( + &mut self, + bounds: Rectangle, + cursor_position: Point, + style: &<Self as Renderer>::Style, + primitive: Self::Output, + ) -> Self::Output; + + fn draw<T: ToString>( + &mut self, + bounds: Rectangle, + cursor_position: Point, + options: &[T], + hovered_option: Option<usize>, + padding: u16, + text_size: u16, + font: Self::Font, + style: &<Self as Renderer>::Style, + ) -> Self::Output; +} + +impl<'a, T, Message, Renderer> Into<Element<'a, Message, Renderer>> + for List<'a, T, Message, Renderer> +where + T: ToString + Clone, + Message: 'a, + Renderer: 'a + self::Renderer, +{ + fn into(self) -> Element<'a, Message, Renderer> { + Element::new(self) + } +} diff --git a/native/src/program/state.rs b/native/src/program/state.rs index fdc42e8b..95e6b60c 100644 --- a/native/src/program/state.rs +++ b/native/src/program/state.rs @@ -35,7 +35,7 @@ where renderer: &mut P::Renderer, debug: &mut Debug, ) -> Self { - let user_interface = build_user_interface( + let mut user_interface = build_user_interface( &mut program, Cache::default(), renderer, @@ -121,12 +121,14 @@ where debug.event_processing_started(); let mut messages = user_interface.update( - self.queued_events.drain(..), + &self.queued_events, cursor_position, clipboard, renderer, ); messages.extend(self.queued_messages.drain(..)); + + self.queued_events.clear(); debug.event_processing_finished(); if messages.is_empty() { @@ -153,7 +155,7 @@ where command })); - let user_interface = build_user_interface( + let mut user_interface = build_user_interface( &mut self.program, temp_cache, renderer, diff --git a/native/src/renderer.rs b/native/src/renderer.rs index a16df72b..29a091a4 100644 --- a/native/src/renderer.rs +++ b/native/src/renderer.rs @@ -25,7 +25,7 @@ mod null; #[cfg(debug_assertions)] pub use null::Null; -use crate::{layout, Element}; +use crate::{layout, Element, Rectangle}; /// A component that can take the state of a user interface and produce an /// output for its users. @@ -56,4 +56,11 @@ pub trait Renderer: Sized { ) -> layout::Node { element.layout(self, limits) } + + fn overlay( + &mut self, + base: Self::Output, + overlay: Self::Output, + overlay_bounds: Rectangle, + ) -> Self::Output; } diff --git a/native/src/renderer/null.rs b/native/src/renderer/null.rs index 580f58f8..07f79319 100644 --- a/native/src/renderer/null.rs +++ b/native/src/renderer/null.rs @@ -23,6 +23,9 @@ impl Null { impl Renderer for Null { type Output = (); type Defaults = (); + + fn overlay(&mut self, _base: (), _overlay: (), _overlay_bounds: Rectangle) { + } } impl column::Renderer for Null { diff --git a/native/src/user_interface.rs b/native/src/user_interface.rs index b9646043..6e56f357 100644 --- a/native/src/user_interface.rs +++ b/native/src/user_interface.rs @@ -1,4 +1,4 @@ -use crate::{layout, Clipboard, Element, Event, Layout, Point, Size}; +use crate::{layout, Clipboard, Element, Event, Layout, Overlay, Point, Size}; use std::hash::Hasher; @@ -19,9 +19,9 @@ use std::hash::Hasher; /// [`UserInterface`]: struct.UserInterface.html #[allow(missing_debug_implementations)] pub struct UserInterface<'a, Message, Renderer> { - hash: u64, root: Element<'a, Message, Renderer>, - layout: layout::Node, + base: Layer, + overlay: Option<Layer>, bounds: Size, } @@ -94,25 +94,36 @@ where ) -> Self { let root = root.into(); - let hash = { - let hasher = &mut crate::Hasher::default(); - root.hash_layout(hasher); + let (base, overlay) = { + let hash = { + let hasher = &mut crate::Hasher::default(); + root.hash_layout(hasher); - hasher.finish() - }; + hasher.finish() + }; - let layout_is_cached = hash == cache.hash && bounds == cache.bounds; + let layout_is_cached = + hash == cache.base.hash && bounds == cache.bounds; - let layout = if layout_is_cached { - cache.layout - } else { - renderer.layout(&root, &layout::Limits::new(Size::ZERO, bounds)) + let (layout, overlay) = if layout_is_cached { + (cache.base.layout, cache.overlay) + } else { + ( + renderer.layout( + &root, + &layout::Limits::new(Size::ZERO, bounds), + ), + None, + ) + }; + + (Layer { layout, hash }, overlay) }; UserInterface { - hash, root, - layout, + base, + overlay, bounds, } } @@ -169,7 +180,7 @@ where /// /// // Update the user interface /// let messages = user_interface.update( - /// events.drain(..), + /// &events, /// cursor_position, /// None, /// &renderer, @@ -185,18 +196,54 @@ where /// ``` pub fn update( &mut self, - events: impl IntoIterator<Item = Event>, + events: &[Event], cursor_position: Point, clipboard: Option<&dyn Clipboard>, renderer: &Renderer, ) -> Vec<Message> { let mut messages = Vec::new(); + let base_cursor = if let Some(mut overlay) = + self.root.overlay(Layout::new(&self.base.layout)) + { + let layer = Self::overlay_layer( + self.overlay.take(), + self.bounds, + &mut overlay, + renderer, + ); + + for event in events { + overlay.on_event( + event.clone(), + Layout::new(&layer.layout), + cursor_position, + &mut messages, + renderer, + clipboard, + ); + } + + let base_cursor = if layer.layout.bounds().contains(cursor_position) + { + // TODO: Type-safe cursor availability + Point::new(-1.0, -1.0) + } else { + cursor_position + }; + + self.overlay = Some(layer); + + base_cursor + } else { + cursor_position + }; + for event in events { self.root.widget.on_event( - event, - Layout::new(&self.layout), - cursor_position, + event.clone(), + Layout::new(&self.base.layout), + base_cursor, &mut messages, renderer, clipboard, @@ -256,7 +303,7 @@ where /// ); /// /// let messages = user_interface.update( - /// events.drain(..), + /// &events, /// cursor_position, /// None, /// &renderer, @@ -276,16 +323,63 @@ where /// } /// ``` pub fn draw( - &self, + &mut self, renderer: &mut Renderer, cursor_position: Point, ) -> Renderer::Output { - self.root.widget.draw( - renderer, - &Renderer::Defaults::default(), - Layout::new(&self.layout), - cursor_position, - ) + let overlay = if let Some(mut overlay) = + self.root.overlay(Layout::new(&self.base.layout)) + { + let layer = Self::overlay_layer( + self.overlay.take(), + self.bounds, + &mut overlay, + renderer, + ); + + let overlay_bounds = layer.layout.bounds(); + + let overlay_primitives = overlay.draw( + renderer, + &Renderer::Defaults::default(), + Layout::new(&layer.layout), + cursor_position, + ); + + self.overlay = Some(layer); + + Some((overlay_primitives, overlay_bounds)) + } else { + None + }; + + if let Some((overlay_primitives, overlay_bounds)) = overlay { + let base_cursor = if overlay_bounds.contains(cursor_position) { + Point::new(-1.0, -1.0) + } else { + cursor_position + }; + + let base_primitives = self.root.widget.draw( + renderer, + &Renderer::Defaults::default(), + Layout::new(&self.base.layout), + base_cursor, + ); + + renderer.overlay( + base_primitives, + overlay_primitives, + overlay_bounds, + ) + } else { + self.root.widget.draw( + renderer, + &Renderer::Defaults::default(), + Layout::new(&self.base.layout), + cursor_position, + ) + } } /// Extract the [`Cache`] of the [`UserInterface`], consuming it in the @@ -295,11 +389,41 @@ where /// [`UserInterface`]: struct.UserInterface.html pub fn into_cache(self) -> Cache { Cache { - hash: self.hash, - layout: self.layout, + base: self.base, + overlay: self.overlay, bounds: self.bounds, } } + + fn overlay_layer( + cache: Option<Layer>, + bounds: Size, + overlay: &mut Overlay<'_, Message, Renderer>, + renderer: &Renderer, + ) -> Layer { + let new_hash = { + let hasher = &mut crate::Hasher::default(); + overlay.hash_layout(hasher); + + hasher.finish() + }; + + let layout = match cache { + Some(Layer { hash, layout }) if new_hash == hash => layout, + _ => overlay.layout(renderer, bounds), + }; + + Layer { + layout, + hash: new_hash, + } + } +} + +#[derive(Debug, Clone)] +struct Layer { + layout: layout::Node, + hash: u64, } /// Reusable data of a specific [`UserInterface`]. @@ -307,8 +431,8 @@ where /// [`UserInterface`]: struct.UserInterface.html #[derive(Debug, Clone)] pub struct Cache { - hash: u64, - layout: layout::Node, + base: Layer, + overlay: Option<Layer>, bounds: Size, } @@ -322,8 +446,11 @@ impl Cache { /// [`UserInterface`]: struct.UserInterface.html pub fn new() -> Cache { Cache { - hash: 0, - layout: layout::Node::new(Size::new(0.0, 0.0)), + base: Layer { + layout: layout::Node::new(Size::new(0.0, 0.0)), + hash: 0, + }, + overlay: None, bounds: Size::ZERO, } } @@ -334,11 +461,3 @@ impl Default for Cache { Cache::new() } } - -impl PartialEq for Cache { - fn eq(&self, other: &Cache) -> bool { - self.hash == other.hash - } -} - -impl Eq for Cache {} diff --git a/native/src/widget.rs b/native/src/widget.rs index 4453145b..4bca7722 100644 --- a/native/src/widget.rs +++ b/native/src/widget.rs @@ -23,6 +23,7 @@ pub mod button; pub mod checkbox; pub mod column; +pub mod combo_box; pub mod container; pub mod image; pub mod pane_grid; @@ -43,6 +44,8 @@ pub use checkbox::Checkbox; #[doc(no_inline)] pub use column::Column; #[doc(no_inline)] +pub use combo_box::ComboBox; +#[doc(no_inline)] pub use container::Container; #[doc(no_inline)] pub use image::Image; @@ -67,7 +70,7 @@ pub use text::Text; #[doc(no_inline)] pub use text_input::TextInput; -use crate::{layout, Clipboard, Event, Hasher, Layout, Length, Point}; +use crate::{layout, Clipboard, Event, Hasher, Layout, Length, Overlay, Point}; /// A component that displays information and allows interaction. /// @@ -94,7 +97,7 @@ use crate::{layout, Clipboard, Event, Hasher, Layout, Length, Point}; /// [`geometry`]: https://github.com/hecrj/iced/tree/0.1/examples/geometry /// [`lyon`]: https://github.com/nical/lyon /// [`iced_wgpu`]: https://github.com/hecrj/iced/tree/0.1/wgpu -pub trait Widget<Message, Renderer> +pub trait Widget<'a, Message, Renderer> where Renderer: crate::Renderer, { @@ -175,4 +178,11 @@ where _clipboard: Option<&dyn Clipboard>, ) { } + + fn overlay<'b>( + &'b mut self, + _layout: Layout<'_>, + ) -> Option<Overlay<'b, Message, Renderer>> { + None + } } diff --git a/native/src/widget/button.rs b/native/src/widget/button.rs index c932da2b..72db808b 100644 --- a/native/src/widget/button.rs +++ b/native/src/widget/button.rs @@ -139,7 +139,7 @@ impl State { } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Button<'a, Message, Renderer> where Renderer: self::Renderer, diff --git a/native/src/widget/checkbox.rs b/native/src/widget/checkbox.rs index 44962288..82fd6d1f 100644 --- a/native/src/widget/checkbox.rs +++ b/native/src/widget/checkbox.rs @@ -106,7 +106,7 @@ impl<Message, Renderer: self::Renderer + text::Renderer> } } -impl<Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Checkbox<Message, Renderer> where Renderer: self::Renderer + text::Renderer + row::Renderer, diff --git a/native/src/widget/column.rs b/native/src/widget/column.rs index 259a7e6e..e83ef93d 100644 --- a/native/src/widget/column.rs +++ b/native/src/widget/column.rs @@ -2,8 +2,8 @@ use std::hash::Hash; use crate::{ - layout, Align, Clipboard, Element, Event, Hasher, Layout, Length, Point, - Widget, + layout, Align, Clipboard, Element, Event, Hasher, Layout, Length, Overlay, + Point, Widget, }; use std::u32; @@ -121,7 +121,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> { } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Column<'a, Message, Renderer> where Renderer: self::Renderer, @@ -204,6 +204,17 @@ where child.widget.hash_layout(state); } } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, Message, Renderer>> { + self.children + .iter_mut() + .zip(layout.children()) + .filter_map(|(child, layout)| child.widget.overlay(layout)) + .next() + } } /// The renderer of a [`Column`]. diff --git a/native/src/widget/combo_box.rs b/native/src/widget/combo_box.rs new file mode 100644 index 00000000..9447b9dd --- /dev/null +++ b/native/src/widget/combo_box.rs @@ -0,0 +1,282 @@ +use crate::{ + layout, mouse, + overlay::menu::{self, Menu}, + scrollable, text, Clipboard, Element, Event, Hasher, Layout, Length, + Overlay, Point, Rectangle, Size, Widget, +}; +use std::borrow::Cow; + +pub struct ComboBox<'a, T, Message, Renderer: self::Renderer> +where + [T]: ToOwned<Owned = Vec<T>>, +{ + menu: &'a mut menu::State, + on_selected: Box<dyn Fn(T) -> Message>, + options: Cow<'a, [T]>, + selected: Option<T>, + width: Length, + padding: u16, + text_size: Option<u16>, + font: Renderer::Font, + style: <Renderer as self::Renderer>::Style, + is_open: bool, +} + +#[derive(Default)] +pub struct State { + menu: menu::State, +} + +impl<'a, T: 'a, Message, Renderer: self::Renderer> + ComboBox<'a, T, Message, Renderer> +where + T: ToString, + [T]: ToOwned<Owned = Vec<T>>, +{ + pub fn new( + state: &'a mut State, + options: impl Into<Cow<'a, [T]>>, + selected: Option<T>, + on_selected: impl Fn(T) -> Message + 'static, + ) -> Self { + let is_open = state.menu.is_open(); + + Self { + menu: &mut state.menu, + on_selected: Box::new(on_selected), + options: options.into(), + selected, + width: Length::Shrink, + text_size: None, + padding: Renderer::DEFAULT_PADDING, + font: Default::default(), + style: Default::default(), + is_open, + } + } + + /// Sets the width of the [`ComboBox`]. + /// + /// [`ComboBox`]: struct.Button.html + pub fn width(mut self, width: Length) -> Self { + self.width = width; + self + } + + /// Sets the padding of the [`ComboBox`]. + /// + /// [`ComboBox`]: struct.Button.html + pub fn padding(mut self, padding: u16) -> Self { + self.padding = padding; + self + } + + pub fn text_size(mut self, size: u16) -> Self { + self.text_size = Some(size); + self + } + + pub fn font(mut self, font: Renderer::Font) -> Self { + self.font = font; + self + } + + /// Sets the style of the [`ComboBox`]. + /// + /// [`ComboBox`]: struct.ComboBox.html + pub fn style( + mut self, + style: impl Into<<Renderer as self::Renderer>::Style>, + ) -> Self { + self.style = style.into(); + self + } +} + +impl<'a, T: 'a, Message, Renderer> Widget<'a, Message, Renderer> + for ComboBox<'a, T, Message, Renderer> +where + T: Clone + ToString + Eq, + [T]: ToOwned<Owned = Vec<T>>, + Message: 'static, + Renderer: self::Renderer + scrollable::Renderer + 'a, +{ + fn width(&self) -> Length { + Length::Shrink + } + + fn height(&self) -> Length { + Length::Shrink + } + + fn layout( + &self, + renderer: &Renderer, + limits: &layout::Limits, + ) -> layout::Node { + use std::f32; + + let limits = limits + .width(self.width) + .height(Length::Shrink) + .pad(f32::from(self.padding)); + + let text_size = self.text_size.unwrap_or(renderer.default_size()); + + let max_width = match self.width { + Length::Shrink => { + let labels = self.options.iter().map(ToString::to_string); + + labels + .map(|label| { + let (width, _) = renderer.measure( + &label, + text_size, + Renderer::Font::default(), + Size::new(f32::INFINITY, f32::INFINITY), + ); + + width.round() as u32 + }) + .max() + .unwrap_or(100) + } + _ => 0, + }; + + let size = { + let intrinsic = Size::new( + max_width as f32 + + f32::from(text_size) + + f32::from(self.padding), + f32::from(text_size), + ); + + limits.resolve(intrinsic).pad(f32::from(self.padding)) + }; + + layout::Node::new(size) + } + + fn hash_layout(&self, state: &mut Hasher) { + use std::hash::Hash as _; + + match self.width { + Length::Shrink => { + self.options + .iter() + .map(ToString::to_string) + .for_each(|label| label.hash(state)); + } + _ => { + self.width.hash(state); + } + } + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + _messages: &mut Vec<Message>, + _renderer: &Renderer, + _clipboard: Option<&dyn Clipboard>, + ) { + if !self.is_open { + match event { + Event::Mouse(mouse::Event::ButtonPressed( + mouse::Button::Left, + )) => { + if layout.bounds().contains(cursor_position) { + let selected = self.selected.as_ref(); + + self.menu.open( + self.options + .iter() + .position(|option| Some(option) == selected), + ); + } + } + _ => {} + } + } + } + + fn draw( + &self, + renderer: &mut Renderer, + _defaults: &Renderer::Defaults, + layout: Layout<'_>, + cursor_position: Point, + ) -> Renderer::Output { + self::Renderer::draw( + renderer, + layout.bounds(), + cursor_position, + self.selected.as_ref().map(ToString::to_string), + self.padding, + self.text_size.unwrap_or(renderer.default_size()), + self.font, + &self.style, + ) + } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, Message, Renderer>> { + if self.menu.is_open() { + let bounds = layout.bounds(); + + let mut menu = + Menu::new(&mut self.menu, &self.options, &self.on_selected) + .width(bounds.width.round() as u16) + .padding(self.padding) + .font(self.font) + .style(Renderer::menu_style(&self.style)); + + if let Some(text_size) = self.text_size { + menu = menu.text_size(text_size); + } + + Some(menu.overlay(layout.position(), bounds.height)) + } else { + None + } + } +} + +pub trait Renderer: text::Renderer + menu::Renderer { + type Style: Default; + + const DEFAULT_PADDING: u16; + + fn menu_style( + style: &<Self as Renderer>::Style, + ) -> <Self as menu::Renderer>::Style; + + fn draw( + &mut self, + bounds: Rectangle, + cursor_position: Point, + selected: Option<String>, + padding: u16, + text_size: u16, + font: Self::Font, + style: &<Self as Renderer>::Style, + ) -> Self::Output; +} + +impl<'a, T: 'a, Message, Renderer> Into<Element<'a, Message, Renderer>> + for ComboBox<'a, T, Message, Renderer> +where + T: Clone + ToString + Eq, + [T]: ToOwned<Owned = Vec<T>>, + Renderer: self::Renderer + 'a, + Message: 'static, +{ + fn into(self) -> Element<'a, Message, Renderer> { + Element::new(self) + } +} diff --git a/native/src/widget/container.rs b/native/src/widget/container.rs index 2590fe3b..4ab10837 100644 --- a/native/src/widget/container.rs +++ b/native/src/widget/container.rs @@ -2,8 +2,8 @@ use std::hash::Hash; use crate::{ - layout, Align, Clipboard, Element, Event, Hasher, Layout, Length, Point, - Rectangle, Widget, + layout, Align, Clipboard, Element, Event, Hasher, Layout, Length, Overlay, + Point, Rectangle, Widget, }; use std::u32; @@ -129,7 +129,7 @@ where } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Container<'a, Message, Renderer> where Renderer: self::Renderer, @@ -214,6 +214,13 @@ where self.content.hash_layout(state); } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, Message, Renderer>> { + self.content.overlay(layout.children().next().unwrap()) + } } /// The renderer of a [`Container`]. diff --git a/native/src/widget/image.rs b/native/src/widget/image.rs index 132f249d..b7c8f4ff 100644 --- a/native/src/widget/image.rs +++ b/native/src/widget/image.rs @@ -54,7 +54,7 @@ impl Image { } } -impl<Message, Renderer> Widget<Message, Renderer> for Image +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Image where Renderer: self::Renderer, { diff --git a/native/src/widget/pane_grid.rs b/native/src/widget/pane_grid.rs index c472d043..8fc423af 100644 --- a/native/src/widget/pane_grid.rs +++ b/native/src/widget/pane_grid.rs @@ -402,7 +402,7 @@ pub struct KeyPressEvent { pub modifiers: keyboard::ModifiersState, } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for PaneGrid<'a, Message, Renderer> where Renderer: self::Renderer + container::Renderer, diff --git a/native/src/widget/progress_bar.rs b/native/src/widget/progress_bar.rs index 5ab76d47..93d86371 100644 --- a/native/src/widget/progress_bar.rs +++ b/native/src/widget/progress_bar.rs @@ -70,7 +70,8 @@ impl<Renderer: self::Renderer> ProgressBar<Renderer> { } } -impl<Message, Renderer> Widget<Message, Renderer> for ProgressBar<Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> + for ProgressBar<Renderer> where Renderer: self::Renderer, { diff --git a/native/src/widget/radio.rs b/native/src/widget/radio.rs index 5b8d00e9..0d88c740 100644 --- a/native/src/widget/radio.rs +++ b/native/src/widget/radio.rs @@ -121,7 +121,8 @@ impl<Message, Renderer: self::Renderer + text::Renderer> } } -impl<Message, Renderer> Widget<Message, Renderer> for Radio<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> + for Radio<Message, Renderer> where Renderer: self::Renderer + text::Renderer + row::Renderer, Message: Clone, diff --git a/native/src/widget/row.rs b/native/src/widget/row.rs index 31f7472f..1cfe2d66 100644 --- a/native/src/widget/row.rs +++ b/native/src/widget/row.rs @@ -2,8 +2,8 @@ use std::hash::Hash; use crate::{ - layout, Align, Clipboard, Element, Event, Hasher, Layout, Length, Point, - Widget, + layout, Align, Clipboard, Element, Event, Hasher, Layout, Length, Overlay, + Point, Widget, }; use std::u32; @@ -122,7 +122,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> { } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Row<'a, Message, Renderer> where Renderer: self::Renderer, @@ -206,6 +206,17 @@ where child.widget.hash_layout(state); } } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, Message, Renderer>> { + self.children + .iter_mut() + .zip(layout.children()) + .filter_map(|(child, layout)| child.widget.overlay(layout)) + .next() + } } /// The renderer of a [`Row`]. diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index 3c8e5e5b..87871e28 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -1,7 +1,7 @@ //! Navigate an endless amount of content with a scrollbar. use crate::{ column, layout, mouse, Align, Clipboard, Column, Element, Event, Hasher, - Layout, Length, Point, Rectangle, Size, Widget, + Layout, Length, Overlay, Point, Rectangle, Size, Vector, Widget, }; use std::{f32, hash::Hash, u32}; @@ -110,10 +110,10 @@ impl<'a, Message, Renderer: self::Renderer> Scrollable<'a, Message, Renderer> { } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Scrollable<'a, Message, Renderer> where - Renderer: self::Renderer + column::Renderer, + Renderer: self::Renderer, { fn width(&self) -> Length { Widget::<Message, Renderer>::width(&self.content) @@ -315,6 +315,24 @@ where self.content.hash_layout(state) } + + fn overlay( + &mut self, + layout: Layout<'_>, + ) -> Option<Overlay<'_, Message, Renderer>> { + let Self { content, state, .. } = self; + + content + .overlay(layout.children().next().unwrap()) + .map(|overlay| { + let bounds = layout.bounds(); + let content_layout = layout.children().next().unwrap(); + let content_bounds = content_layout.bounds(); + let offset = state.offset(bounds, content_bounds); + + overlay.translate(Vector::new(0.0, -(offset as f32))) + }) + } } /// The local state of a [`Scrollable`]. @@ -454,7 +472,7 @@ pub struct Scroller { /// /// [`Scrollable`]: struct.Scrollable.html /// [renderer]: ../../renderer/index.html -pub trait Renderer: crate::Renderer + Sized { +pub trait Renderer: column::Renderer + Sized { /// The style supported by this renderer. type Style: Default; @@ -502,7 +520,7 @@ pub trait Renderer: crate::Renderer + Sized { impl<'a, Message, Renderer> From<Scrollable<'a, Message, Renderer>> for Element<'a, Message, Renderer> where - Renderer: 'a + self::Renderer + column::Renderer, + Renderer: 'a + self::Renderer, Message: 'a, { fn from( diff --git a/native/src/widget/slider.rs b/native/src/widget/slider.rs index 70f2b6ac..e0193342 100644 --- a/native/src/widget/slider.rs +++ b/native/src/widget/slider.rs @@ -154,7 +154,7 @@ impl State { } } -impl<'a, T, Message, Renderer> Widget<Message, Renderer> +impl<'a, T, Message, Renderer> Widget<'a, Message, Renderer> for Slider<'a, T, Message, Renderer> where T: Copy + Into<f64> + num_traits::FromPrimitive, diff --git a/native/src/widget/space.rs b/native/src/widget/space.rs index e56a8fe1..8ada40ed 100644 --- a/native/src/widget/space.rs +++ b/native/src/widget/space.rs @@ -43,7 +43,7 @@ impl Space { } } -impl<'a, Message, Renderer> Widget<Message, Renderer> for Space +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Space where Renderer: self::Renderer, { diff --git a/native/src/widget/svg.rs b/native/src/widget/svg.rs index 114d5e41..3e45aaf6 100644 --- a/native/src/widget/svg.rs +++ b/native/src/widget/svg.rs @@ -60,7 +60,7 @@ impl Svg { } } -impl<Message, Renderer> Widget<Message, Renderer> for Svg +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Svg where Renderer: self::Renderer, { diff --git a/native/src/widget/text.rs b/native/src/widget/text.rs index 48a69e34..7f75eb9c 100644 --- a/native/src/widget/text.rs +++ b/native/src/widget/text.rs @@ -112,7 +112,7 @@ impl<Renderer: self::Renderer> Text<Renderer> { } } -impl<Message, Renderer> Widget<Message, Renderer> for Text<Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for Text<Renderer> where Renderer: self::Renderer, { diff --git a/native/src/widget/text_input.rs b/native/src/widget/text_input.rs index 3f415101..63be6019 100644 --- a/native/src/widget/text_input.rs +++ b/native/src/widget/text_input.rs @@ -165,7 +165,7 @@ impl<'a, Message, Renderer: self::Renderer> TextInput<'a, Message, Renderer> { } } -impl<'a, Message, Renderer> Widget<Message, Renderer> +impl<'a, Message, Renderer> Widget<'a, Message, Renderer> for TextInput<'a, Message, Renderer> where Renderer: self::Renderer, diff --git a/src/widget.rs b/src/widget.rs index 007bd531..034f02cd 100644 --- a/src/widget.rs +++ b/src/widget.rs @@ -19,7 +19,7 @@ #[cfg(not(target_arch = "wasm32"))] mod platform { pub use crate::renderer::widget::{ - button, checkbox, container, pane_grid, progress_bar, radio, + button, checkbox, combo_box, container, pane_grid, progress_bar, radio, scrollable, slider, text_input, Column, Row, Space, Text, }; @@ -44,10 +44,10 @@ mod platform { #[doc(no_inline)] pub use { - button::Button, checkbox::Checkbox, container::Container, image::Image, - pane_grid::PaneGrid, progress_bar::ProgressBar, radio::Radio, - scrollable::Scrollable, slider::Slider, svg::Svg, - text_input::TextInput, + button::Button, checkbox::Checkbox, combo_box::ComboBox, + container::Container, image::Image, pane_grid::PaneGrid, + progress_bar::ProgressBar, radio::Radio, scrollable::Scrollable, + slider::Slider, svg::Svg, text_input::TextInput, }; #[cfg(any(feature = "canvas", feature = "glow_canvas"))] diff --git a/style/src/combo_box.rs b/style/src/combo_box.rs new file mode 100644 index 00000000..4d0c4e46 --- /dev/null +++ b/style/src/combo_box.rs @@ -0,0 +1,70 @@ +use crate::menu; +use iced_core::{Background, Color}; + +/// The appearance of a combo box. +#[derive(Debug, Clone, Copy)] +pub struct Style { + pub text_color: Color, + pub background: Background, + pub border_radius: u16, + pub border_width: u16, + pub border_color: Color, + pub icon_size: f32, +} + +impl std::default::Default for Style { + fn default() -> Self { + Self { + text_color: Color::BLACK, + background: Background::Color([0.87, 0.87, 0.87].into()), + border_radius: 0, + border_width: 1, + border_color: [0.7, 0.7, 0.7].into(), + icon_size: 0.7, + } + } +} + +/// A set of rules that dictate the style of a container. +pub trait StyleSheet { + fn menu(&self) -> menu::Style; + + fn active(&self) -> Style; + + /// Produces the style of a container. + fn hovered(&self) -> Style; +} + +struct Default; + +impl StyleSheet for Default { + fn menu(&self) -> menu::Style { + menu::Style::default() + } + + fn active(&self) -> Style { + Style::default() + } + + fn hovered(&self) -> Style { + Style { + border_color: Color::BLACK, + ..self.active() + } + } +} + +impl std::default::Default for Box<dyn StyleSheet> { + fn default() -> Self { + Box::new(Default) + } +} + +impl<T> From<T> for Box<dyn StyleSheet> +where + T: 'static + StyleSheet, +{ + fn from(style: T) -> Self { + Box::new(style) + } +} diff --git a/style/src/lib.rs b/style/src/lib.rs index 72d83aec..b19d6600 100644 --- a/style/src/lib.rs +++ b/style/src/lib.rs @@ -6,7 +6,9 @@ pub use iced_core::{Background, Color}; pub mod button; pub mod checkbox; +pub mod combo_box; pub mod container; +pub mod menu; pub mod progress_bar; pub mod radio; pub mod scrollable; diff --git a/style/src/menu.rs b/style/src/menu.rs new file mode 100644 index 00000000..e8321dc7 --- /dev/null +++ b/style/src/menu.rs @@ -0,0 +1,25 @@ +use iced_core::{Background, Color}; + +/// The appearance of a menu. +#[derive(Debug, Clone, Copy)] +pub struct Style { + pub text_color: Color, + pub background: Background, + pub border_width: u16, + pub border_color: Color, + pub selected_text_color: Color, + pub selected_background: Background, +} + +impl std::default::Default for Style { + fn default() -> Self { + Self { + text_color: Color::BLACK, + background: Background::Color([0.87, 0.87, 0.87].into()), + border_width: 1, + border_color: [0.7, 0.7, 0.7].into(), + selected_text_color: Color::WHITE, + selected_background: Background::Color([0.4, 0.4, 1.0].into()), + } + } +} diff --git a/wgpu/src/backend.rs b/wgpu/src/backend.rs index a25f42f7..c71a6a77 100644 --- a/wgpu/src/backend.rs +++ b/wgpu/src/backend.rs @@ -248,6 +248,7 @@ impl iced_graphics::Backend for Backend { impl backend::Text for Backend { const ICON_FONT: Font = font::ICONS; const CHECKMARK_ICON: char = font::CHECKMARK_ICON; + const ARROW_DOWN_ICON: char = font::ARROW_DOWN_ICON; fn default_size(&self) -> u16 { self.default_text_size diff --git a/wgpu/src/lib.rs b/wgpu/src/lib.rs index e51a225c..0186b007 100644 --- a/wgpu/src/lib.rs +++ b/wgpu/src/lib.rs @@ -20,7 +20,7 @@ //! [`wgpu`]: https://github.com/gfx-rs/wgpu-rs //! [WebGPU API]: https://gpuweb.github.io/gpuweb/ //! [`wgpu_glyph`]: https://github.com/hecrj/wgpu_glyph -#![deny(missing_docs)] +//#![deny(missing_docs)] #![deny(missing_debug_implementations)] #![deny(unused_results)] #![forbid(unsafe_code)] diff --git a/wgpu/src/widget.rs b/wgpu/src/widget.rs index d17b7a5d..0f390c8d 100644 --- a/wgpu/src/widget.rs +++ b/wgpu/src/widget.rs @@ -11,6 +11,7 @@ use crate::Renderer; pub mod button; pub mod checkbox; +pub mod combo_box; pub mod container; pub mod pane_grid; pub mod progress_bar; @@ -24,6 +25,8 @@ pub use button::Button; #[doc(no_inline)] pub use checkbox::Checkbox; #[doc(no_inline)] +pub use combo_box::ComboBox; +#[doc(no_inline)] pub use container::Container; #[doc(no_inline)] pub use pane_grid::PaneGrid; diff --git a/wgpu/src/widget/combo_box.rs b/wgpu/src/widget/combo_box.rs new file mode 100644 index 00000000..bfface29 --- /dev/null +++ b/wgpu/src/widget/combo_box.rs @@ -0,0 +1,8 @@ +pub use iced_native::combo_box::State; + +pub use iced_graphics::combo_box::{Style, StyleSheet}; +pub use iced_graphics::overlay::menu::Style as Menu; + +/// A widget allowing the selection of a single value from a list of options. +pub type ComboBox<'a, T, Message> = + iced_native::ComboBox<'a, T, Message, crate::Renderer>; |