From 40f45d7b7e35dd4937abe6b5ce16b6256b4f1eeb Mon Sep 17 00:00:00 2001 From: shan Date: Thu, 29 Sep 2022 10:52:58 -0700 Subject: Adds linear gradient support to 2D meshes in the canvas widget. --- examples/geometry/src/main.rs | 41 +++++++++++++++++++++++------------------ 1 file changed, 23 insertions(+), 18 deletions(-) (limited to 'examples/geometry/src') diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs index d8b99ab3..a8ce26f8 100644 --- a/examples/geometry/src/main.rs +++ b/examples/geometry/src/main.rs @@ -1,6 +1,9 @@ //! This example showcases a simple native custom widget that renders using //! arbitrary low-level geometry. +//! +//TODO need to update this now that vertex data doesn't contain color data mod rainbow { + use iced::Color; // For now, to implement a custom native widget you will need to add // `iced_native` and `iced_wgpu` to your dependencies. // @@ -12,6 +15,7 @@ mod rainbow { // implemented by `iced_wgpu` and other renderers. use iced_graphics::renderer::{self, Renderer}; use iced_graphics::{Backend, Primitive}; + use iced_graphics::shader::Shader; use iced_native::widget::{self, Widget}; use iced_native::{ @@ -63,20 +67,20 @@ mod rainbow { cursor_position: Point, _viewport: &Rectangle, ) { - use iced_graphics::triangle::{Mesh2D, Vertex2D}; + use iced_graphics::triangle::{Mesh2D, Shader, Vertex2D}; use iced_native::Renderer as _; let b = layout.bounds(); // R O Y G B I V - let color_r = [1.0, 0.0, 0.0, 1.0]; - let color_o = [1.0, 0.5, 0.0, 1.0]; - let color_y = [1.0, 1.0, 0.0, 1.0]; - let color_g = [0.0, 1.0, 0.0, 1.0]; - let color_gb = [0.0, 1.0, 0.5, 1.0]; - let color_b = [0.0, 0.2, 1.0, 1.0]; - let color_i = [0.5, 0.0, 1.0, 1.0]; - let color_v = [0.75, 0.0, 0.5, 1.0]; + // let color_r = [1.0, 0.0, 0.0, 1.0]; + // let color_o = [1.0, 0.5, 0.0, 1.0]; + // let color_y = [1.0, 1.0, 0.0, 1.0]; + // let color_g = [0.0, 1.0, 0.0, 1.0]; + // let color_gb = [0.0, 1.0, 0.5, 1.0]; + // let color_b = [0.0, 0.2, 1.0, 1.0]; + // let color_i = [0.5, 0.0, 1.0, 1.0]; + // let color_v = [0.75, 0.0, 0.5, 1.0]; let posn_center = { if b.contains(cursor_position) { @@ -101,39 +105,39 @@ mod rainbow { vertices: vec![ Vertex2D { position: posn_center, - color: [1.0, 1.0, 1.0, 1.0], + // color: [1.0, 1.0, 1.0, 1.0], }, Vertex2D { position: posn_tl, - color: color_r, + // color: color_r, }, Vertex2D { position: posn_t, - color: color_o, + // color: color_o, }, Vertex2D { position: posn_tr, - color: color_y, + // color: color_y, }, Vertex2D { position: posn_r, - color: color_g, + // color: color_g, }, Vertex2D { position: posn_br, - color: color_gb, + // color: color_gb, }, Vertex2D { position: posn_b, - color: color_b, + // color: color_b, }, Vertex2D { position: posn_bl, - color: color_i, + // color: color_i, }, Vertex2D { position: posn_l, - color: color_v, + // color: color_v, }, ], indices: vec![ @@ -147,6 +151,7 @@ mod rainbow { 0, 8, 1, // L ], }, + shader: Shader::Solid(Color::BLACK), }; renderer.with_translation(Vector::new(b.x, b.y), |renderer| { -- cgit From 30432cbade3d9b25c4df62656a7494db3f4ea82a Mon Sep 17 00:00:00 2001 From: shan Date: Wed, 5 Oct 2022 10:49:58 -0700 Subject: Readjusted namespaces, removed Geometry example as it's no longer relevant. --- examples/geometry/src/main.rs | 222 ------------------------------------------ 1 file changed, 222 deletions(-) delete mode 100644 examples/geometry/src/main.rs (limited to 'examples/geometry/src') diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs deleted file mode 100644 index a8ce26f8..00000000 --- a/examples/geometry/src/main.rs +++ /dev/null @@ -1,222 +0,0 @@ -//! This example showcases a simple native custom widget that renders using -//! arbitrary low-level geometry. -//! -//TODO need to update this now that vertex data doesn't contain color data -mod rainbow { - use iced::Color; - // For now, to implement a custom native widget you will need to add - // `iced_native` and `iced_wgpu` to your dependencies. - // - // Then, you simply need to define your widget type and implement the - // `iced_native::Widget` trait with the `iced_wgpu::Renderer`. - // - // Of course, you can choose to make the implementation renderer-agnostic, - // if you wish to, by creating your own `Renderer` trait, which could be - // implemented by `iced_wgpu` and other renderers. - use iced_graphics::renderer::{self, Renderer}; - use iced_graphics::{Backend, Primitive}; - use iced_graphics::shader::Shader; - - use iced_native::widget::{self, Widget}; - use iced_native::{ - layout, Element, Layout, Length, Point, Rectangle, Size, Vector, - }; - - #[derive(Default)] - pub struct Rainbow; - - impl Rainbow { - pub fn new() -> Self { - Self - } - } - - pub fn rainbow() -> Rainbow { - Rainbow - } - - impl Widget> for Rainbow - where - B: Backend, - { - fn width(&self) -> Length { - Length::Fill - } - - fn height(&self) -> Length { - Length::Shrink - } - - fn layout( - &self, - _renderer: &Renderer, - limits: &layout::Limits, - ) -> layout::Node { - let size = limits.width(Length::Fill).resolve(Size::ZERO); - - layout::Node::new(Size::new(size.width, size.width)) - } - - fn draw( - &self, - _tree: &widget::Tree, - renderer: &mut Renderer, - _theme: &T, - _style: &renderer::Style, - layout: Layout<'_>, - cursor_position: Point, - _viewport: &Rectangle, - ) { - use iced_graphics::triangle::{Mesh2D, Shader, Vertex2D}; - use iced_native::Renderer as _; - - let b = layout.bounds(); - - // R O Y G B I V - // let color_r = [1.0, 0.0, 0.0, 1.0]; - // let color_o = [1.0, 0.5, 0.0, 1.0]; - // let color_y = [1.0, 1.0, 0.0, 1.0]; - // let color_g = [0.0, 1.0, 0.0, 1.0]; - // let color_gb = [0.0, 1.0, 0.5, 1.0]; - // let color_b = [0.0, 0.2, 1.0, 1.0]; - // let color_i = [0.5, 0.0, 1.0, 1.0]; - // let color_v = [0.75, 0.0, 0.5, 1.0]; - - let posn_center = { - if b.contains(cursor_position) { - [cursor_position.x - b.x, cursor_position.y - b.y] - } else { - [b.width / 2.0, b.height / 2.0] - } - }; - - let posn_tl = [0.0, 0.0]; - let posn_t = [b.width / 2.0, 0.0]; - let posn_tr = [b.width, 0.0]; - let posn_r = [b.width, b.height / 2.0]; - let posn_br = [b.width, b.height]; - let posn_b = [(b.width / 2.0), b.height]; - let posn_bl = [0.0, b.height]; - let posn_l = [0.0, b.height / 2.0]; - - let mesh = Primitive::Mesh2D { - size: b.size(), - buffers: Mesh2D { - vertices: vec![ - Vertex2D { - position: posn_center, - // color: [1.0, 1.0, 1.0, 1.0], - }, - Vertex2D { - position: posn_tl, - // color: color_r, - }, - Vertex2D { - position: posn_t, - // color: color_o, - }, - Vertex2D { - position: posn_tr, - // color: color_y, - }, - Vertex2D { - position: posn_r, - // color: color_g, - }, - Vertex2D { - position: posn_br, - // color: color_gb, - }, - Vertex2D { - position: posn_b, - // color: color_b, - }, - Vertex2D { - position: posn_bl, - // color: color_i, - }, - Vertex2D { - position: posn_l, - // color: color_v, - }, - ], - indices: vec![ - 0, 1, 2, // TL - 0, 2, 3, // T - 0, 3, 4, // TR - 0, 4, 5, // R - 0, 5, 6, // BR - 0, 6, 7, // B - 0, 7, 8, // BL - 0, 8, 1, // L - ], - }, - shader: Shader::Solid(Color::BLACK), - }; - - renderer.with_translation(Vector::new(b.x, b.y), |renderer| { - renderer.draw_primitive(mesh); - }); - } - } - - impl<'a, Message, B, T> From for Element<'a, Message, Renderer> - where - B: Backend, - { - fn from(rainbow: Rainbow) -> Self { - Self::new(rainbow) - } - } -} - -use iced::widget::{column, container, scrollable}; -use iced::{Alignment, Element, Length, Sandbox, Settings}; -use rainbow::rainbow; - -pub fn main() -> iced::Result { - Example::run(Settings::default()) -} - -struct Example; - -impl Sandbox for Example { - type Message = (); - - fn new() -> Self { - Example - } - - fn title(&self) -> String { - String::from("Custom 2D geometry - Iced") - } - - fn update(&mut self, _: ()) {} - - fn view(&self) -> Element<()> { - let content = column![ - rainbow(), - "In this example we draw a custom widget Rainbow, using \ - the Mesh2D primitive. This primitive supplies a list of \ - triangles, expressed as vertices and indices.", - "Move your cursor over it, and see the center vertex \ - follow you!", - "Every Vertex2D defines its own color. You could use the \ - Mesh2D primitive to render virtually any two-dimensional \ - geometry for your widget.", - ] - .padding(20) - .spacing(20) - .max_width(500) - .align_items(Alignment::Start); - - let scrollable = - scrollable(container(content).width(Length::Fill).center_x()); - - container(scrollable) - .width(Length::Fill) - .height(Length::Fill) - .center_y() - .into() - } -} -- cgit From 324d60db6319017304bf0b514b76db98b3637929 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Mon, 28 Nov 2022 19:42:53 +0100 Subject: Re-introduce the `geometry` example --- examples/geometry/src/main.rs | 213 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 213 insertions(+) create mode 100644 examples/geometry/src/main.rs (limited to 'examples/geometry/src') diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs new file mode 100644 index 00000000..4de281fe --- /dev/null +++ b/examples/geometry/src/main.rs @@ -0,0 +1,213 @@ +//! This example showcases a simple native custom widget that renders using +//! arbitrary low-level geometry. +mod rainbow { + // For now, to implement a custom native widget you will need to add + // `iced_native` and `iced_wgpu` to your dependencies. + // + // Then, you simply need to define your widget type and implement the + // `iced_native::Widget` trait with the `iced_wgpu::Renderer`. + // + // Of course, you can choose to make the implementation renderer-agnostic, + // if you wish to, by creating your own `Renderer` trait, which could be + // implemented by `iced_wgpu` and other renderers. + use iced_graphics::renderer::{self, Renderer}; + use iced_graphics::triangle::ColoredVertex2D; + use iced_graphics::{Backend, Primitive}; + + use iced_native::layout; + use iced_native::widget::{self, Widget}; + use iced_native::{ + Element, Layout, Length, Point, Rectangle, Size, Vector, + }; + + pub struct Rainbow; + + impl Rainbow { + pub fn new() -> Self { + Self + } + } + + impl Widget> for Rainbow + where + B: Backend, + { + fn width(&self) -> Length { + Length::Fill + } + + fn height(&self) -> Length { + Length::Shrink + } + + fn layout( + &self, + _renderer: &Renderer, + limits: &layout::Limits, + ) -> layout::Node { + let size = limits.width(Length::Fill).resolve(Size::ZERO); + + layout::Node::new(Size::new(size.width, size.width)) + } + + fn draw( + &self, + _tree: &widget::Tree, + renderer: &mut Renderer, + _theme: &T, + _style: &renderer::Style, + layout: Layout<'_>, + cursor_position: Point, + _viewport: &Rectangle, + ) { + use iced_graphics::triangle::Mesh2D; + use iced_native::Renderer as _; + + let b = layout.bounds(); + + // R O Y G B I V + let color_r = [1.0, 0.0, 0.0, 1.0]; + let color_o = [1.0, 0.5, 0.0, 1.0]; + let color_y = [1.0, 1.0, 0.0, 1.0]; + let color_g = [0.0, 1.0, 0.0, 1.0]; + let color_gb = [0.0, 1.0, 0.5, 1.0]; + let color_b = [0.0, 0.2, 1.0, 1.0]; + let color_i = [0.5, 0.0, 1.0, 1.0]; + let color_v = [0.75, 0.0, 0.5, 1.0]; + + let posn_center = { + if b.contains(cursor_position) { + [cursor_position.x - b.x, cursor_position.y - b.y] + } else { + [b.width / 2.0, b.height / 2.0] + } + }; + + let posn_tl = [0.0, 0.0]; + let posn_t = [b.width / 2.0, 0.0]; + let posn_tr = [b.width, 0.0]; + let posn_r = [b.width, b.height / 2.0]; + let posn_br = [b.width, b.height]; + let posn_b = [(b.width / 2.0), b.height]; + let posn_bl = [0.0, b.height]; + let posn_l = [0.0, b.height / 2.0]; + + let mesh = Primitive::SolidMesh { + size: b.size(), + buffers: Mesh2D { + vertices: vec![ + ColoredVertex2D { + position: posn_center, + color: [1.0, 1.0, 1.0, 1.0], + }, + ColoredVertex2D { + position: posn_tl, + color: color_r, + }, + ColoredVertex2D { + position: posn_t, + color: color_o, + }, + ColoredVertex2D { + position: posn_tr, + color: color_y, + }, + ColoredVertex2D { + position: posn_r, + color: color_g, + }, + ColoredVertex2D { + position: posn_br, + color: color_gb, + }, + ColoredVertex2D { + position: posn_b, + color: color_b, + }, + ColoredVertex2D { + position: posn_bl, + color: color_i, + }, + ColoredVertex2D { + position: posn_l, + color: color_v, + }, + ], + indices: vec![ + 0, 1, 2, // TL + 0, 2, 3, // T + 0, 3, 4, // TR + 0, 4, 5, // R + 0, 5, 6, // BR + 0, 6, 7, // B + 0, 7, 8, // BL + 0, 8, 1, // L + ], + }, + }; + + renderer.with_translation(Vector::new(b.x, b.y), |renderer| { + renderer.draw_primitive(mesh); + }); + } + } + + impl<'a, Message, B, T> From for Element<'a, Message, Renderer> + where + B: Backend, + { + fn from(rainbow: Rainbow) -> Self { + Self::new(rainbow) + } + } +} + +use iced::widget::{column, container, scrollable}; +use iced::{Element, Length, Sandbox, Settings}; +use rainbow::Rainbow; + +pub fn main() -> iced::Result { + Example::run(Settings::default()) +} + +struct Example; + +impl Sandbox for Example { + type Message = (); + + fn new() -> Self { + Self + } + + fn title(&self) -> String { + String::from("Custom 2D geometry - Iced") + } + + fn update(&mut self, _: ()) {} + + fn view(&self) -> Element<()> { + let content = column![ + Rainbow::new(), + "In this example we draw a custom widget Rainbow, using \ + the Mesh2D primitive. This primitive supplies a list of \ + triangles, expressed as vertices and indices.", + "Move your cursor over it, and see the center vertex \ + follow you!", + "Every Vertex2D defines its own color. You could use the \ + Mesh2D primitive to render virtually any two-dimensional \ + geometry for your widget.", + ] + .padding(20) + .spacing(20) + .max_width(500); + + let scrollable = + scrollable(container(content).width(Length::Fill).center_x()); + + container(scrollable) + .width(Length::Fill) + .height(Length::Fill) + .center_y() + .into() + } +} -- cgit From bb2bf063b472396d44f9f3114a87ba79dfd5f62e Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Mon, 28 Nov 2022 19:49:23 +0100 Subject: Derive `Default` for `Rainbow` in `geometry` example --- examples/geometry/src/main.rs | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) (limited to 'examples/geometry/src') diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs index 4de281fe..9bacce7f 100644 --- a/examples/geometry/src/main.rs +++ b/examples/geometry/src/main.rs @@ -20,12 +20,11 @@ mod rainbow { Element, Layout, Length, Point, Rectangle, Size, Vector, }; + #[derive(Debug, Clone, Copy, Default)] pub struct Rainbow; - impl Rainbow { - pub fn new() -> Self { - Self - } + pub fn rainbow() -> Rainbow { + Rainbow } impl Widget> for Rainbow @@ -164,7 +163,7 @@ mod rainbow { use iced::widget::{column, container, scrollable}; use iced::{Element, Length, Sandbox, Settings}; -use rainbow::Rainbow; +use rainbow::rainbow; pub fn main() -> iced::Result { Example::run(Settings::default()) @@ -187,7 +186,7 @@ impl Sandbox for Example { fn view(&self) -> Element<()> { let content = column![ - Rainbow::new(), + rainbow(), "In this example we draw a custom widget Rainbow, using \ the Mesh2D primitive. This primitive supplies a list of \ triangles, expressed as vertices and indices.", -- cgit