From 2b7ad3d50eae48b1963aa8e866e184c41133ca3d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A9ctor=20Ram=C3=B3n=20Jim=C3=A9nez?= Date: Sat, 20 Jul 2019 19:12:31 +0200 Subject: [PATCH] Decouple `iced` from `coffee` --- .travis.yml | 10 ++ Cargo.toml | 5 +- rustfmt.toml | 1 + src/element.rs | 222 ++++++++++++++++++++++++++ src/event.rs | 11 ++ src/hasher.rs | 2 + src/input.rs | 6 + src/input/button_state.rs | 5 + src/input/keyboard.rs | 5 + src/input/keyboard/event.rs | 21 +++ src/input/keyboard/key_code.rs | 197 +++++++++++++++++++++++ src/input/mouse.rs | 5 + src/input/mouse/button.rs | 7 + src/input/mouse/event.rs | 39 +++++ src/interface.rs | 77 +++++++++ src/layout.rs | 55 +++++++ src/lib.rs | 44 +++++- src/mouse_cursor.rs | 21 +++ src/node.rs | 60 +++++++ src/point.rs | 1 + src/rectangle.rs | 30 ++++ src/renderer.rs | 15 ++ src/style.rs | 260 ++++++++++++++++++++++++++++++ src/vector.rs | 2 + src/widget.rs | 103 ++++++++++++ src/widget/button.rs | 281 +++++++++++++++++++++++++++++++++ src/widget/checkbox.rs | 213 +++++++++++++++++++++++++ src/widget/column.rs | 223 ++++++++++++++++++++++++++ src/widget/panel.rs | 94 +++++++++++ src/widget/radio.rs | 219 +++++++++++++++++++++++++ src/widget/row.rs | 218 +++++++++++++++++++++++++ src/widget/slider.rs | 240 ++++++++++++++++++++++++++++ src/widget/text.rs | 223 ++++++++++++++++++++++++++ 33 files changed, 2907 insertions(+), 8 deletions(-) create mode 100644 .travis.yml create mode 100644 rustfmt.toml create mode 100644 src/element.rs create mode 100644 src/event.rs create mode 100644 src/hasher.rs create mode 100644 src/input.rs create mode 100644 src/input/button_state.rs create mode 100644 src/input/keyboard.rs create mode 100644 src/input/keyboard/event.rs create mode 100644 src/input/keyboard/key_code.rs create mode 100644 src/input/mouse.rs create mode 100644 src/input/mouse/button.rs create mode 100644 src/input/mouse/event.rs create mode 100644 src/interface.rs create mode 100644 src/layout.rs create mode 100644 src/mouse_cursor.rs create mode 100644 src/node.rs create mode 100644 src/point.rs create mode 100644 src/rectangle.rs create mode 100644 src/renderer.rs create mode 100644 src/style.rs create mode 100644 src/vector.rs create mode 100644 src/widget.rs create mode 100644 src/widget/button.rs create mode 100644 src/widget/checkbox.rs create mode 100644 src/widget/column.rs create mode 100644 src/widget/panel.rs create mode 100644 src/widget/radio.rs create mode 100644 src/widget/row.rs create mode 100644 src/widget/slider.rs create mode 100644 src/widget/text.rs diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 00000000..5f435e8a --- /dev/null +++ b/.travis.yml @@ -0,0 +1,10 @@ +language: rust +rust: + - stable + - beta + - nightly +matrix: + allow_failures: + - rust: nightly + fast_finish: true +cache: cargo diff --git a/Cargo.toml b/Cargo.toml index a021b5e8..7f6b67c1 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -3,7 +3,7 @@ name = "iced" version = "0.0.0" authors = ["Héctor Ramón Jiménez "] edition = "2018" -description = "A simple GUI runtime inspired by Elm" +description = "A customizable GUI runtime, inspired by Elm." license = "MIT" repository = "https://github.com/hecrj/iced" documentation = "https://docs.rs/iced" @@ -12,3 +12,6 @@ keywords = ["gui", "ui", "graphics", "interface", "widgets"] categories = ["gui"] [dependencies] +stretch = "0.2" +nalgebra = "0.18" +twox-hash = "1.3" diff --git a/rustfmt.toml b/rustfmt.toml new file mode 100644 index 00000000..d979d317 --- /dev/null +++ b/rustfmt.toml @@ -0,0 +1 @@ +max_width=80 diff --git a/src/element.rs b/src/element.rs new file mode 100644 index 00000000..6bc0ad74 --- /dev/null +++ b/src/element.rs @@ -0,0 +1,222 @@ +use stretch::{geometry, result}; + +use crate::{Event, Hasher, Layout, MouseCursor, Node, Point, Widget}; + +/// A generic [`Widget`]. +/// +/// If you have a widget, you should be able to use `widget.into()` to turn it +/// into an [`Element`]. +/// +/// [`Widget`]: trait.Widget.html +/// [`Element`]: struct.Element.html +pub struct Element<'a, Message, Renderer> { + pub(crate) widget: Box + 'a>, +} + +impl<'a, Message, Renderer> std::fmt::Debug for Element<'a, Message, Renderer> { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Element") + .field("widget", &self.widget) + .finish() + } +} + +impl<'a, Message, Renderer> Element<'a, Message, Renderer> { + /// Create a new [`Element`] containing the given [`Widget`]. + /// + /// [`Element`]: struct.Element.html + /// [`Widget`]: trait.Widget.html + pub fn new( + widget: impl Widget + 'a, + ) -> Element<'a, Message, Renderer> { + Element { + widget: Box::new(widget), + } + } + + /// Applies a transformation to the produced message of the [`Element`]. + /// + /// This method is useful when you want to decouple different parts of your + /// UI. + /// + /// [`Element`]: struct.Element.html + /// + /// # Example + /// TODO + pub fn map(self, f: F) -> Element<'a, B, Renderer> + where + Message: 'static + Copy, + Renderer: 'a, + B: 'static, + F: 'static + Fn(Message) -> B, + { + Element { + widget: Box::new(Map::new(self.widget, f)), + } + } + + /// Marks the [`Element`] as _to-be-explained_. + /// + /// The [`Renderer`] will explain the layout of the [`Element`] graphically. + /// This can be very useful for debugging your layout! + /// + /// [`Element`]: struct.Element.html + /// [`Renderer`]: trait.Renderer.html + pub fn explain( + self, + color: Renderer::Color, + ) -> Element<'a, Message, Renderer> + where + Message: 'static, + Renderer: 'a + crate::Renderer, + { + Element { + widget: Box::new(Explain::new(self, color)), + } + } + + pub(crate) fn compute_layout(&self, renderer: &Renderer) -> result::Layout { + let node = self.widget.node(renderer); + + node.0.compute_layout(geometry::Size::undefined()).unwrap() + } + + pub(crate) fn hash(&self, state: &mut Hasher) { + self.widget.hash(state); + } +} + +struct Map<'a, A, B, Renderer> { + widget: Box + 'a>, + mapper: Box B>, +} + +impl<'a, A, B, Renderer> std::fmt::Debug for Map<'a, A, B, Renderer> { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Map").field("widget", &self.widget).finish() + } +} + +impl<'a, A, B, Renderer> Map<'a, A, B, Renderer> { + pub fn new( + widget: Box + 'a>, + mapper: F, + ) -> Map<'a, A, B, Renderer> + where + F: 'static + Fn(A) -> B, + { + Map { + widget, + mapper: Box::new(mapper), + } + } +} + +impl<'a, A, B, Renderer> Widget for Map<'a, A, B, Renderer> +where + A: Copy, +{ + fn node(&self, renderer: &Renderer) -> Node { + self.widget.node(renderer) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + let mut original_messages = Vec::new(); + + self.widget.on_event( + event, + layout, + cursor_position, + &mut original_messages, + ); + + original_messages + .iter() + .cloned() + .for_each(|message| messages.push((self.mapper)(message))); + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + self.widget.draw(renderer, layout, cursor_position) + } + + fn hash(&self, state: &mut Hasher) { + self.widget.hash(state); + } +} + +struct Explain<'a, Message, Renderer: crate::Renderer> { + element: Element<'a, Message, Renderer>, + color: Renderer::Color, +} + +impl<'a, Message, Renderer> std::fmt::Debug for Explain<'a, Message, Renderer> +where + Renderer: crate::Renderer, +{ + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Explain") + .field("element", &self.element) + .finish() + } +} + +impl<'a, Message, Renderer> Explain<'a, Message, Renderer> +where + Renderer: crate::Renderer, +{ + fn new( + element: Element<'a, Message, Renderer>, + color: Renderer::Color, + ) -> Self { + Explain { element, color } + } +} + +impl<'a, Message, Renderer> Widget + for Explain<'a, Message, Renderer> +where + Renderer: crate::Renderer, +{ + fn node(&self, renderer: &Renderer) -> Node { + self.element.widget.node(renderer) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + self.element + .widget + .on_event(event, layout, cursor_position, messages) + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + renderer.explain(&layout, self.color); + + self.element.widget.draw(renderer, layout, cursor_position) + } + + fn hash(&self, state: &mut Hasher) { + self.element.widget.hash(state); + } +} diff --git a/src/event.rs b/src/event.rs new file mode 100644 index 00000000..fea0e462 --- /dev/null +++ b/src/event.rs @@ -0,0 +1,11 @@ +use crate::input::{keyboard, mouse}; + +/// A user interface event. +#[derive(PartialEq, Clone, Copy, Debug)] +pub enum Event { + /// A keyboard event + Keyboard(keyboard::Event), + + /// A mouse event + Mouse(mouse::Event), +} diff --git a/src/hasher.rs b/src/hasher.rs new file mode 100644 index 00000000..a930fa13 --- /dev/null +++ b/src/hasher.rs @@ -0,0 +1,2 @@ +/// The hasher used to compare layouts. +pub type Hasher = twox_hash::XxHash; diff --git a/src/input.rs b/src/input.rs new file mode 100644 index 00000000..282d5c00 --- /dev/null +++ b/src/input.rs @@ -0,0 +1,6 @@ +pub mod keyboard; +pub mod mouse; + +mod button_state; + +pub use button_state::ButtonState; diff --git a/src/input/button_state.rs b/src/input/button_state.rs new file mode 100644 index 00000000..e8845cc7 --- /dev/null +++ b/src/input/button_state.rs @@ -0,0 +1,5 @@ +#[derive(Debug, Hash, Ord, PartialOrd, PartialEq, Eq, Clone, Copy)] +pub enum ButtonState { + Pressed, + Released, +} diff --git a/src/input/keyboard.rs b/src/input/keyboard.rs new file mode 100644 index 00000000..2b0188ff --- /dev/null +++ b/src/input/keyboard.rs @@ -0,0 +1,5 @@ +mod event; +mod key_code; + +pub use event::Event; +pub use key_code::KeyCode; diff --git a/src/input/keyboard/event.rs b/src/input/keyboard/event.rs new file mode 100644 index 00000000..3804c42d --- /dev/null +++ b/src/input/keyboard/event.rs @@ -0,0 +1,21 @@ +use super::KeyCode; +use crate::input::ButtonState; + +#[derive(Debug, Clone, Copy, PartialEq)] +/// A keyboard event. +pub enum Event { + /// A keyboard key was pressed or released. + Input { + /// The state of the key + state: ButtonState, + + /// The key identifier + key_code: KeyCode, + }, + + /// Text was entered. + TextEntered { + /// The character entered + character: char, + }, +} diff --git a/src/input/keyboard/key_code.rs b/src/input/keyboard/key_code.rs new file mode 100644 index 00000000..5cf9301f --- /dev/null +++ b/src/input/keyboard/key_code.rs @@ -0,0 +1,197 @@ +/// The symbolic name of a keyboard key +#[derive(Debug, Hash, Ord, PartialOrd, PartialEq, Eq, Clone, Copy)] +#[repr(u32)] +pub enum KeyCode { + /// The '1' key over the letters. + Key1, + /// The '2' key over the letters. + Key2, + /// The '3' key over the letters. + Key3, + /// The '4' key over the letters. + Key4, + /// The '5' key over the letters. + Key5, + /// The '6' key over the letters. + Key6, + /// The '7' key over the letters. + Key7, + /// The '8' key over the letters. + Key8, + /// The '9' key over the letters. + Key9, + /// The '0' key over the 'O' and 'P' keys. + Key0, + + A, + B, + C, + D, + E, + F, + G, + H, + I, + J, + K, + L, + M, + N, + O, + P, + Q, + R, + S, + T, + U, + V, + W, + X, + Y, + Z, + + /// The Escape key, next to F1. + Escape, + + F1, + F2, + F3, + F4, + F5, + F6, + F7, + F8, + F9, + F10, + F11, + F12, + F13, + F14, + F15, + F16, + F17, + F18, + F19, + F20, + F21, + F22, + F23, + F24, + + /// Print Screen/SysRq. + Snapshot, + /// Scroll Lock. + Scroll, + /// Pause/Break key, next to Scroll lock. + Pause, + + /// `Insert`, next to Backspace. + Insert, + Home, + Delete, + End, + PageDown, + PageUp, + + Left, + Up, + Right, + Down, + + /// The Backspace key, right over Enter. + // TODO: rename + Back, + /// The Enter key. + Return, + /// The space bar. + Space, + + /// The "Compose" key on Linux. + Compose, + + Caret, + + Numlock, + Numpad0, + Numpad1, + Numpad2, + Numpad3, + Numpad4, + Numpad5, + Numpad6, + Numpad7, + Numpad8, + Numpad9, + + AbntC1, + AbntC2, + Add, + Apostrophe, + Apps, + At, + Ax, + Backslash, + Calculator, + Capital, + Colon, + Comma, + Convert, + Decimal, + Divide, + Equals, + Grave, + Kana, + Kanji, + LAlt, + LBracket, + LControl, + LShift, + LWin, + Mail, + MediaSelect, + MediaStop, + Minus, + Multiply, + Mute, + MyComputer, + NavigateForward, // also called "Prior" + NavigateBackward, // also called "Next" + NextTrack, + NoConvert, + NumpadComma, + NumpadEnter, + NumpadEquals, + OEM102, + Period, + PlayPause, + Power, + PrevTrack, + RAlt, + RBracket, + RControl, + RShift, + RWin, + Semicolon, + Slash, + Sleep, + Stop, + Subtract, + Sysrq, + Tab, + Underline, + Unlabeled, + VolumeDown, + VolumeUp, + Wake, + WebBack, + WebFavorites, + WebForward, + WebHome, + WebRefresh, + WebSearch, + WebStop, + Yen, + Copy, + Paste, + Cut, +} diff --git a/src/input/mouse.rs b/src/input/mouse.rs new file mode 100644 index 00000000..49a62961 --- /dev/null +++ b/src/input/mouse.rs @@ -0,0 +1,5 @@ +mod button; +mod event; + +pub use button::Button; +pub use event::Event; diff --git a/src/input/mouse/button.rs b/src/input/mouse/button.rs new file mode 100644 index 00000000..c51bedfc --- /dev/null +++ b/src/input/mouse/button.rs @@ -0,0 +1,7 @@ +#[derive(Debug, Hash, PartialEq, Eq, Clone, Copy)] +pub enum Button { + Left, + Right, + Middle, + Other(u8), +} diff --git a/src/input/mouse/event.rs b/src/input/mouse/event.rs new file mode 100644 index 00000000..1f7a1547 --- /dev/null +++ b/src/input/mouse/event.rs @@ -0,0 +1,39 @@ +use super::Button; +use crate::input::ButtonState; + +/// A mouse event. +#[derive(Debug, Clone, Copy, PartialEq)] +pub enum Event { + /// The mouse cursor entered the window. + CursorEntered, + + /// The mouse cursor left the window. + CursorLeft, + + /// The mouse cursor was moved + CursorMoved { + /// The X coordinate of the mouse position + x: f32, + + /// The Y coordinate of the mouse position + y: f32, + }, + + /// A mouse button was pressed or released. + Input { + /// The state of the button + state: ButtonState, + + /// The button identifier + button: Button, + }, + + /// The mouse wheel was scrolled. + WheelScrolled { + /// The number of horizontal lines scrolled + delta_x: f32, + + /// The number of vertical lines scrolled + delta_y: f32, + }, +} diff --git a/src/interface.rs b/src/interface.rs new file mode 100644 index 00000000..6c4982e5 --- /dev/null +++ b/src/interface.rs @@ -0,0 +1,77 @@ +use std::hash::Hasher; +use stretch::result; + +use crate::{Element, Event, Layout, MouseCursor, Point}; + +pub struct Interface<'a, Message, Renderer> { + hash: u64, + root: Element<'a, Message, Renderer>, + layout: result::Layout, +} + +pub struct Cache { + hash: u64, + layout: result::Layout, +} + +impl<'a, Message, Renderer> Interface<'a, Message, Renderer> { + pub fn compute( + root: Element<'a, Message, Renderer>, + renderer: &Renderer, + ) -> Interface<'a, Message, Renderer> { + let hasher = &mut crate::Hasher::default(); + root.hash(hasher); + + let hash = hasher.finish(); + let layout = root.compute_layout(renderer); + + Interface { hash, root, layout } + } + + pub fn compute_with_cache( + root: Element<'a, Message, Renderer>, + renderer: &Renderer, + cache: Cache, + ) -> Interface<'a, Message, Renderer> { + let hasher = &mut crate::Hasher::default(); + root.hash(hasher); + + let hash = hasher.finish(); + + let layout = if hash == cache.hash { + cache.layout + } else { + root.compute_layout(renderer) + }; + + Interface { hash, root, layout } + } + + pub fn on_event(&mut self, event: Event, cursor_position: Point, messages: &mut Vec) { + let Interface { root, layout, .. } = self; + + root.widget + .on_event(event, Self::layout(layout), cursor_position, messages); + } + + pub fn draw(&self, renderer: &mut Renderer, cursor_position: Point) -> MouseCursor { + let Interface { root, layout, .. } = self; + + let cursor = root + .widget + .draw(renderer, Self::layout(layout), cursor_position); + + cursor + } + + pub fn cache(self) -> Cache { + Cache { + hash: self.hash, + layout: self.layout, + } + } + + fn layout(layout: &result::Layout) -> Layout<'_> { + Layout::new(layout, Point::new(0.0, 0.0)) + } +} diff --git a/src/layout.rs b/src/layout.rs new file mode 100644 index 00000000..011f859a --- /dev/null +++ b/src/layout.rs @@ -0,0 +1,55 @@ +use stretch::result; + +use crate::{Point, Rectangle, Vector}; + +/// The computed bounds of a [`Node`] and its children. +/// +/// This type is provided by the GUI runtime to [`Widget::on_event`] and +/// [`Widget::draw`], describing the layout of the produced [`Node`] by +/// [`Widget::node`]. +/// +/// [`Node`]: struct.Node.html +/// [`Widget::on_event`]: trait.Widget.html#method.on_event +/// [`Widget::draw`]: trait.Widget.html#tymethod.draw +/// [`Widget::node`]: trait.Widget.html#tymethod.node +#[derive(Debug)] +pub struct Layout<'a> { + layout: &'a result::Layout, + position: Point, +} + +impl<'a> Layout<'a> { + pub(crate) fn new(layout: &'a result::Layout, parent_position: Point) -> Self { + let position = parent_position + Vector::new(layout.location.x, layout.location.y); + + Layout { layout, position } + } + + /// Gets the bounds of the [`Layout`]. + /// + /// The returned [`Rectangle`] describes the position and size of a + /// [`Node`]. + /// + /// [`Layout`]: struct.Layout.html + /// [`Rectangle`]: ../../graphics/struct.Rectangle.html + /// [`Node`]: struct.Node.html + pub fn bounds(&self) -> Rectangle { + Rectangle { + x: self.position.x, + y: self.position.y, + width: self.layout.size.width, + height: self.layout.size.height, + } + } + + /// Returns an iterator over the [`Layout`] of the children of a [`Node`]. + /// + /// [`Layout`]: struct.Layout.html + /// [`Node`]: struct.Node.html + pub fn children(&'a self) -> impl Iterator> { + self.layout + .children + .iter() + .map(move |layout| Layout::new(layout, self.position)) + } +} diff --git a/src/lib.rs b/src/lib.rs index 31e1bb20..9c7eed8d 100644 --- a/src/lib.rs +++ b/src/lib.rs @@ -1,7 +1,37 @@ -#[cfg(test)] -mod tests { - #[test] - fn it_works() { - assert_eq!(2 + 2, 4); - } -} +//#![deny(missing_docs)] +//#![deny(missing_debug_implementations)] +#![deny(unused_results)] +#![deny(unsafe_code)] +#![deny(rust_2018_idioms)] +pub mod input; +pub mod widget; + +mod element; +mod event; +mod hasher; +mod interface; +mod layout; +mod mouse_cursor; +mod node; +mod point; +mod rectangle; +mod renderer; +mod style; +mod vector; + +#[doc(no_inline)] +pub use stretch::{geometry::Size, number::Number}; + +pub use element::Element; +pub use event::Event; +pub use hasher::Hasher; +pub use interface::Interface; +pub use layout::Layout; +pub use mouse_cursor::MouseCursor; +pub use node::Node; +pub use point::Point; +pub use rectangle::Rectangle; +pub use renderer::Renderer; +pub use style::{Align, Justify, Style}; +pub use vector::Vector; +pub use widget::*; diff --git a/src/mouse_cursor.rs b/src/mouse_cursor.rs new file mode 100644 index 00000000..f6a68c54 --- /dev/null +++ b/src/mouse_cursor.rs @@ -0,0 +1,21 @@ +/// The state of the mouse cursor. +#[derive(Debug, Eq, PartialEq, Clone, Copy)] +pub enum MouseCursor { + /// The cursor is out of the bounds of the user interface. + OutOfBounds, + + /// The cursor is over a non-interactive widget. + Idle, + + /// The cursor is over a clickable widget. + Pointer, + + /// The cursor is over a busy widget. + Working, + + /// The cursor is over a grabbable widget. + Grab, + + /// The cursor is grabbing a widget. + Grabbing, +} diff --git a/src/node.rs b/src/node.rs new file mode 100644 index 00000000..3e368ecb --- /dev/null +++ b/src/node.rs @@ -0,0 +1,60 @@ +use stretch::node; + +use crate::{Number, Size, Style}; + +/// The visual requirements of a [`Widget`] and its children. +/// +/// When there have been changes and the [`Layout`] needs to be recomputed, the +/// runtime obtains a [`Node`] by calling [`Widget::node`]. +/// +/// [`Style`]: struct.Style.html +/// [`Widget`]: trait.Widget.html +/// [`Node`]: struct.Node.html +/// [`Widget::node`]: trait.Widget.html#tymethod.node +/// [`Layout`]: struct.Layout.html +#[derive(Debug)] +pub struct Node(pub(crate) node::Node); + +impl Node { + /// Creates a new [`Node`] with the given [`Style`]. + /// + /// [`Node`]: struct.Node.html + /// [`Style`]: struct.Style.html + pub fn new(style: Style) -> Node { + Self::with_children(style, Vec::new()) + } + + /// Creates a new [`Node`] with the given [`Style`] and children. + /// + /// [`Node`]: struct.Node.html + /// [`Style`]: struct.Style.html + pub(crate) fn with_children(style: Style, children: Vec) -> Node { + Node(node::Node::new( + style.0, + children.iter().map(|c| &c.0).collect(), + )) + } + + /// Creates a new [`Node`] with the given [`Style`] and a measure function. + /// + /// This type of node cannot have any children. + /// + /// You should use this when your [`Widget`] can adapt its contents to the + /// size of its container. The measure function will receive the container + /// size as a parameter and must compute the size of the [`Node`] inside + /// the given bounds (if the `Number` for a dimension is `Undefined` it + /// means that it has no boundary). + /// + /// [`Node`]: struct.Node.html + /// [`Style`]: struct.Style.html + /// [`Widget`]: trait.Widget.html + pub fn with_measure(style: Style, measure: F) -> Node + where + F: 'static + Fn(Size) -> Size, + { + Node(node::Node::new_leaf( + style.0, + Box::new(move |size| Ok(measure(size))), + )) + } +} diff --git a/src/point.rs b/src/point.rs new file mode 100644 index 00000000..dbb6027e --- /dev/null +++ b/src/point.rs @@ -0,0 +1 @@ +pub type Point = nalgebra::Point2; diff --git a/src/rectangle.rs b/src/rectangle.rs new file mode 100644 index 00000000..ca224dad --- /dev/null +++ b/src/rectangle.rs @@ -0,0 +1,30 @@ +use crate::Point; + +/// A generic rectangle. +#[derive(Debug, PartialEq, Eq, Copy, Clone)] +pub struct Rectangle { + /// X coordinate of the top-left corner. + pub x: T, + + /// Y coordinate of the top-left corner. + pub y: T, + + /// Width of the rectangle. + pub width: T, + + /// Height of the rectangle. + pub height: T, +} + +impl Rectangle { + /// Returns true if the given [`Point`] is contained in the [`Rectangle`]. + /// + /// [`Point`]: type.Point.html + /// [`Rectangle`]: struct.Rectangle.html + pub fn contains(&self, point: Point) -> bool { + self.x <= point.x + && point.x <= self.x + self.width + && self.y <= point.y + && point.y <= self.y + self.height + } +} diff --git a/src/renderer.rs b/src/renderer.rs new file mode 100644 index 00000000..86e93a06 --- /dev/null +++ b/src/renderer.rs @@ -0,0 +1,15 @@ +use crate::Layout; + +pub trait Renderer { + type Color: Copy; + + /// Explains the [`Layout`] of an [`Element`] for debugging purposes. + /// + /// This will be called when [`Element::explain`] has been used. It should + /// _explain_ the [`Layout`] graphically. + /// + /// [`Layout`]: struct.Layout.html + /// [`Element`]: struct.Element.html + /// [`Element::explain`]: struct.Element.html#method.explain + fn explain(&mut self, layout: &Layout<'_>, color: Self::Color); +} diff --git a/src/style.rs b/src/style.rs new file mode 100644 index 00000000..9e1f7df2 --- /dev/null +++ b/src/style.rs @@ -0,0 +1,260 @@ +use std::hash::{Hash, Hasher}; +use stretch::{geometry, style}; + +/// The appearance of a [`Node`]. +/// +/// [`Node`]: struct.Node.html +#[derive(Debug, Clone, Copy)] +pub struct Style(pub(crate) style::Style); + +impl Style { + /// Defines the width of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn width(mut self, width: u32) -> Self { + self.0.size.width = style::Dimension::Points(width as f32); + self + } + + /// Defines the height of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn height(mut self, height: u32) -> Self { + self.0.size.height = style::Dimension::Points(height as f32); + self + } + + /// Defines the minimum width of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn min_width(mut self, min_width: u32) -> Self { + self.0.min_size.width = style::Dimension::Points(min_width as f32); + self + } + + /// Defines the maximum width of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn max_width(mut self, max_width: u32) -> Self { + self.0.max_size.width = style::Dimension::Points(max_width as f32); + self.fill_width() + } + + /// Defines the minimum height of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn min_height(mut self, min_height: u32) -> Self { + self.0.min_size.height = style::Dimension::Points(min_height as f32); + self + } + + /// Defines the maximum height of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn max_height(mut self, max_height: u32) -> Self { + self.0.max_size.height = style::Dimension::Points(max_height as f32); + self.fill_height() + } + + /// Makes a [`Node`] fill all the horizontal available space. + /// + /// [`Node`]: struct.Node.html + pub fn fill_width(mut self) -> Self { + self.0.size.width = stretch::style::Dimension::Percent(1.0); + self + } + + /// Makes a [`Node`] fill all the vertical available space. + /// + /// [`Node`]: struct.Node.html + pub fn fill_height(mut self) -> Self { + self.0.size.height = stretch::style::Dimension::Percent(1.0); + self + } + + pub(crate) fn align_items(mut self, align: Align) -> Self { + self.0.align_items = align.into(); + self + } + + pub(crate) fn justify_content(mut self, justify: Justify) -> Self { + self.0.justify_content = justify.into(); + self + } + + /// Sets the alignment of a [`Node`]. + /// + /// If the [`Node`] is inside a... + /// + /// * [`Column`], this setting will affect its __horizontal__ alignment. + /// * [`Row`], this setting will affect its __vertical__ alignment. + /// + /// [`Node`]: struct.Node.html + /// [`Column`]: widget/struct.Column.html + /// [`Row`]: widget/struct.Row.html + pub fn align_self(mut self, align: Align) -> Self { + self.0.align_self = align.into(); + self + } + + /// Sets the padding of a [`Node`] in pixels. + /// + /// [`Node`]: struct.Node.html + pub fn padding(mut self, px: u32) -> Self { + self.0.padding = stretch::geometry::Rect { + start: style::Dimension::Points(px as f32), + end: style::Dimension::Points(px as f32), + top: style::Dimension::Points(px as f32), + bottom: style::Dimension::Points(px as f32), + }; + + self + } +} + +impl Default for Style { + fn default() -> Style { + Style(style::Style { + align_items: style::AlignItems::FlexStart, + justify_content: style::JustifyContent::FlexStart, + ..style::Style::default() + }) + } +} + +impl Hash for Style { + fn hash(&self, state: &mut H) { + hash_size(&self.0.size, state); + hash_size(&self.0.min_size, state); + hash_size(&self.0.max_size, state); + + hash_rect(&self.0.margin, state); + + (self.0.flex_direction as u8).hash(state); + (self.0.align_items as u8).hash(state); + (self.0.justify_content as u8).hash(state); + (self.0.align_self as u8).hash(state); + (self.0.flex_grow as u32).hash(state); + } +} + +fn hash_size( + size: &geometry::Size, + state: &mut H, +) { + hash_dimension(size.width, state); + hash_dimension(size.height, state); +} + +fn hash_rect( + rect: &geometry::Rect, + state: &mut H, +) { + hash_dimension(rect.start, state); + hash_dimension(rect.end, state); + hash_dimension(rect.top, state); + hash_dimension(rect.bottom, state); +} + +fn hash_dimension(dimension: style::Dimension, state: &mut H) { + match dimension { + style::Dimension::Undefined => state.write_u8(0), + style::Dimension::Auto => state.write_u8(1), + style::Dimension::Points(points) => { + state.write_u8(2); + (points as u32).hash(state); + } + style::Dimension::Percent(percent) => { + state.write_u8(3); + (percent as u32).hash(state); + } + } +} + +/// Alignment on the cross axis of a container. +/// +/// * On a [`Column`], it describes __horizontal__ alignment. +/// * On a [`Row`], it describes __vertical__ alignment. +/// +/// [`Column`]: widget/struct.Column.html +/// [`Row`]: widget/struct.Row.html +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum Align { + /// Align at the start of the cross axis. + Start, + + /// Align at the center of the cross axis. + Center, + + /// Align at the end of the cross axis. + End, + + /// Stretch over the cross axis. + Stretch, +} + +#[doc(hidden)] +impl From for style::AlignItems { + fn from(align: Align) -> Self { + match align { + Align::Start => style::AlignItems::FlexStart, + Align::Center => style::AlignItems::Center, + Align::End => style::AlignItems::FlexEnd, + Align::Stretch => style::AlignItems::Stretch, + } + } +} + +#[doc(hidden)] +impl From for style::AlignSelf { + fn from(align: Align) -> Self { + match align { + Align::Start => style::AlignSelf::FlexStart, + Align::Center => style::AlignSelf::Center, + Align::End => style::AlignSelf::FlexEnd, + Align::Stretch => style::AlignSelf::Stretch, + } + } +} + +/// Distribution on the main axis of a container. +/// +/// * On a [`Column`], it describes __vertical__ distribution. +/// * On a [`Row`], it describes __horizontal__ distribution. +/// +/// [`Column`]: widget/struct.Column.html +/// [`Row`]: widget/struct.Row.html +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum Justify { + /// Place items at the start of the main axis. + Start, + + /// Place items at the center of the main axis. + Center, + + /// Place items at the end of the main axis. + End, + + /// Place items with space between. + SpaceBetween, + + /// Place items with space around. + SpaceAround, + + /// Place items with evenly distributed space. + SpaceEvenly, +} + +#[doc(hidden)] +impl From for style::JustifyContent { + fn from(justify: Justify) -> Self { + match justify { + Justify::Start => style::JustifyContent::FlexStart, + Justify::Center => style::JustifyContent::Center, + Justify::End => style::JustifyContent::FlexEnd, + Justify::SpaceBetween => style::JustifyContent::SpaceBetween, + Justify::SpaceAround => style::JustifyContent::SpaceAround, + Justify::SpaceEvenly => style::JustifyContent::SpaceEvenly, + } + } +} diff --git a/src/vector.rs b/src/vector.rs new file mode 100644 index 00000000..12f1f082 --- /dev/null +++ b/src/vector.rs @@ -0,0 +1,2 @@ +/// A 2D vector. +pub type Vector = nalgebra::Vector2; diff --git a/src/widget.rs b/src/widget.rs new file mode 100644 index 00000000..d1ad8123 --- /dev/null +++ b/src/widget.rs @@ -0,0 +1,103 @@ +//! Use the built-in widgets in your user interface. +//! +//! # Customization +//! Every drawable widget has its own module with a `Renderer` trait that must +//! be implemented by a custom renderer before being able to use the +//! widget. +//! +//! The built-in [`Renderer`] supports all the widgets in this module! +//! +//! [`ui` module]: ../index.html +//! [`Row`]: struct.Row.html +//! [`Column`]: struct.Column.html +//! [`Renderer`]: ../struct.Renderer.html +mod column; +mod row; + +pub mod button; +pub mod checkbox; +pub mod radio; +pub mod slider; +pub mod text; + +pub use button::Button; +pub use checkbox::Checkbox; +pub use column::Column; +pub use radio::Radio; +pub use row::Row; +pub use slider::Slider; +pub use text::Text; + +use crate::{Event, Hasher, Layout, MouseCursor, Node, Point}; + +/// A component that displays information or allows interaction. +/// +/// If you want to build a custom widget, you will need to implement this trait. +/// Additionally, remember to also provide [`Into`] so your users can +/// easily turn your [`Widget`] into a generic [`Element`] +/// +/// [`Into`]: struct.Element.html +/// [`Widget`]: trait.Widget.html +/// [`Element`]: struct.Element.html +pub trait Widget: std::fmt::Debug { + /// Returns the [`Node`] of the [`Widget`]. + /// + /// This [`Node`] is used by the runtime to compute the [`Layout`] of the + /// user interface. + /// + /// [`Node`]: struct.Node.html + /// [`Widget`]: trait.Widget.html + /// [`Layout`]: struct.Layout.html + fn node(&self, renderer: &Renderer) -> Node; + + /// Draws the [`Widget`] using the associated `Renderer`. + /// + /// It must return the [`MouseCursor`] state for the [`Widget`]. + /// + /// [`Widget`]: trait.Widget.html + /// [`MouseCursor`]: enum.MouseCursor.html + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor; + + /// Computes the _layout_ hash of the [`Widget`]. + /// + /// The produced hash is used by the runtime to decide if the [`Layout`] + /// needs to be recomputed between frames. Therefore, to ensure maximum + /// efficiency, the hash should only be affected by the properties of the + /// [`Widget`] that can affect layouting. + /// + /// For example, the [`Text`] widget does not hash its color property, as + /// its value cannot affect the overall [`Layout`] of the user interface. + /// + /// [`Widget`]: trait.Widget.html + /// [`Layout`]: struct.Layout.html + /// [`Text`]: ../widget/text/struct.Text.html + fn hash(&self, state: &mut Hasher); + + /// Processes a runtime [`Event`]. + /// + /// It receives: + /// * an [`Event`] describing user interaction + /// * the computed [`Layout`] of the [`Widget`] + /// * the current cursor position + /// * a mutable `Message` vector, allowing the [`Widget`] to produce + /// new messages based on user interaction. + /// + /// By default, it does nothing. + /// + /// [`Event`]: enum.Event.html + /// [`Widget`]: trait.Widget.html + /// [`Layout`]: struct.Layout.html + fn on_event( + &mut self, + _event: Event, + _layout: Layout<'_>, + _cursor_position: Point, + _messages: &mut Vec, + ) { + } +} diff --git a/src/widget/button.rs b/src/widget/button.rs new file mode 100644 index 00000000..35fa6ca8 --- /dev/null +++ b/src/widget/button.rs @@ -0,0 +1,281 @@ +//! Allow your users to perform actions by pressing a button. +//! +//! A [`Button`] has some local [`State`] and a [`Class`]. +//! +//! [`Button`]: struct.Button.html +//! [`State`]: struct.State.html +//! [`Class`]: enum.Class.html + +use crate::input::{mouse, ButtonState}; +use crate::{ + Align, Element, Event, Hasher, Layout, MouseCursor, Node, Point, Rectangle, + Style, Widget, +}; + +use std::hash::Hash; + +/// A generic widget that produces a message when clicked. +/// +/// It implements [`Widget`] when the associated [`core::Renderer`] implements +/// the [`button::Renderer`] trait. +/// +/// [`Widget`]: ../../core/trait.Widget.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +/// [`button::Renderer`]: trait.Renderer.html +/// +/// # Example +/// +/// ``` +/// use iced::{button, Button}; +/// +/// pub enum Message { +/// ButtonClicked, +/// } +/// +/// let state = &mut button::State::new(); +/// +/// Button::new(state, "Click me!") +/// .on_press(Message::ButtonClicked); +/// ``` +pub struct Button<'a, Message> { + state: &'a mut State, + label: String, + class: Class, + on_press: Option, + style: Style, +} + +impl<'a, Message> std::fmt::Debug for Button<'a, Message> +where + Message: std::fmt::Debug, +{ + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Button") + .field("state", &self.state) + .field("label", &self.label) + .field("class", &self.class) + .field("on_press", &self.on_press) + .field("style", &self.style) + .finish() + } +} + +impl<'a, Message> Button<'a, Message> { + /// Creates a new [`Button`] with some local [`State`] and the given label. + /// + /// The default [`Class`] of a new [`Button`] is [`Class::Primary`]. + /// + /// [`Button`]: struct.Button.html + /// [`State`]: struct.State.html + /// [`Class`]: enum.Class.html + /// [`Class::Primary`]: enum.Class.html#variant.Primary + pub fn new(state: &'a mut State, label: &str) -> Self { + Button { + state, + label: String::from(label), + class: Class::Primary, + on_press: None, + style: Style::default().min_width(100), + } + } + + /// Sets the width of the [`Button`] in pixels. + /// + /// [`Button`]: struct.Button.html + pub fn width(mut self, width: u32) -> Self { + self.style = self.style.width(width); + self + } + + /// Makes the [`Button`] fill the horizontal space of its container. + /// + /// [`Button`]: struct.Button.html + pub fn fill_width(mut self) -> Self { + self.style = self.style.fill_width(); + self + } + + /// Sets the alignment of the [`Button`] itself. + /// + /// This is useful if you want to override the default alignment given by + /// the parent container. + /// + /// [`Button`]: struct.Button.html + pub fn align_self(mut self, align: Align) -> Self { + self.style = self.style.align_self(align); + self + } + + /// Sets the [`Class`] of the [`Button`]. + /// + /// + /// [`Button`]: struct.Button.html + /// [`Class`]: enum.Class.html + pub fn class(mut self, class: Class) -> Self { + self.class = class; + self + } + + /// Sets the message that will be produced when the [`Button`] is pressed. + /// + /// [`Button`]: struct.Button.html + pub fn on_press(mut self, msg: Message) -> Self { + self.on_press = Some(msg); + self + } +} + +impl<'a, Message, Renderer> Widget for Button<'a, Message> +where + Renderer: self::Renderer, + Message: Copy + std::fmt::Debug, +{ + fn node(&self, _renderer: &Renderer) -> Node { + Node::new(self.style.height(50)) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + match event { + Event::Mouse(mouse::Event::Input { + button: mouse::Button::Left, + state, + }) => { + if let Some(on_press) = self.on_press { + let bounds = layout.bounds(); + + match state { + ButtonState::Pressed => { + self.state.is_pressed = + bounds.contains(cursor_position); + } + ButtonState::Released => { + let is_clicked = self.state.is_pressed + && bounds.contains(cursor_position); + + self.state.is_pressed = false; + + if is_clicked { + messages.push(on_press); + } + } + } + } + } + _ => {} + } + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + renderer.draw( + cursor_position, + layout.bounds(), + self.state, + &self.label, + self.class, + ) + } + + fn hash(&self, state: &mut Hasher) { + self.style.hash(state); + } +} + +/// The local state of a [`Button`]. +/// +/// [`Button`]: struct.Button.html +#[derive(Debug, Clone, Copy, PartialEq, Eq, Default)] +pub struct State { + is_pressed: bool, +} + +impl State { + /// Creates a new [`State`]. + /// + /// [`State`]: struct.State.html + pub fn new() -> State { + State::default() + } + + /// Returns whether the associated [`Button`] is currently being pressed or + /// not. + /// + /// [`Button`]: struct.Button.html + pub fn is_pressed(&self) -> bool { + self.is_pressed + } +} + +/// The type of a [`Button`]. +/// +/// ![Different buttons drawn by the built-in renderer](https://github.com/hecrj/coffee/blob/bda9818f823dfcb8a7ad0ff4940b4d4b387b5208/images/ui/button_classes.png?raw=true) +/// +/// [`Button`]: struct.Button.html +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum Class { + /// The [`Button`] performs the main action. + /// + /// [`Button`]: struct.Button.html + Primary, + + /// The [`Button`] performs an alternative action. + /// + /// [`Button`]: struct.Button.html + Secondary, + + /// The [`Button`] performs a productive action. + /// + /// [`Button`]: struct.Button.html + Positive, +} + +/// The renderer of a [`Button`]. +/// +/// Your [`core::Renderer`] will need to implement this trait before being +/// able to use a [`Button`] in your user interface. +/// +/// [`Button`]: struct.Button.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +pub trait Renderer { + /// Draws a [`Button`]. + /// + /// It receives: + /// * the current cursor position + /// * the bounds of the [`Button`] + /// * the local state of the [`Button`] + /// * the label of the [`Button`] + /// * the [`Class`] of the [`Button`] + /// + /// [`Button`]: struct.Button.html + /// [`State`]: struct.State.html + /// [`Class`]: enum.Class.html + fn draw( + &mut self, + cursor_position: Point, + bounds: Rectangle, + state: &State, + label: &str, + class: Class, + ) -> MouseCursor; +} + +impl<'a, Message, Renderer> From> + for Element<'a, Message, Renderer> +where + Renderer: self::Renderer, + Message: 'static + Copy + std::fmt::Debug, +{ + fn from(button: Button<'a, Message>) -> Element<'a, Message, Renderer> { + Element::new(button) + } +} diff --git a/src/widget/checkbox.rs b/src/widget/checkbox.rs new file mode 100644 index 00000000..c30b8308 --- /dev/null +++ b/src/widget/checkbox.rs @@ -0,0 +1,213 @@ +//! Show toggle controls using checkboxes. +use std::hash::Hash; + +use crate::input::{mouse, ButtonState}; +use crate::widget::{text, Column, Row, Text}; +use crate::{ + Align, Element, Event, Hasher, Layout, MouseCursor, Node, Point, Rectangle, + Widget, +}; + +/// A box that can be checked. +/// +/// It implements [`Widget`] when the [`core::Renderer`] implements the +/// [`checkbox::Renderer`] trait. +/// +/// [`Widget`]: ../../core/trait.Widget.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +/// [`checkbox::Renderer`]: trait.Renderer.html +/// +/// # Example +/// +/// ``` +/// use iced::Checkbox; +/// +/// #[derive(Debug, Clone, Copy)] +/// pub enum Color { +/// Black, +/// White, +/// } +/// +/// impl Default for Color { +/// fn default() -> Color { +/// Color::Black +/// } +/// } +/// +/// pub enum Message { +/// CheckboxToggled(bool), +/// } +/// +/// fn some_checkbox(is_checked: bool) -> Checkbox { +/// Checkbox::new(is_checked, "Toggle me!", Message::CheckboxToggled) +/// .label_color(Color::White) +/// } +/// ``` +pub struct Checkbox { + is_checked: bool, + on_toggle: Box Message>, + label: String, + label_color: Color, +} + +impl std::fmt::Debug for Checkbox +where + Color: std::fmt::Debug, +{ + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Checkbox") + .field("is_checked", &self.is_checked) + .field("label", &self.label) + .field("label_color", &self.label_color) + .finish() + } +} + +impl Checkbox +where + Color: Default, +{ + /// Creates a new [`Checkbox`]. + /// + /// It expects: + /// * a boolean describing whether the [`Checkbox`] is checked or not + /// * the label of the [`Checkbox`] + /// * a function that will be called when the [`Checkbox`] is toggled. + /// It receives the new state of the [`Checkbox`] and must produce a + /// `Message`. + /// + /// [`Checkbox`]: struct.Checkbox.html + pub fn new(is_checked: bool, label: &str, f: F) -> Self + where + F: 'static + Fn(bool) -> Message, + { + Checkbox { + is_checked, + on_toggle: Box::new(f), + label: String::from(label), + label_color: Color::default(), + } + } + + /// Sets the [`Color`] of the label of the [`Checkbox`]. + /// + /// [`Color`]: ../../../../graphics/struct.Color.html + /// [`Checkbox`]: struct.Checkbox.html + pub fn label_color(mut self, color: Color) -> Self { + self.label_color = color; + self + } +} + +impl Widget + for Checkbox +where + Color: 'static + Copy + Default + std::fmt::Debug, + Renderer: self::Renderer + text::Renderer, +{ + fn node(&self, renderer: &Renderer) -> Node { + Row::<(), Renderer>::new() + .spacing(15) + .align_items(Align::Center) + .push(Column::new().width(28).height(28)) + .push(Text::new(&self.label)) + .node(renderer) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + match event { + Event::Mouse(mouse::Event::Input { + button: mouse::Button::Left, + state: ButtonState::Pressed, + }) => { + let mouse_over = layout + .children() + .any(|child| child.bounds().contains(cursor_position)); + + if mouse_over { + messages.push((self.on_toggle)(!self.is_checked)); + } + } + _ => {} + } + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + let children: Vec<_> = layout.children().collect(); + + let text_bounds = children[1].bounds(); + + text::Renderer::draw( + renderer, + text_bounds, + &self.label, + 20.0, + self.label_color, + text::HorizontalAlignment::Left, + text::VerticalAlignment::Top, + ); + + self::Renderer::draw( + renderer, + cursor_position, + children[0].bounds(), + text_bounds, + self.is_checked, + ) + } + + fn hash(&self, state: &mut Hasher) { + self.label.hash(state); + } +} + +/// The renderer of a [`Checkbox`]. +/// +/// Your [`core::Renderer`] will need to implement this trait before being +/// able to use a [`Checkbox`] in your user interface. +/// +/// [`Checkbox`]: struct.Checkbox.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +pub trait Renderer { + /// Draws a [`Checkbox`]. + /// + /// It receives: + /// * the current cursor position + /// * the bounds of the [`Checkbox`] + /// * the bounds of the label of the [`Checkbox`] + /// * whether the [`Checkbox`] is checked or not + /// + /// [`Checkbox`]: struct.Checkbox.html + fn draw( + &mut self, + cursor_position: Point, + bounds: Rectangle, + label_bounds: Rectangle, + is_checked: bool, + ) -> MouseCursor; +} + +impl<'a, Color, Message, Renderer> From> + for Element<'a, Message, Renderer> +where + Color: 'static + Copy + Default + std::fmt::Debug, + Renderer: self::Renderer + text::Renderer, + Message: 'static, +{ + fn from( + checkbox: Checkbox, + ) -> Element<'a, Message, Renderer> { + Element::new(checkbox) + } +} diff --git a/src/widget/column.rs b/src/widget/column.rs new file mode 100644 index 00000000..18a68f60 --- /dev/null +++ b/src/widget/column.rs @@ -0,0 +1,223 @@ +use std::hash::Hash; + +use crate::{ + Align, Element, Event, Hasher, Justify, Layout, MouseCursor, Node, Point, + Style, Widget, +}; + +/// A container that places its contents vertically. +/// +/// A [`Column`] will try to fill the horizontal space of its container. +/// +/// [`Column`]: struct.Column.html +pub struct Column<'a, Message, Renderer> { + style: Style, + spacing: u16, + children: Vec>, +} + +impl<'a, Message, Renderer> std::fmt::Debug for Column<'a, Message, Renderer> { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Column") + .field("style", &self.style) + .field("spacing", &self.spacing) + .field("children", &self.children) + .finish() + } +} + +impl<'a, Message, Renderer> Column<'a, Message, Renderer> { + /// Creates an empty [`Column`]. + /// + /// [`Column`]: struct.Column.html + pub fn new() -> Self { + let mut style = Style::default().fill_width(); + style.0.flex_direction = stretch::style::FlexDirection::Column; + + Column { + style, + spacing: 0, + children: Vec::new(), + } + } + + /// Sets the vertical spacing _between_ elements in pixels. + /// + /// Custom margins per element do not exist in Coffee. You should use this + /// method instead! While less flexible, it helps you keep spacing between + /// elements consistent. + pub fn spacing(mut self, px: u16) -> Self { + self.spacing = px; + self + } + + /// Sets the padding of the [`Column`] in pixels. + /// + /// [`Column`]: struct.Column.html + pub fn padding(mut self, px: u32) -> Self { + self.style = self.style.padding(px); + self + } + + /// Sets the width of the [`Column`] in pixels. + /// + /// [`Column`]: struct.Column.html + pub fn width(mut self, width: u32) -> Self { + self.style = self.style.width(width); + self + } + + /// Sets the height of the [`Column`] in pixels. + /// + /// [`Column`]: struct.Column.html + pub fn height(mut self, height: u32) -> Self { + self.style = self.style.height(height); + self + } + + /// Sets the maximum width of the [`Column`] in pixels. + /// + /// [`Column`]: struct.Column.html + pub fn max_width(mut self, max_width: u32) -> Self { + self.style = self.style.max_width(max_width); + self + } + + /// Sets the maximum height of the [`Column`] in pixels. + /// + /// [`Column`]: struct.Column.html + pub fn max_height(mut self, max_height: u32) -> Self { + self.style = self.style.max_height(max_height); + self + } + + /// Sets the alignment of the [`Column`] itself. + /// + /// This is useful if you want to override the default alignment given by + /// the parent container. + /// + /// [`Column`]: struct.Column.html + pub fn align_self(mut self, align: Align) -> Self { + self.style = self.style.align_self(align); + self + } + + /// Sets the horizontal alignment of the contents of the [`Column`] . + /// + /// [`Column`]: struct.Column.html + pub fn align_items(mut self, align: Align) -> Self { + self.style = self.style.align_items(align); + self + } + + /// Sets the vertical distribution strategy for the contents of the + /// [`Column`] . + /// + /// [`Column`]: struct.Column.html + pub fn justify_content(mut self, justify: Justify) -> Self { + self.style = self.style.justify_content(justify); + self + } + + /// Adds an [`Element`] to the [`Column`]. + /// + /// [`Element`]: ../core/struct.Element.html + /// [`Column`]: struct.Column.html + pub fn push(mut self, child: E) -> Column<'a, Message, Renderer> + where + E: Into>, + { + self.children.push(child.into()); + self + } +} + +impl<'a, Message, Renderer> Widget + for Column<'a, Message, Renderer> +{ + fn node(&self, renderer: &Renderer) -> Node { + let mut children: Vec = self + .children + .iter() + .map(|child| { + let mut node = child.widget.node(renderer); + + let mut style = node.0.style(); + style.margin.bottom = + stretch::style::Dimension::Points(self.spacing as f32); + + node.0.set_style(style); + node + }) + .collect(); + + if let Some(node) = children.last_mut() { + let mut style = node.0.style(); + style.margin.bottom = stretch::style::Dimension::Undefined; + + node.0.set_style(style); + } + + Node::with_children(self.style, children) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + self.children.iter_mut().zip(layout.children()).for_each( + |(child, layout)| { + child + .widget + .on_event(event, layout, cursor_position, messages) + }, + ); + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + let mut cursor = MouseCursor::OutOfBounds; + + self.children.iter().zip(layout.children()).for_each( + |(child, layout)| { + let new_cursor = + child.widget.draw(renderer, layout, cursor_position); + + if new_cursor != MouseCursor::OutOfBounds { + cursor = new_cursor; + } + }, + ); + + cursor + } + + fn hash(&self, state: &mut Hasher) { + self.style.hash(state); + self.spacing.hash(state); + + for child in &self.children { + child.widget.hash(state); + } + } +} + +impl<'a, Message, Renderer> From> + for Element<'a, Message, Renderer> +where + Renderer: 'a, + Message: 'static, +{ + fn from( + column: Column<'a, Message, Renderer>, + ) -> Element<'a, Message, Renderer> { + Element::new(column) + } +} diff --git a/src/widget/panel.rs b/src/widget/panel.rs new file mode 100644 index 00000000..28e5989c --- /dev/null +++ b/src/widget/panel.rs @@ -0,0 +1,94 @@ +use std::hash::Hash; + +use crate::graphics::{Point, Rectangle}; +use crate::ui::core::{ + Event, Hasher, Layout, MouseCursor, Node, Style, Widget, +}; + +pub struct Panel<'a, Message, Renderer> { + style: Style, + content: Box + 'a>, +} + +impl<'a, Message, Renderer> Panel<'a, Message, Renderer> { + pub fn new(content: impl Widget + 'a) -> Self { + Panel { + style: Style::default().padding(20), + content: Box::new(content), + } + } + + pub fn width(mut self, width: u32) -> Self { + self.style = self.style.width(width); + self + } + + pub fn max_width(mut self, max_width: u32) -> Self { + self.style = self.style.max_width(max_width); + self + } +} + +impl<'a, Message, Renderer> Widget + for Panel<'a, Message, Renderer> +where + Renderer: self::Renderer, +{ + fn node(&self, renderer: &Renderer) -> Node { + Node::with_children(self.style, vec![self.content.node(renderer)]) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout, + cursor_position: Point, + messages: &mut Vec, + ) { + [&mut self.content] + .iter_mut() + .zip(layout.children()) + .for_each(|(child, layout)| { + child.on_event(event, layout, cursor_position, messages) + }); + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout, + cursor_position: Point, + ) -> MouseCursor { + let bounds = layout.bounds(); + let mut cursor = MouseCursor::OutOfBounds; + renderer.draw(bounds); + + [&self.content].iter().zip(layout.children()).for_each( + |(child, layout)| { + let new_cursor = child.draw(renderer, layout, cursor_position); + + if new_cursor != MouseCursor::OutOfBounds { + cursor = new_cursor; + } + }, + ); + + if cursor == MouseCursor::OutOfBounds { + if bounds.contains(cursor_position) { + MouseCursor::Idle + } else { + MouseCursor::OutOfBounds + } + } else { + cursor + } + } + + fn hash(&self, state: &mut Hasher) { + self.style.hash(state); + } +} + +pub trait Renderer { + fn draw(&mut self, bounds: Rectangle); +} diff --git a/src/widget/radio.rs b/src/widget/radio.rs new file mode 100644 index 00000000..8a678ec8 --- /dev/null +++ b/src/widget/radio.rs @@ -0,0 +1,219 @@ +//! Create choices using radio buttons. +use crate::input::{mouse, ButtonState}; +use crate::widget::{text, Column, Row, Text}; +use crate::{ + Align, Element, Event, Hasher, Layout, MouseCursor, Node, Point, Rectangle, + Widget, +}; + +use std::hash::Hash; + +/// A circular button representing a choice. +/// +/// It implements [`Widget`] when the [`core::Renderer`] implements the +/// [`radio::Renderer`] trait. +/// +/// [`Widget`]: ../../core/trait.Widget.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +/// [`radio::Renderer`]: trait.Renderer.html +/// +/// # Example +/// ``` +/// use iced::{Column, Radio}; +/// +/// #[derive(Debug, Clone, Copy)] +/// pub enum Color { +/// Black, +/// } +/// +/// impl Default for Color { +/// fn default() -> Color { +/// Color::Black +/// } +/// } +/// +/// #[derive(Debug, Clone, Copy, PartialEq, Eq)] +/// pub enum Choice { +/// A, +/// B, +/// } +/// +/// #[derive(Debug, Clone, Copy)] +/// pub enum Message { +/// RadioSelected(Choice), +/// } +/// +/// let selected_choice = Some(Choice::A); +/// +/// Radio::::new(Choice::A, "This is A", selected_choice, Message::RadioSelected) +/// .label_color(Color::Black); +/// ``` +/// +/// ![Checkbox drawn by the built-in renderer](https://github.com/hecrj/coffee/blob/bda9818f823dfcb8a7ad0ff4940b4d4b387b5208/images/ui/radio.png?raw=true) +pub struct Radio { + is_selected: bool, + on_click: Message, + label: String, + label_color: Color, +} + +impl std::fmt::Debug for Radio +where + Color: std::fmt::Debug, + Message: std::fmt::Debug, +{ + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Radio") + .field("is_selected", &self.is_selected) + .field("on_click", &self.on_click) + .field("label", &self.label) + .field("label_color", &self.label_color) + .finish() + } +} + +impl Radio +where + Color: Default, +{ + /// Creates a new [`Radio`] button. + /// + /// It expects: + /// * the value related to the [`Radio`] button + /// * the label of the [`Radio`] button + /// * the current selected value + /// * a function that will be called when the [`Radio`] is selected. It + /// receives the value of the radio and must produce a `Message`. + /// + /// [`Radio`]: struct.Radio.html + pub fn new(value: V, label: &str, selected: Option, f: F) -> Self + where + V: Eq + Copy, + F: 'static + Fn(V) -> Message, + { + Radio { + is_selected: Some(value) == selected, + on_click: f(value), + label: String::from(label), + label_color: Color::default(), + } + } + + /// Sets the [`Color`] of the label of the [`Radio`]. + /// + /// [`Color`]: ../../../../graphics/struct.Color.html + /// [`Radio`]: struct.Radio.html + pub fn label_color(mut self, color: Color) -> Self { + self.label_color = color; + self + } +} + +impl Widget + for Radio +where + Color: 'static + Copy + Default + std::fmt::Debug, + Renderer: self::Renderer + text::Renderer, + Message: Copy + std::fmt::Debug, +{ + fn node(&self, renderer: &Renderer) -> Node { + Row::<(), Renderer>::new() + .spacing(15) + .align_items(Align::Center) + .push(Column::new().width(28).height(28)) + .push(Text::new(&self.label)) + .node(renderer) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + match event { + Event::Mouse(mouse::Event::Input { + button: mouse::Button::Left, + state: ButtonState::Pressed, + }) => { + if layout.bounds().contains(cursor_position) { + messages.push(self.on_click); + } + } + _ => {} + } + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + let children: Vec<_> = layout.children().collect(); + + let mut text_bounds = children[1].bounds(); + text_bounds.y -= 2.0; + + text::Renderer::draw( + renderer, + text_bounds, + &self.label, + 20.0, + self.label_color, + text::HorizontalAlignment::Left, + text::VerticalAlignment::Top, + ); + + self::Renderer::draw( + renderer, + cursor_position, + children[0].bounds(), + layout.bounds(), + self.is_selected, + ) + } + + fn hash(&self, state: &mut Hasher) { + self.label.hash(state); + } +} + +/// The renderer of a [`Radio`] button. +/// +/// Your [`core::Renderer`] will need to implement this trait before being +/// able to use a [`Radio`] button in your user interface. +/// +/// [`Radio`]: struct.Radio.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +pub trait Renderer { + /// Draws a [`Radio`] button. + /// + /// It receives: + /// * the current cursor position + /// * the bounds of the [`Radio`] + /// * the bounds of the label of the [`Radio`] + /// * whether the [`Radio`] is selected or not + /// + /// [`Radio`]: struct.Radio.html + fn draw( + &mut self, + cursor_position: Point, + bounds: Rectangle, + label_bounds: Rectangle, + is_selected: bool, + ) -> MouseCursor; +} + +impl<'a, Color, Message, Renderer> From> + for Element<'a, Message, Renderer> +where + Color: 'static + Copy + Default + std::fmt::Debug, + Renderer: self::Renderer + text::Renderer, + Message: 'static + Copy + std::fmt::Debug, +{ + fn from(checkbox: Radio) -> Element<'a, Message, Renderer> { + Element::new(checkbox) + } +} diff --git a/src/widget/row.rs b/src/widget/row.rs new file mode 100644 index 00000000..9e0f9d4c --- /dev/null +++ b/src/widget/row.rs @@ -0,0 +1,218 @@ +use std::hash::Hash; + +use crate::{ + Align, Element, Event, Hasher, Justify, Layout, MouseCursor, Node, Point, + Style, Widget, +}; + +/// A container that places its contents horizontally. +/// +/// A [`Row`] will try to fill the horizontal space of its container. +/// +/// [`Row`]: struct.Row.html +pub struct Row<'a, Message, Renderer> { + style: Style, + spacing: u16, + children: Vec>, +} + +impl<'a, Message, Renderer> std::fmt::Debug for Row<'a, Message, Renderer> { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Row") + .field("style", &self.style) + .field("spacing", &self.spacing) + .field("children", &self.children) + .finish() + } +} + +impl<'a, Message, Renderer> Row<'a, Message, Renderer> { + /// Creates an empty [`Row`]. + /// + /// [`Row`]: struct.Row.html + pub fn new() -> Self { + Row { + style: Style::default().fill_width(), + spacing: 0, + children: Vec::new(), + } + } + + /// Sets the horizontal spacing _between_ elements in pixels. + /// + /// Custom margins per element do not exist in Coffee. You should use this + /// method instead! While less flexible, it helps you keep spacing between + /// elements consistent. + pub fn spacing(mut self, px: u16) -> Self { + self.spacing = px; + self + } + + /// Sets the padding of the [`Row`] in pixels. + /// + /// [`Row`]: struct.Row.html + pub fn padding(mut self, px: u32) -> Self { + self.style = self.style.padding(px); + self + } + + /// Sets the width of the [`Row`] in pixels. + /// + /// [`Row`]: struct.Row.html + pub fn width(mut self, width: u32) -> Self { + self.style = self.style.width(width); + self + } + + /// Sets the height of the [`Row`] in pixels. + /// + /// [`Row`]: struct.Row.html + pub fn height(mut self, height: u32) -> Self { + self.style = self.style.height(height); + self + } + + /// Sets the maximum width of the [`Row`] in pixels. + /// + /// [`Row`]: struct.Row.html + pub fn max_width(mut self, max_width: u32) -> Self { + self.style = self.style.max_width(max_width); + self + } + + /// Sets the maximum height of the [`Row`] in pixels. + /// + /// [`Row`]: struct.Row.html + pub fn max_height(mut self, max_height: u32) -> Self { + self.style = self.style.max_height(max_height); + self + } + + /// Sets the alignment of the [`Row`] itself. + /// + /// This is useful if you want to override the default alignment given by + /// the parent container. + /// + /// [`Row`]: struct.Row.html + pub fn align_self(mut self, align: Align) -> Self { + self.style = self.style.align_self(align); + self + } + + /// Sets the vertical alignment of the contents of the [`Row`] . + /// + /// [`Row`]: struct.Row.html + pub fn align_items(mut self, align: Align) -> Self { + self.style = self.style.align_items(align); + self + } + + /// Sets the horizontal distribution strategy for the contents of the + /// [`Row`] . + /// + /// [`Row`]: struct.Row.html + pub fn justify_content(mut self, justify: Justify) -> Self { + self.style = self.style.justify_content(justify); + self + } + + /// Adds an [`Element`] to the [`Row`]. + /// + /// [`Element`]: ../core/struct.Element.html + /// [`Row`]: struct.Row.html + pub fn push(mut self, child: E) -> Row<'a, Message, Renderer> + where + E: Into>, + { + self.children.push(child.into()); + self + } +} + +impl<'a, Message, Renderer> Widget + for Row<'a, Message, Renderer> +{ + fn node(&self, renderer: &Renderer) -> Node { + let mut children: Vec = self + .children + .iter() + .map(|child| { + let mut node = child.widget.node(renderer); + + let mut style = node.0.style(); + style.margin.end = + stretch::style::Dimension::Points(self.spacing as f32); + + node.0.set_style(style); + node + }) + .collect(); + + if let Some(node) = children.last_mut() { + let mut style = node.0.style(); + style.margin.end = stretch::style::Dimension::Undefined; + + node.0.set_style(style); + } + + Node::with_children(self.style, children) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + self.children.iter_mut().zip(layout.children()).for_each( + |(child, layout)| { + child + .widget + .on_event(event, layout, cursor_position, messages) + }, + ); + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + let mut cursor = MouseCursor::OutOfBounds; + + self.children.iter().zip(layout.children()).for_each( + |(child, layout)| { + let new_cursor = + child.widget.draw(renderer, layout, cursor_position); + + if new_cursor != MouseCursor::OutOfBounds { + cursor = new_cursor; + } + }, + ); + + cursor + } + + fn hash(&self, state: &mut Hasher) { + self.style.hash(state); + self.spacing.hash(state); + + for child in &self.children { + child.widget.hash(state); + } + } +} + +impl<'a, Message, Renderer> From> + for Element<'a, Message, Renderer> +where + Renderer: 'a, + Message: 'static, +{ + fn from(row: Row<'a, Message, Renderer>) -> Element<'a, Message, Renderer> { + Element::new(row) + } +} diff --git a/src/widget/slider.rs b/src/widget/slider.rs new file mode 100644 index 00000000..75a0fdaf --- /dev/null +++ b/src/widget/slider.rs @@ -0,0 +1,240 @@ +//! Display an interactive selector of a single value from a range of values. +//! +//! A [`Slider`] has some local [`State`]. +//! +//! [`Slider`]: struct.Slider.html +//! [`State`]: struct.State.html +use std::hash::Hash; +use std::ops::RangeInclusive; + +use crate::input::{mouse, ButtonState}; +use crate::{ + Element, Event, Hasher, Layout, MouseCursor, Node, Point, Rectangle, Style, + Widget, +}; + +/// An horizontal bar and a handle that selects a single value from a range of +/// values. +/// +/// A [`Slider`] will try to fill the horizontal space of its container. +/// +/// It implements [`Widget`] when the associated [`core::Renderer`] implements +/// the [`slider::Renderer`] trait. +/// +/// [`Slider`]: struct.Slider.html +/// [`Widget`]: ../../core/trait.Widget.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +/// [`slider::Renderer`]: trait.Renderer.html +/// +/// # Example +/// ``` +/// use iced::{slider, Slider}; +/// +/// pub enum Message { +/// SliderChanged(f32), +/// } +/// +/// let state = &mut slider::State::new(); +/// let value = 50.0; +/// +/// Slider::new(state, 0.0..=100.0, value, Message::SliderChanged); +/// ``` +pub struct Slider<'a, Message> { + state: &'a mut State, + range: RangeInclusive, + value: f32, + on_change: Box Message>, + style: Style, +} + +impl<'a, Message> std::fmt::Debug for Slider<'a, Message> { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + f.debug_struct("Slider") + .field("state", &self.state) + .field("range", &self.range) + .field("value", &self.value) + .field("style", &self.style) + .finish() + } +} + +impl<'a, Message> Slider<'a, Message> { + /// Creates a new [`Slider`]. + /// + /// It expects: + /// * the local [`State`] of the [`Slider`] + /// * an inclusive range of possible values + /// * the current value of the [`Slider`] + /// * a function that will be called when the [`Slider`] is dragged. + /// It receives the new value of the [`Slider`] and must produce a + /// `Message`. + /// + /// [`Slider`]: struct.Slider.html + /// [`State`]: struct.State.html + pub fn new( + state: &'a mut State, + range: RangeInclusive, + value: f32, + on_change: F, + ) -> Self + where + F: 'static + Fn(f32) -> Message, + { + Slider { + state, + value: value.max(*range.start()).min(*range.end()), + range, + on_change: Box::new(on_change), + style: Style::default().min_width(100).fill_width(), + } + } + + /// Sets the width of the [`Slider`] in pixels. + /// + /// [`Slider`]: struct.Slider.html + pub fn width(mut self, width: u32) -> Self { + self.style = self.style.width(width); + self + } +} + +impl<'a, Message, Renderer> Widget for Slider<'a, Message> +where + Renderer: self::Renderer, +{ + fn node(&self, _renderer: &Renderer) -> Node { + Node::new(self.style.height(25)) + } + + fn on_event( + &mut self, + event: Event, + layout: Layout<'_>, + cursor_position: Point, + messages: &mut Vec, + ) { + let mut change = || { + let bounds = layout.bounds(); + + if cursor_position.x <= bounds.x { + messages.push((self.on_change)(*self.range.start())); + } else if cursor_position.x >= bounds.x + bounds.width { + messages.push((self.on_change)(*self.range.end())); + } else { + let percent = (cursor_position.x - bounds.x) / bounds.width; + let value = (self.range.end() - self.range.start()) * percent + + self.range.start(); + + messages.push((self.on_change)(value)); + } + }; + + match event { + Event::Mouse(mouse::Event::Input { + button: mouse::Button::Left, + state, + }) => match state { + ButtonState::Pressed => { + if layout.bounds().contains(cursor_position) { + change(); + self.state.is_dragging = true; + } + } + ButtonState::Released => { + self.state.is_dragging = false; + } + }, + Event::Mouse(mouse::Event::CursorMoved { .. }) => { + if self.state.is_dragging { + change(); + } + } + _ => {} + } + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + cursor_position: Point, + ) -> MouseCursor { + renderer.draw( + cursor_position, + layout.bounds(), + self.state, + self.range.clone(), + self.value, + ) + } + + fn hash(&self, state: &mut Hasher) { + self.style.hash(state); + } +} + +/// The local state of a [`Slider`]. +/// +/// [`Slider`]: struct.Slider.html +#[derive(Debug, Clone, Copy, PartialEq, Eq, Default)] +pub struct State { + is_dragging: bool, +} + +impl State { + /// Creates a new [`State`]. + /// + /// [`State`]: struct.State.html + pub fn new() -> State { + State::default() + } + + /// Returns whether the associated [`Slider`] is currently being dragged or + /// not. + /// + /// [`Slider`]: struct.Slider.html + pub fn is_dragging(&self) -> bool { + self.is_dragging + } +} + +/// The renderer of a [`Slider`]. +/// +/// Your [`core::Renderer`] will need to implement this trait before being +/// able to use a [`Slider`] in your user interface. +/// +/// [`Slider`]: struct.Slider.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +pub trait Renderer { + /// Draws a [`Slider`]. + /// + /// It receives: + /// * the current cursor position + /// * the bounds of the [`Slider`] + /// * the local state of the [`Slider`] + /// * the range of values of the [`Slider`] + /// * the current value of the [`Slider`] + /// + /// [`Slider`]: struct.Slider.html + /// [`State`]: struct.State.html + /// [`Class`]: enum.Class.html + fn draw( + &mut self, + cursor_position: Point, + bounds: Rectangle, + state: &State, + range: RangeInclusive, + value: f32, + ) -> MouseCursor; +} + +impl<'a, Message, Renderer> From> + for Element<'a, Message, Renderer> +where + Renderer: self::Renderer, + Message: 'static, +{ + fn from(slider: Slider<'a, Message>) -> Element<'a, Message, Renderer> { + Element::new(slider) + } +} diff --git a/src/widget/text.rs b/src/widget/text.rs new file mode 100644 index 00000000..e1ce8b16 --- /dev/null +++ b/src/widget/text.rs @@ -0,0 +1,223 @@ +//! Write some text for your users to read. +use crate::{ + Element, Hasher, Layout, MouseCursor, Node, Point, Rectangle, Style, Widget, +}; + +use std::hash::Hash; + +/// A fragment of text. +/// +/// It implements [`Widget`] when the associated [`core::Renderer`] implements +/// the [`text::Renderer`] trait. +/// +/// [`Widget`]: ../../core/trait.Widget.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +/// [`text::Renderer`]: trait.Renderer.html +/// +/// # Example +/// +/// ``` +/// use iced::Text; +/// +/// Text::<(f32, f32, f32)>::new("I <3 iced!") +/// .size(40) +/// .color((0.0, 0.0, 1.0)); +/// ``` +#[derive(Debug, Clone)] +pub struct Text { + content: String, + size: u16, + color: Color, + style: Style, + horizontal_alignment: HorizontalAlignment, + vertical_alignment: VerticalAlignment, +} + +impl Text +where + Color: Default, +{ + /// Create a new fragment of [`Text`] with the given contents. + /// + /// [`Text`]: struct.Text.html + pub fn new(label: &str) -> Self { + Text { + content: String::from(label), + size: 20, + color: Color::default(), + style: Style::default().fill_width(), + horizontal_alignment: HorizontalAlignment::Left, + vertical_alignment: VerticalAlignment::Top, + } + } + + /// Sets the size of the [`Text`] in pixels. + /// + /// [`Text`]: struct.Text.html + pub fn size(mut self, size: u16) -> Self { + self.size = size; + self + } + + /// Sets the [`Color`] of the [`Text`]. + /// + /// [`Text`]: struct.Text.html + /// [`Color`]: ../../../graphics/struct.Color.html + pub fn color(mut self, color: Color) -> Self { + self.color = color; + self + } + + /// Sets the width of the [`Text`] boundaries in pixels. + /// + /// [`Text`]: struct.Text.html + pub fn width(mut self, width: u32) -> Self { + self.style = self.style.width(width); + self + } + + /// Sets the height of the [`Text`] boundaries in pixels. + /// + /// [`Text`]: struct.Text.html + pub fn height(mut self, height: u32) -> Self { + self.style = self.style.height(height); + self + } + + /// Sets the [`HorizontalAlignment`] of the [`Text`]. + /// + /// [`Text`]: struct.Text.html + /// [`HorizontalAlignment`]: ../../../graphics/enum.HorizontalAlignment.html + pub fn horizontal_alignment( + mut self, + alignment: HorizontalAlignment, + ) -> Self { + self.horizontal_alignment = alignment; + self + } + + /// Sets the [`VerticalAlignment`] of the [`Text`]. + /// + /// [`Text`]: struct.Text.html + /// [`VerticalAlignment`]: ../../../graphics/enum.VerticalAlignment.html + pub fn vertical_alignment(mut self, alignment: VerticalAlignment) -> Self { + self.vertical_alignment = alignment; + self + } +} + +impl Widget for Text +where + Color: Copy + std::fmt::Debug, + Renderer: self::Renderer, +{ + fn node(&self, renderer: &Renderer) -> Node { + renderer.node(self.style, &self.content, self.size as f32) + } + + fn draw( + &self, + renderer: &mut Renderer, + layout: Layout<'_>, + _cursor_position: Point, + ) -> MouseCursor { + renderer.draw( + layout.bounds(), + &self.content, + self.size as f32, + self.color, + self.horizontal_alignment, + self.vertical_alignment, + ); + + MouseCursor::OutOfBounds + } + + fn hash(&self, state: &mut Hasher) { + self.style.hash(state); + + self.content.hash(state); + self.size.hash(state); + } +} + +/// The renderer of a [`Text`] fragment. +/// +/// Your [`core::Renderer`] will need to implement this trait before being +/// able to use a [`Text`] in your user interface. +/// +/// [`Text`]: struct.Text.html +/// [`core::Renderer`]: ../../core/trait.Renderer.html +pub trait Renderer { + /// Creates a [`Node`] with the given [`Style`] for the provided [`Text`] + /// contents and size. + /// + /// You should probably use [`Node::with_measure`] to allow [`Text`] to + /// adapt to the dimensions of its container. + /// + /// [`Node`]: ../../core/struct.Node.html + /// [`Style`]: ../../core/struct.Style.html + /// [`Text`]: struct.Text.html + /// [`Node::with_measure`]: ../../core/struct.Node.html#method.with_measure + fn node(&self, style: Style, content: &str, size: f32) -> Node; + + /// Draws a [`Text`] fragment. + /// + /// It receives: + /// * the bounds of the [`Text`] + /// * the contents of the [`Text`] + /// * the size of the [`Text`] + /// * the color of the [`Text`] + /// * the [`HorizontalAlignment`] of the [`Text`] + /// * the [`VerticalAlignment`] of the [`Text`] + /// + /// [`Text`]: struct.Text.html + /// [`HorizontalAlignment`]: ../../../graphics/enum.HorizontalAlignment.html + /// [`VerticalAlignment`]: ../../../graphics/enum.VerticalAlignment.html + fn draw( + &mut self, + bounds: Rectangle, + content: &str, + size: f32, + color: Color, + horizontal_alignment: HorizontalAlignment, + vertical_alignment: VerticalAlignment, + ); +} + +impl<'a, Message, Renderer, Color> From> + for Element<'a, Message, Renderer> +where + Color: 'static + Copy + std::fmt::Debug, + Renderer: self::Renderer, +{ + fn from(text: Text) -> Element<'a, Message, Renderer> { + Element::new(text) + } +} + +/// The horizontal alignment of some resource. +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum HorizontalAlignment { + /// Align left + Left, + + /// Horizontally centered + Center, + + /// Align right + Right, +} + +/// The vertical alignment of some resource. +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum VerticalAlignment { + /// Align top + Top, + + /// Vertically centered + Center, + + /// Align bottom + Bottom, +}